close

బిల్డింగ్ UI తో Scaffold మరియు AppBar లోపల Flutter

లో, మీరు విడ్జెట్‌లను ఉపయోగించి Flutter సరళమైన ఇంకా శక్తివంతమైన వినియోగదారు ఇంటర్‌ఫేస్‌ను రూపొందించవచ్చు. యాప్ బార్, యాప్ బాడీ మరియు నావిగేషన్ బటన్‌ల వంటి సాధారణ అంశాలతో యాప్ కోసం ప్రాథమిక నిర్మాణాన్ని అందిస్తుంది. అనువర్తన శీర్షిక మరియు నావిగేషన్ ఎంపికలలో భాగం మరియు కలిగి ఉంది. Scaffold AppBar Scaffold AppBar Scaffold

Scaffold మరియు ఉపయోగించి సాధారణ వినియోగదారు ఇంటర్‌ఫేస్‌ను ఎలా నిర్మించాలో క్రింద ఒక గైడ్ ఉంది AppBar:

కొత్త Flutter యాప్‌ని సృష్టించండి

Flutter మొదట, కింది ఆదేశాన్ని అమలు చేయడం ద్వారా కొత్త అనువర్తనాన్ని సృష్టించండి terminal:

flutter create app_name

( app_name మీ యాప్‌కి కావలసిన పేరుతో భర్తీ చేయండి).

main.dart ఫైల్‌ని సవరించండి

main.dart ఫైల్‌లో(లిబ్ ఫోల్డర్ లోపల), కింది వాటితో కంటెంట్‌ను భర్తీ చేయండి:

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 మీ యాప్ యాప్ బార్‌లో " యాప్ విత్ Scaffold మరియు " టైటిల్‌తో స్క్రీన్‌ను ప్రదర్శిస్తుంది మరియు  స్క్రీన్ మధ్యలో AppBar టెక్స్ట్ ఉంటుంది. Hello, world!

 

ముగింపు: Scaffold మరియు సాధారణ మరియు ఫంక్షనల్ యూజర్ ఇంటర్‌ఫేస్‌ను రూపొందించడంలో మీకు సహాయపడే AppBar రెండు ముఖ్యమైన విడ్జెట్‌లు. Flutter వాటిని ఉపయోగించడం ద్వారా, మీరు యాప్ బార్ మరియు యాప్ బాడీ వంటి ప్రాథమిక UI భాగాలతో ఆకర్షణీయమైన యాప్‌లను సృష్టించవచ్చు.