凸起按钮的配置

凸起按钮的配置

 

 

凸起按钮的配置

 

 

import 'package:flutter/material.dart'; import 'tabs/Home.dart'; import 'tabs/Setting.dart'; import 'tabs/Category.dart';
class Tabs extends StatefulWidget {   Tabs({Key? key}) : super(key: key);
  @override   _TabsState createState() => _TabsState(); }
class _TabsState extends State<Tabs> {   int _currentIndex = 0;
  List _pageList = [     HomePage(),     CategoryPage(),     SeetingPage(),   ];   @override   Widget build(BuildContext context) {     return Scaffold(       appBar: AppBar(         title: Text("flutter  Demo"),       ),       floatingActionButton: Container(         height: 80,         width: 80,         padding: EdgeInsets.all(8),         margin: EdgeInsets.only(top: 10),         decoration: BoxDecoration(           borderRadius: BorderRadius.circular(40),           color: Colors.white,         ),         child: FloatingActionButton(           child: Icon(             Icons.add,             color: Colors.white,             size: 40,           ),           onPressed: () {             setState(() {               this._currentIndex = 1;             });           },           backgroundColor: this._currentIndex == 1 ? Colors.red : Colors.yellow,         ),       ),       floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,       body: this._pageList[this._currentIndex],       bottomNavigationBar: BottomNavigationBar(         currentIndex: this._currentIndex, // 配置选中的索引         onTap: (int index) {           // print(index);           setState(() {             this._currentIndex = index;           });         },         iconSize: 36.0, // 设置图标大小         fixedColor: Colors.red, // 选中的颜色         type: BottomNavigationBarType.fixed, // 配置底部tabs 可以有多个按钮         items: [           BottomNavigationBarItem(             icon: Icon(Icons.home),             title: Text("首页"),           ),           BottomNavigationBarItem(             icon: Icon(Icons.category),             title: Text("分类"),           ),           BottomNavigationBarItem(             icon: Icon(Icons.settings),             title: Text("设置"),           ),         ],       ),       drawer: Drawer(         child: Column(           children: [             Row(               children: [                 Expanded(                   child: UserAccountsDrawerHeader(                     accountName: Text("Eric"),                     accountEmail: Text("12@qw.com"),                     currentAccountPicture: CircleAvatar(                       backgroundImage: NetworkImage(                           "https://www.itying.com/images/flutter/3.png"),                     ),                     decoration: BoxDecoration(                       image: DecorationImage(                         image: NetworkImage(                             "https://www.itying.com/images/flutter/2.png"),                         fit: BoxFit.cover,                       ),                     ),                     otherAccountsPictures: [                       Image.network(                           "https://www.itying.com/images/flutter/4.png"),                       Image.network(                           "https://www.itying.com/images/flutter/5.png"),                       Image.network(                           "https://www.itying.com/images/flutter/6.png"),                       Image.network(                           "https://www.itying.com/images/flutter/2.png")                     ],                   ),                 ),               ],             ),             ListTile(               leading: CircleAvatar(                 child: Icon(Icons.home),               ),               title: Text("我的空间"),             ),             Divider(),             ListTile(                 leading: CircleAvatar(                   child: Icon(Icons.people),                 ),                 title: Text("用户中心"),                 onTap: () {                   Navigator.of(context).pop(); // 隐藏侧边栏                   Navigator.pushNamed(context, '/user');                 }),             Divider(),             ListTile(               leading: CircleAvatar(                 child: Icon(Icons.settings),               ),               title: Text("设置中心"),             ),             Divider(),           ],         ),       ),       endDrawer: Drawer(         child: Text('你好'),       ),     );   } }
上一篇:vue利用transition过渡动画实现轮播图


下一篇:项目经理(PM)