Scaffold भित्र र AppBar भित्र UI निर्माण गर्दै Flutter

मा Flutter, तपाइँ एक सरल तर शक्तिशाली प्रयोगकर्ता इन्टरफेस Scaffold र AppBar विजेटहरू प्रयोग गरेर निर्माण गर्न सक्नुहुन्छ। Scaffold एप बार, एप बडी र नेभिगेसन बटनहरू जस्ता सामान्य तत्वहरू भएको एपको लागि आधारभूत संरचना प्रदान गर्दछ। AppBar को एक भाग हो Scaffold र एप शीर्षक र नेभिगेसन विकल्पहरू समावेश गर्दछ।

तल कसरी प्रयोग गरेर सरल प्रयोगकर्ता इन्टरफेस निर्माण गर्ने बारे एक गाइड Scaffold छ AppBar:

नयाँ Flutter एप बनाउनुहोस्

Flutter पहिले, निम्न आदेश चलाएर नयाँ एप सिर्जना गर्नुहोस् terminal:

flutter create app_name

( app_name तपाईंको एपको इच्छित नामको साथ बदल्नुहोस्)।

main.dart फाइल सम्पादन गर्नुहोस्

main.dart फाइलमा(lib फोल्डर भित्र), निम्नसँग सामग्री बदल्नुहोस्:

import 'package:flutter/material.dart';  
  
void main() {  
  runApp(MyApp());  
}  
  
class MyApp extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return MaterialApp(  
      home: MyHomePage(),  
   );  
  }  
}  
  
class MyHomePage extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
      appBar: AppBar(  
        title: Text('Flutter App with Scaffold and AppBar'),  
     ),  
      body: Center(  
        child: Text('Hello, world!'),  
     ),  
   );  
  }  
}  

माथिको उदाहरणमा, हामी Scaffold र सँग एउटा एप सिर्जना गर्छौं AppBar । सम्पत्तिमा पास गरिएको प्रयोगकर्ता इन्टरफेस बडी र Scaffold समावेश गर्दछ । AppBar body

एप चलाउनुहोस्

अन्तमा, एप चलाउनको लागि, निम्न आदेश चलाउनुहोस् terminal:

flutter run

तपाईंको एपले एप बारमा " Flutter App with Scaffold र " शीर्षक भएको स्क्रिन र  स्क्रिनको बिचमा पाठ देखाउनेछ । AppBar Hello, world!

 

निष्कर्ष: Scaffold र AppBar दुई आवश्यक विजेटहरू हुन् Flutter जसले तपाईंलाई सरल र कार्यात्मक प्रयोगकर्ता इन्टरफेस निर्माण गर्न मद्दत गर्दछ। तिनीहरूलाई प्रयोग गरेर, तपाईंले एप बार र एप बडी जस्ता आधारभूत UI कम्पोनेन्टहरूसँग आकर्षक एपहरू सिर्जना गर्न सक्नुहुन्छ।