From 9bad93c2df6eb4914b1496a3882984307be65f7d Mon Sep 17 00:00:00 2001 From: Christian Pauly Date: Thu, 2 Feb 2023 09:47:35 +0100 Subject: [PATCH] design: Adjust design to new material 3 capabilities of Flutter 3.7 --- lib/config/themes.dart | 8 +-- lib/pages/chat/chat_input_row.dart | 5 +- lib/pages/chat/chat_view.dart | 3 +- lib/pages/chat_details/chat_details_view.dart | 7 ++- .../chat_list/client_chooser_button.dart | 3 +- lib/pages/story/story_view.dart | 3 +- lib/widgets/avatar.dart | 44 +++++++--------- lib/widgets/chat_settings_popup_menu.dart | 3 +- lib/widgets/log_view.dart | 4 +- lib/widgets/m2_popup_menu_button.dart | 51 ------------------- 10 files changed, 34 insertions(+), 97 deletions(-) delete mode 100644 lib/widgets/m2_popup_menu_button.dart diff --git a/lib/config/themes.dart b/lib/config/themes.dart index 9fec72b6..a501cf36 100644 --- a/lib/config/themes.dart +++ b/lib/config/themes.dart @@ -55,9 +55,11 @@ abstract class FluffyThemes { snackBarTheme: const SnackBarThemeData( behavior: SnackBarBehavior.floating, ), - dividerColor: brightness == Brightness.light - ? Colors.blueGrey.shade50 - : Colors.blueGrey.shade900, + popupMenuTheme: PopupMenuThemeData( + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(AppConfig.borderRadius), + ), + ), inputDecorationTheme: InputDecorationTheme( border: UnderlineInputBorder( borderSide: BorderSide.none, diff --git a/lib/pages/chat/chat_input_row.dart b/lib/pages/chat/chat_input_row.dart index 3f565940..d509e8a9 100644 --- a/lib/pages/chat/chat_input_row.dart +++ b/lib/pages/chat/chat_input_row.dart @@ -11,7 +11,6 @@ import 'package:fluffychat/utils/platform_infos.dart'; import 'package:fluffychat/widgets/avatar.dart'; import 'package:fluffychat/widgets/matrix.dart'; import '../../config/themes.dart'; -import '../../widgets/m2_popup_menu_button.dart'; import 'chat.dart'; import 'input_bar.dart'; @@ -92,7 +91,7 @@ class ChatInputRow extends StatelessWidget { alignment: Alignment.center, clipBehavior: Clip.hardEdge, decoration: const BoxDecoration(), - child: M2PopupMenuButton( + child: PopupMenuButton( icon: const Icon(Icons.add_outlined), onSelected: controller.onAddPopupMenuButtonSelected, itemBuilder: (BuildContext context) => @@ -298,7 +297,7 @@ class _ChatAccountPicker extends StatelessWidget { padding: const EdgeInsets.all(8.0), child: FutureBuilder( future: controller.sendingClient!.fetchOwnProfile(), - builder: (context, snapshot) => M2PopupMenuButton( + builder: (context, snapshot) => PopupMenuButton( onSelected: _popupMenuButtonSelected, itemBuilder: (BuildContext context) => clients .map((client) => PopupMenuItem( diff --git a/lib/pages/chat/chat_view.dart b/lib/pages/chat/chat_view.dart index 8e6f0601..032cfd16 100644 --- a/lib/pages/chat/chat_view.dart +++ b/lib/pages/chat/chat_view.dart @@ -22,7 +22,6 @@ import 'package:fluffychat/widgets/connection_status_header.dart'; import 'package:fluffychat/widgets/matrix.dart'; import 'package:fluffychat/widgets/unread_rooms_badge.dart'; import '../../utils/stream_extension.dart'; -import '../../widgets/m2_popup_menu_button.dart'; import 'chat_emoji_picker.dart'; import 'chat_input_row.dart'; @@ -67,7 +66,7 @@ class ChatView extends StatelessWidget { tooltip: L10n.of(context)!.pinMessage, ), if (controller.selectedEvents.length == 1) - M2PopupMenuButton<_EventContextAction>( + PopupMenuButton<_EventContextAction>( onSelected: (action) { switch (action) { case _EventContextAction.info: diff --git a/lib/pages/chat_details/chat_details_view.dart b/lib/pages/chat_details/chat_details_view.dart index 8246420e..60bf06b8 100644 --- a/lib/pages/chat_details/chat_details_view.dart +++ b/lib/pages/chat_details/chat_details_view.dart @@ -16,7 +16,6 @@ import 'package:fluffychat/widgets/content_banner.dart'; import 'package:fluffychat/widgets/layouts/max_width_body.dart'; import 'package:fluffychat/widgets/matrix.dart'; import '../../utils/url_launcher.dart'; -import '../../widgets/m2_popup_menu_button.dart'; class ChatDetailsView extends StatelessWidget { final ChatDetailsController controller; @@ -198,7 +197,7 @@ class ChatDetailsView extends StatelessWidget { Text(L10n.of(context)!.setCustomEmotes), onTap: controller.goToEmoteSettings, ), - M2PopupMenuButton( + PopupMenuButton( onSelected: controller.setJoinRulesAction, itemBuilder: (BuildContext context) => >[ @@ -232,7 +231,7 @@ class ChatDetailsView extends StatelessWidget { ), ), ), - M2PopupMenuButton( + PopupMenuButton( onSelected: controller.setHistoryVisibilityAction, itemBuilder: (BuildContext context) => @@ -285,7 +284,7 @@ class ChatDetailsView extends StatelessWidget { ), ), if (room.joinRules == JoinRules.public) - M2PopupMenuButton( + PopupMenuButton( onSelected: controller.setGuestAccessAction, itemBuilder: (BuildContext context) => >[ diff --git a/lib/pages/chat_list/client_chooser_button.dart b/lib/pages/chat_list/client_chooser_button.dart index 1e3cafb9..a74622aa 100644 --- a/lib/pages/chat_list/client_chooser_button.dart +++ b/lib/pages/chat_list/client_chooser_button.dart @@ -9,7 +9,6 @@ import 'package:vrouter/vrouter.dart'; import 'package:fluffychat/widgets/avatar.dart'; import 'package:fluffychat/widgets/matrix.dart'; import '../../utils/fluffy_share.dart'; -import '../../widgets/m2_popup_menu_button.dart'; import 'chat_list.dart'; class ClientChooserButton extends StatelessWidget { @@ -207,7 +206,7 @@ class ClientChooserButton extends StatelessWidget { onKeysPressed: () => _previousAccount(matrix, context), child: Container(), ), - M2PopupMenuButton( + PopupMenuButton( onSelected: (o) => _clientSelected(o, context), itemBuilder: _bundleMenuItems, child: Material( diff --git a/lib/pages/story/story_view.dart b/lib/pages/story/story_view.dart index 8b60033d..f172f930 100644 --- a/lib/pages/story/story_view.dart +++ b/lib/pages/story/story_view.dart @@ -16,7 +16,6 @@ import 'package:fluffychat/utils/string_color.dart'; import 'package:fluffychat/utils/url_launcher.dart'; import 'package:fluffychat/widgets/avatar.dart'; import '../../config/themes.dart'; -import '../../widgets/m2_popup_menu_button.dart'; class StoryView extends StatelessWidget { final StoryPageController controller; @@ -104,7 +103,7 @@ class StoryView extends StatelessWidget { icon: Icon(Icons.adaptive.share_outlined), onPressed: controller.share, ), - M2PopupMenuButton( + PopupMenuButton( color: Colors.white, onSelected: controller.onPopupStoryAction, icon: Icon( diff --git a/lib/widgets/avatar.dart b/lib/widgets/avatar.dart index e112e664..7d43f8f3 100644 --- a/lib/widgets/avatar.dart +++ b/lib/widgets/avatar.dart @@ -48,31 +48,25 @@ class Avatar extends StatelessWidget { ), ); final borderRadius = BorderRadius.circular(size / 2); - final container = Container( - decoration: BoxDecoration( - border: Border.all(color: Theme.of(context).dividerColor), - borderRadius: borderRadius, - ), - child: ClipRRect( - borderRadius: borderRadius, - child: Container( - width: size, - height: size, - color: noPic - ? name?.lightColorAvatar - : Theme.of(context).secondaryHeaderColor, - child: noPic - ? textWidget - : MxcImage( - key: Key(mxContent.toString()), - uri: mxContent, - fit: BoxFit.cover, - width: size, - height: size, - placeholder: (_) => textWidget, - cacheKey: mxContent.toString(), - ), - ), + final container = ClipRRect( + borderRadius: borderRadius, + child: Container( + width: size, + height: size, + color: noPic + ? name?.lightColorAvatar + : Theme.of(context).secondaryHeaderColor, + child: noPic + ? textWidget + : MxcImage( + key: Key(mxContent.toString()), + uri: mxContent, + fit: BoxFit.cover, + width: size, + height: size, + placeholder: (_) => textWidget, + cacheKey: mxContent.toString(), + ), ), ); if (onTap == null) return container; diff --git a/lib/widgets/chat_settings_popup_menu.dart b/lib/widgets/chat_settings_popup_menu.dart index 84095588..1e5f876f 100644 --- a/lib/widgets/chat_settings_popup_menu.dart +++ b/lib/widgets/chat_settings_popup_menu.dart @@ -15,7 +15,6 @@ import 'package:fluffychat/pages/chat/cupertino_widgets_bottom_sheet.dart'; import 'package:fluffychat/pages/chat/edit_widgets_dialog.dart'; import 'package:fluffychat/pages/chat/widgets_bottom_sheet.dart'; import 'package:fluffychat/utils/adaptive_bottom_sheet.dart'; -import 'm2_popup_menu_button.dart'; import 'matrix.dart'; class ChatSettingsPopupMenu extends StatefulWidget { @@ -127,7 +126,7 @@ class ChatSettingsPopupMenuState extends State { onKeysPressed: _showWidgets, child: Container(), ), - M2PopupMenuButton( + PopupMenuButton( onSelected: (String choice) async { switch (choice) { case 'widgets': diff --git a/lib/widgets/log_view.dart b/lib/widgets/log_view.dart index 0ceba4d6..d87f15f8 100644 --- a/lib/widgets/log_view.dart +++ b/lib/widgets/log_view.dart @@ -2,8 +2,6 @@ import 'package:flutter/material.dart'; import 'package:matrix/matrix.dart'; -import 'm2_popup_menu_button.dart'; - class LogViewer extends StatefulWidget { const LogViewer({Key? key}) : super(key: key); @@ -34,7 +32,7 @@ class LogViewerState extends State { icon: const Icon(Icons.zoom_out_outlined), onPressed: () => setState(() => fontSize--), ), - M2PopupMenuButton( + PopupMenuButton( itemBuilder: (context) => Level.values .map((level) => PopupMenuItem( value: level, diff --git a/lib/widgets/m2_popup_menu_button.dart b/lib/widgets/m2_popup_menu_button.dart deleted file mode 100644 index 8bef7952..00000000 --- a/lib/widgets/m2_popup_menu_button.dart +++ /dev/null @@ -1,51 +0,0 @@ -import 'package:flutter/material.dart'; - -import 'package:fluffychat/config/app_config.dart'; - -class M2PopupMenuButton extends StatelessWidget { - final List> Function(BuildContext) itemBuilder; - final T? initialValue; - final void Function(T)? onSelected; - final void Function()? onCanceled; - final Widget? icon; - final Color? color; - final Widget? child; - - const M2PopupMenuButton({ - Key? key, - required this.itemBuilder, - this.initialValue, - this.onSelected, - this.onCanceled, - this.icon, - this.color, - this.child, - }) : super(key: key); - - @override - Widget build(BuildContext context) { - final theme = Theme.of(context); - return Theme( - data: theme.copyWith( - useMaterial3: false, - popupMenuTheme: PopupMenuThemeData( - color: theme.colorScheme.surface, - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(AppConfig.borderRadius), - ), - elevation: theme.appBarTheme.scrolledUnderElevation, - textStyle: theme.textTheme.bodyLarge, - ), - ), - child: PopupMenuButton( - itemBuilder: itemBuilder, - initialValue: initialValue, - onSelected: onSelected, - onCanceled: onCanceled, - icon: icon, - color: color, - child: child, - ), - ); - } -}