fix: using appbar avoid floating button overlap

evan361425 · Feb 27, 2023 · 8c33a40 · 8c33a40
1 parent 12c12fc
commit 8c33a40
Show file tree

Hide file tree

Showing 6 changed files with 79 additions and 83 deletions.
diff --git a/lib/ui/home/home_scaffold.dart b/lib/ui/home/home_scaffold.dart
@@ -23,45 +23,39 @@ class _HomeScaffoldState extends State<HomeScaffold>
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      floatingActionButton: FloatingActionButton(
-        key: const Key('home.order'),
-        onPressed: () => Navigator.of(context).pushNamed(Routes.order),
-        tooltip: '點餐',
-        child: const Icon(Icons.local_grocery_store_outlined),
-      ),
-      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
-      bottomNavigationBar: Container(
-        decoration: BoxDecoration(
-          gradient: LinearGradient(
-            begin: Alignment.topLeft,
-            end: Alignment.bottomRight,
-            colors: Theme.of(context).gradientColors,
-            tileMode: TileMode.clamp,
+      appBar: AppBar(
+        title: Text(S.appTitle),
+        centerTitle: true,
+        shadowColor: Theme.of(context).colorScheme.shadow,
+        flexibleSpace: Container(
+          decoration: BoxDecoration(
+            gradient: LinearGradient(
+              begin: Alignment.topLeft,
+              end: Alignment.bottomRight,
+              colors: Theme.of(context).gradientColors,
+              tileMode: TileMode.clamp,
+            ),
           ),
         ),
-        child: TabBar(
+        notificationPredicate: (ScrollNotification notification) {
+          return notification.depth == 1;
+        },
+        scrolledUnderElevation: 4.0,
+        actions: [
+          TextButton(
+            key: const Key('home.order'),
+            onPressed: () => Navigator.of(context).pushNamed(Routes.order),
+            child: const Text('點餐'),
+          )
+        ],
+        bottom: TabBar(
           controller: _tabController,
           tabs: [
             _CustomTab(
-              key: const Key('home.analysis'),
-              icon: Icons.equalizer_outlined,
-              text: S.homeTabAnalysis,
-            ),
-            _CustomTab(
-              key: const Key('home.stock'),
-              icon: Icons.store_outlined,
-              text: S.homeTabStock,
-            ),
-            _CustomTab(
-              key: const Key('home.cashier'),
-              icon: Icons.attach_money_outlined,
-              text: S.homeTabCashier,
-            ),
-            _CustomTab(
-              key: const Key('home.setting'),
-              icon: Icons.settings_outlined,
-              text: S.homeTabSetting,
-            ),
+                key: const Key('home.analysis'), text: S.homeTabAnalysis),
+            _CustomTab(key: const Key('home.stock'), text: S.homeTabStock),
+            _CustomTab(key: const Key('home.cashier'), text: S.homeTabCashier),
+            _CustomTab(key: const Key('home.setting'), text: S.homeTabSetting),
           ],
         ),
       ),
@@ -99,19 +93,15 @@ class _HomeScaffoldState extends State<HomeScaffold>
 class _CustomTab extends StatelessWidget {
   final String text;
 
-  final IconData icon;
-
   const _CustomTab({
     Key? key,
     required this.text,
-    required this.icon,
   }) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
     return Tab(
       iconMargin: const EdgeInsets.only(bottom: 6),
-      icon: Icon(icon),
       child: Text(
         text,
         style: const TextStyle(fontSize: 14),

diff --git a/lib/ui/home/home_setup_screen.dart b/lib/ui/home/home_setup_screen.dart
@@ -120,7 +120,7 @@ class _HomeSetupScreenState extends State<HomeSetupScreen> {
   void initState() {
     super.initState();
 
-    widget.tab?.bindAnt(antGaffer);
+    widget.tab?.bindAnt(antGaffer, startNow: true);
   }
 }
 

diff --git a/lib/ui/menu/menu_screen.dart b/lib/ui/menu/menu_screen.dart
@@ -44,7 +44,7 @@ class MenuScreen extends StatelessWidget {
       body: menu.isEmpty
           ? Center(
               child: EmptyBody(
-              tooltip: '我們會把相似「產品」放在「產品種類」中，到時候點餐會比較方便。\n'
+              tooltip: '我們會把相似「產品」放在「產品種類」中，\n到時候點餐會比較方便。\n'
                   '例如：\n'
                   '「起司漢堡」、「蔬菜漢堡」整合進「漢堡」\n'
                   '「塑膠袋」、「環保杯」整合進「其他」',

diff --git a/lib/ui/menu/product/widgets/ingredient_expansion_card.dart b/lib/ui/menu/product/widgets/ingredient_expansion_card.dart
@@ -15,30 +15,28 @@ class IngredientExpansionCard extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final key = 'product_ingredient.${ingredient.id}';
-    return Card(
-      child: ExpansionTile(
-        key: Key(key),
-        title: Text(ingredient.name),
-        subtitle: Text(S.menuIngredientMetaAmount(ingredient.amount)),
-        expandedCrossAxisAlignment: CrossAxisAlignment.stretch,
-        children: [
-          ListTile(
-              key: Key('$key.add'),
-              leading: const CircleAvatar(child: Icon(KIcons.add)),
-              title: Text(S.menuQuantityCreate),
-              onTap: () => Navigator.of(context).pushNamed(
-                    Routes.menuQuantity,
-                    arguments: ingredient,
-                  ),
-              trailing: IconButton(
-                key: Key('$key.more'),
-                onPressed: () => showActions(context),
-                enableFeedback: true,
-                icon: const Icon(KIcons.more),
-              )),
-          for (final item in ingredient.items) _QuantityTile(item),
-        ],
-      ),
+    return ExpansionTile(
+      key: Key(key),
+      title: Text(ingredient.name),
+      subtitle: Text(S.menuIngredientMetaAmount(ingredient.amount)),
+      expandedCrossAxisAlignment: CrossAxisAlignment.stretch,
+      children: [
+        ListTile(
+            key: Key('$key.add'),
+            leading: const CircleAvatar(child: Icon(KIcons.add)),
+            title: Text(S.menuQuantityCreate),
+            onTap: () => Navigator.of(context).pushNamed(
+                  Routes.menuQuantity,
+                  arguments: ingredient,
+                ),
+            trailing: IconButton(
+              key: Key('$key.more'),
+              onPressed: () => showActions(context),
+              enableFeedback: true,
+              icon: const Icon(KIcons.more),
+            )),
+        for (final item in ingredient.items) _QuantityTile(item),
+      ],
     );
   }
 

diff --git a/lib/ui/order/cashier/order_details_screen.dart b/lib/ui/order/cashier/order_details_screen.dart
@@ -25,37 +25,44 @@ class _OrderDetailsScreenState extends State<OrderDetailsScreen>
   @override
   Widget build(BuildContext context) {
     // tab widgets
-    final tabBar = TabBar(
-      controller: _controller,
-      tabs: [
-        if (hasAttr)
+    PreferredSizeWidget? tabBar;
+    Widget body = const OrderCashierModal();
+
+    if (hasAttr) {
+      tabBar = TabBar(
+        controller: _controller,
+        tabs: [
           Tab(key: const Key('order.set_attr'), text: S.orderSetAttributeTitle),
-        Tab(key: const Key('order.cashier'), text: S.orderCashierTitle),
-      ],
-    );
-    final tabBarView = TabBarView(controller: _controller, children: [
-      if (hasAttr) const OderSetAttributeModal(),
-      const OrderCashierModal(),
-    ]);
+          Tab(key: const Key('order.cashier'), text: S.orderCashierTitle),
+        ],
+      );
+
+      body = DefaultTabController(
+        length: 2,
+        child: Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
+          Expanded(
+            child: TabBarView(controller: _controller, children: const [
+              OderSetAttributeModal(),
+              OrderCashierModal(),
+            ]),
+          ),
+        ]),
+      );
+    }
 
     return Scaffold(
       appBar: AppBar(
         leading: const PopButton(),
-        title: tabBar,
         actions: [
           TextButton(
             key: const Key('order.checkout'),
             onPressed: onCheckout,
             child: Text(S.orderActionsCheckout),
           ),
         ],
+        bottom: tabBar,
       ),
-      body: DefaultTabController(
-        length: tabBar.tabs.length,
-        child: Column(mainAxisSize: MainAxisSize.min, children: <Widget>[
-          Expanded(child: tabBarView),
-        ]),
-      ),
+      body: body,
     );
   }
 

diff --git a/lib/ui/stock/stock_screen.dart b/lib/ui/stock/stock_screen.dart
@@ -34,6 +34,7 @@ class _StockScreenState<T> extends State<StockScreen<T>> {
       return Center(
         key: const Key('stock.empty'),
         child: EmptyBody(
+          tooltip: '新增成份後，就可以開始追蹤這些成份的庫存囉！',
           onPressed: () => Navigator.of(context).pushNamed(
             Routes.stockIngredient,
           ),
@@ -86,6 +87,6 @@ class _StockScreenState<T> extends State<StockScreen<T>> {
   void initState() {
     super.initState();
 
-    widget.tab?.bindAnt(gaffer);
+    widget.tab?.bindAnt(gaffer, startNow: true);
   }
 }