#flutter #flutter-layout
Вопрос:
Я должен нарисовать верхнюю панель, показанную ниже, в flutter, чтобы она отображалась в приложении, в ней должно быть 3 кнопки и текстовое поле поиска, и где должен быть нарисован фон, как показано на рисунке, у вас есть фрагмент кода для этого?Виджет ниже позволяет отображать панель мониторинга пользователя в приложении flutter,но я должен вставить указанное меню вверху
Код Флаттера:
//List of books user Listlt;Bookgt;? booklistuser; Listlt;Bookgt;? booklistdashboard; class DashBoardPage extends StatefulWidget { DashBoardPage({Key? key}) : super(key: key); @override _DashBoardPageState createState() =gt; _DashBoardPageState(); } class _DashBoardPageState extends Statelt;DashBoardPagegt; { var totmessage = 0; Futurelt;boolgt; getData() async { var u = new Utente(); totmessage = await u.countmessageuser(); booklistuser = await Book.getbooklist(false); booklistdashboard = await Book.getbooklist(true); return true; } @override Widget build(BuildContext context) { return FutureBuilderlt;boolgt;( future: getData(), builder: (BuildContext context, AsyncSnapshotlt;boolgt; snapshot) { if (!snapshot.hasData) { return const SizedBox(); } else { return Scaffold( appBar: AppBar( toolbarHeight: 90, // Set this height flexibleSpace: Container( color: '#AC9359'.toColor(), child: Column( children: [ Padding( padding: EdgeInsets.only(right: 10.0), child: RawMaterialButton( onPressed: () {}, elevation: 4.0, fillColor: '#FBFEE4'.toColor(), child: Icon( Icons.mail, size: 15.0, ), shape: CircleBorder(), ), ), Padding( padding: EdgeInsets.only(right: 5.0), child: RawMaterialButton( onPressed: () {}, elevation: 2.0, fillColor: '#FBFEE4'.toColor(), child: Icon( Icons.supervised_user_circle_outlined, size: 15.0, ), shape: CircleBorder(), ), ), ], ), ), ), /*AppBar( backgroundColor: '#AC9359'.toColor(), automaticallyImplyLeading: false, elevation: 200.0, leading: TextField( decoration: InputDecoration( border: OutlineInputBorder( borderRadius: BorderRadius.circular(10.0), ), filled: true, hintStyle: TextStyle(color: Colors.grey[800]), hintText: "Type in your text", fillColor: Colors.white70), ), actions: lt;Widgetgt;[ Padding( padding: EdgeInsets.only(right: 10.0), child: RawMaterialButton( onPressed: () {}, elevation: 4.0, fillColor: '#FBFEE4'.toColor(), child: Icon( Icons.mail, size: 15.0, ), shape: CircleBorder(), ), ), Padding( padding: EdgeInsets.only(right: 5.0), child: RawMaterialButton( onPressed: () {}, elevation: 2.0, fillColor: '#FBFEE4'.toColor(), child: Icon( Icons.supervised_user_circle_outlined, size: 15.0, ), shape: CircleBorder(), ), ), ], iconTheme: IconThemeData(color: Colors.black), ),*/ drawer: NavigationDrawerWidget(), body: Builder( builder: (context) =gt; Container( margin: const EdgeInsets.only(left: 10.0, top: 20.0), child: ListView( children: lt;Widgetgt;[ Text("Dashboard", style: TextStyle( fontSize: 25.0, fontWeight: FontWeight.bold, fontFamily: "Roboto", color: '#448BB5'.toColor())), Center( child: Row( children: lt;Widgetgt;[ SizedBox(width: 4), Container( height: 90, width: 90, child: Center( child: Image.asset('assets/libri.png'), ), ), SizedBox(width: 4), InkWell( onTap: () { Navigator.push( context, MaterialPageRoute( builder: (context) =gt; MarketPlacePage()), ); }, child: Container( height: 90, width: 90, child: Center( child: Image.asset('assets/market.png'), ), ), ), SizedBox(width: 4), Container( height: 90, width: 90, child: Center( child: Image.asset('assets/bacheca.png'), ), ), SizedBox(width: 4), Container( height: 90, width: 90, child: Center( child: Image.asset('assets/messaggi.png'), ), ), ], )), SizedBox(height: 10), Text( "credito: 22 euro | hai " totmessage.toString() " nuovi messaggi", style: TextStyle( fontSize: 18.0, fontWeight: FontWeight.bold, fontFamily: "Roboto", color: '#448BB5'.toColor())), SizedBox(height: 20), Text("I tuoi libri", style: TextStyle( fontSize: 25.0, fontWeight: FontWeight.bold, fontFamily: "Roboto", color: '#448BB5'.toColor())), new SingleChildScrollView( child: Container( height: 220, child: new ListView.builder( shrinkWrap: true, scrollDirection: Axis.horizontal, itemCount: booklistuser!.length, itemBuilder: (BuildContext context, int index) { return new Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [ new Container( height: 120, width: 100, margin: EdgeInsets.all(2), child: Center( child: Image.network( '${booklistuser![index].imgUrl}'), ), ), new Container( height: 30, width: 60, child: Center( child: RatingBarIndicator( rating: booklistuser![index] .productReviewAverage, itemBuilder: (context, index) =gt; Icon( Icons.star, color: Colors.amber, ), itemCount: 5, itemSize: 10.0, direction: Axis.horizontal, ), ), ), new Container( width: 80, height: 30, child: Center( child: Text( ' ${booklistuser![index].title}', style: TextStyle( fontSize: 12.0, fontWeight: FontWeight.normal, fontFamily: "Roboto")), ), ), ], ); }, ), ), ), SizedBox(height: 20), Text("Novità editoriali", style: TextStyle( fontSize: 25.0, fontWeight: FontWeight.bold, fontFamily: "Roboto", color: '#448BB5'.toColor())), SizedBox(height: 10), new SingleChildScrollView( child: Container( height: 300, child: new ListView.builder( shrinkWrap: true, scrollDirection: Axis.horizontal, itemCount: booklistdashboard!.length, itemBuilder: (BuildContext context, int index) { return new Column( mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center, children: [ new Container( height: 180, width: 100, margin: EdgeInsets.all(2), child: Center( child: Image.network( '${booklistdashboard![index].imgUrl}'), ), ), new Container( height: 30, width: 60, child: Center( child: RatingBarIndicator( rating: booklistdashboard![index] .productReviewAverage, itemBuilder: (context, index) =gt; Icon( Icons.star, color: Colors.amber, ), itemCount: 5, itemSize: 10.0, direction: Axis.horizontal, ), ), ), new Container( width: 80, height: 30, child: Center( child: Text( ' ${booklistdashboard![index].title}', style: TextStyle( fontSize: 12.0, fontWeight: FontWeight.bold, fontFamily: "Roboto")), ), ), new Container( width: 80, height: 30, child: Center( child: Text( ' ${booklistdashboard![index].author}', style: TextStyle( fontSize: 12.0, fontWeight: FontWeight.normal, fontFamily: "Roboto")), ), ), ], ); }, ), ), ), ], ), ))); } }); } }
Комментарии:
1. Пожалуйста, предоставьте достаточно кода, чтобы другие могли лучше понять или воспроизвести проблему.