From 66a99bce10131835bdc35e814aa4d744c3838184 Mon Sep 17 00:00:00 2001 From: ygohko Date: Wed, 12 Apr 2023 12:31:57 +0900 Subject: [PATCH] Adjust UIs (#223) * Added border option for drawer items. * Added test for drawer modification. * Added footer for navigation drawer. * Added TODOs. * Brushed up. * Added safe area for drawer. * Updated a parameter. * Moved a style for drawer footer to common_uis. * Added parameters for banner. --- lib/binding_tags_page.dart | 7 +++- lib/common_uis.dart | 11 ++++++ lib/home_page.dart | 72 +++++++++++++++++++++----------------- 3 files changed, 56 insertions(+), 34 deletions(-) diff --git a/lib/binding_tags_page.dart b/lib/binding_tags_page.dart index 2c98ac1..249944b 100644 --- a/lib/binding_tags_page.dart +++ b/lib/binding_tags_page.dart @@ -172,7 +172,12 @@ class _BindingTagsPageState extends State { } if (!added) { final snackBar = SnackBar( - content: Text(snackBarText), + content: Text(snackBarText, + style: TextStyle( + color: TsukimisouColors.scheme.onSecondary, + ), + ), + backgroundColor: TsukimisouColors.scheme.secondary, ); _scaffoldMessengerKey.currentState!.showSnackBar(snackBar); } diff --git a/lib/common_uis.dart b/lib/common_uis.dart index 33bcf34..ceef341 100644 --- a/lib/common_uis.dart +++ b/lib/common_uis.dart @@ -67,6 +67,17 @@ class TsukimisouTextStyles { return style; } + /// Text style for drawer footer on home page. + static TextStyle homePageDrawerFooter(BuildContext context) { + var style = Theme.of(context).textTheme.bodyText2; + if (style == null) { + style = TextStyle(); + } + style = style.apply(color: Colors.black.withOpacity(0.6)); + + return style; + } + /// Text style for memo text on vieweing page. static TextStyle viewingPageMemoText(BuildContext context) { var style = Theme.of(context).textTheme.bodyText2; diff --git a/lib/home_page.dart b/lib/home_page.dart index 0a9eb47..98663fc 100644 --- a/lib/home_page.dart +++ b/lib/home_page.dart @@ -371,12 +371,15 @@ class _HomePageState extends State { ); }, ), - drawer: Drawer( - child: Consumer2( - builder: (context, memoStore, appState, child) { - _updateShownMemos(); - return _drawerListView(true); - }, + drawer: SafeArea( + bottom: false, + child: Drawer( + child: Consumer2( + builder: (context, memoStore, appState, child) { + _updateShownMemos(); + return _drawerListView(true); + }, + ), ), ), ); @@ -485,10 +488,9 @@ class _HomePageState extends State { } ListView _drawerListView(bool primary) { - const headerIndex = 0; - const allMemosIndex = 1; - const tagsSubtitleIndex = 2; - const tagsBeginIndex = 3; + const allMemosIndex = 0; + const tagsSubtitleIndex = 1; + const tagsBeginIndex = 2; final memoStore = Provider.of(context, listen: false); final appState = Provider.of(context, listen: false); final tags = memoStore.tags; @@ -500,33 +502,20 @@ class _HomePageState extends State { final othersSubtitleIndex = othersDividerIndex + 1; final aboutIndex = othersSubtitleIndex + 1; final privacyPolicyIndex = aboutIndex + 1; - final drawerItemCount = privacyPolicyIndex + 1; + final footerIndex = privacyPolicyIndex + 1; + final drawerItemCount = footerIndex + 1; final localizations = AppLocalizations.of(context)!; + const border = RoundedRectangleBorder( + borderRadius: BorderRadius.all( + Radius.circular(40.0), + ), + ); return ListView.builder( + padding: const EdgeInsets.all(10.0), primary: primary, itemCount: drawerItemCount, itemBuilder: (context, i) { - if (i == headerIndex) { - return SizedBox( - height: 120, - child: DrawerHeader( - decoration: BoxDecoration( - color: common_uis.TsukimisouColors.scheme.primaryContainer, - ), - child: Align( - alignment: Alignment.centerLeft, - child: Text( - localizations.showingMemos( - _shownMemos.length, memoStore.memos.length, tags.length), - style: TextStyle( - color: - common_uis.TsukimisouColors.scheme.onPrimaryContainer, - ), - ), - ), - ), - ); - } else if (i == allMemosIndex) { + if (i == allMemosIndex) { return ListTile( title: Text(localizations.allMemos), onTap: _disableFiltering, @@ -535,6 +524,7 @@ class _HomePageState extends State { common_uis.TsukimisouColors.scheme.onPrimaryContainer, selectedTileColor: common_uis.TsukimisouColors.scheme.primaryContainer, + shape: border, ); } else if (i == tagsSubtitleIndex) { return common_uis.subtitle(context, localizations.tags); @@ -550,6 +540,7 @@ class _HomePageState extends State { common_uis.TsukimisouColors.scheme.onPrimaryContainer, selectedTileColor: common_uis.TsukimisouColors.scheme.primaryContainer, + shape: border, ); } else if (i == integrationDividerIndex) { return const Divider(); @@ -561,6 +552,7 @@ class _HomePageState extends State { title: Text(localizations.synchronize), onTap: _mergeWithGoogleDrive, enabled: !(appState.mergingWithGoogleDrive || _savingToGoogleDrive), + shape: border, ); } else if (i == othersDividerIndex) { return const Divider(); @@ -570,11 +562,25 @@ class _HomePageState extends State { return ListTile( title: Text(localizations.about), onTap: _showAbout, + shape: border, ); - } else { + } else if (i == privacyPolicyIndex){ return ListTile( title: Text(localizations.privacyPolicy), onTap: _showPrivacyPolicy, + shape: border, + ); + } else { + return Container( + child: Align( + alignment: Alignment.centerLeft, + child: Text( + localizations.showingMemos( + _shownMemos.length, memoStore.memos.length, tags.length), + style: common_uis.TsukimisouTextStyles.homePageDrawerFooter(context), + ), + ), + padding: const EdgeInsets.all(16.0), ); } },