beenull/ente
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Merge pull request #593 from ente-io/menuitem-on-pressed-state

Browse source 
Menuitem on pressed state
This commit is contained in:
Ashil 2022-10-22 15:59:36 +05:30 committed by GitHub
parent 470000ce7c e15157c3ac
commit 9d422621e6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 70 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
lib/ui/components/expandable_menu_item_widget.dart
View file

@ -60,7 +60,7 @@ class _ExpandableMenuItemWidgetState extends State<ExpandableMenuItemWidget> {
title: widget.title,
makeTextBold: true,
),
isHeaderOfExpansion: true,
isExpandable: true,
leadingIcon: widget.leadingIcon,
trailingIcon: Icons.expand_more,
menuItemColor: enteColorScheme.fillFaint,

44
lib/ui/components/menu_item_widget.dart
View file

@ -4,7 +4,7 @@ import 'package:photos/ente_theme_data.dart';
class MenuItemWidget extends StatefulWidget {
final Widget captionedTextWidget;
final bool isHeaderOfExpansion;
final bool isExpandable;
// leading icon can be passed without specifing size of icon, this component sets size to 20x20 irrespective of passed icon's size
final IconData? leadingIcon;
final Color? leadingIconColor;
@ -17,10 +17,11 @@ class MenuItemWidget extends StatefulWidget {
final Color? menuItemColor;
final bool alignCaptionedTextToLeft;
final double borderRadius;
final Color? pressedColor;
final ExpandableController? expandableController;
const MenuItemWidget({
required this.captionedTextWidget,
this.isHeaderOfExpansion = false,
this.isExpandable = false,
this.leadingIcon,
this.leadingIconColor,
this.trailingIcon,
@ -31,6 +32,7 @@ class MenuItemWidget extends StatefulWidget {
this.menuItemColor,
this.alignCaptionedTextToLeft = false,
this.borderRadius = 4.0,
this.pressedColor,
this.expandableController,
Key? key,
}) : super(key: key);
@ -40,8 +42,10 @@ class MenuItemWidget extends StatefulWidget {
}
class _MenuItemWidgetState extends State<MenuItemWidget> {
Color? menuItemColor;
@override
void initState() {
menuItemColor = widget.menuItemColor;
if (widget.expandableController != null) {
widget.expandableController!.addListener(() {
setState(() {});
@ -50,6 +54,12 @@ class _MenuItemWidgetState extends State<MenuItemWidget> {
super.initState();
}
@override
void didChangeDependencies() {
menuItemColor = widget.menuItemColor;
super.didChangeDependencies();
}
@override
void dispose() {
if (widget.expandableController != null) {
@ -60,11 +70,14 @@ class _MenuItemWidgetState extends State<MenuItemWidget> {
@override
Widget build(BuildContext context) {
return widget.isHeaderOfExpansion
return widget.isExpandable
? menuItemWidget(context)
: GestureDetector(
onTap: widget.onTap,
onDoubleTap: widget.onDoubleTap,
onTapDown: _onTapDown,
onTapUp: _onTapUp,
onTapCancel: _onCancel,
child: menuItemWidget(context),
);
}
@ -77,7 +90,7 @@ class _MenuItemWidgetState extends State<MenuItemWidget> {
? const Radius.circular(0)
: borderRadius;
return AnimatedContainer(
duration: const Duration(milliseconds: 200),
duration: const Duration(milliseconds: 20),
width: double.infinity,
padding: const EdgeInsets.symmetric(horizontal: 12),
decoration: BoxDecoration(
@ -87,7 +100,7 @@ class _MenuItemWidgetState extends State<MenuItemWidget> {
bottomLeft: bottomBorderRadius,
bottomRight: bottomBorderRadius,
),
color: widget.menuItemColor,
color: menuItemColor,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
@ -139,4 +152,25 @@ class _MenuItemWidgetState extends State<MenuItemWidget> {
),
);
}
void _onTapDown(details) {
setState(() {
menuItemColor = widget.pressedColor;
});
}
void _onTapUp(details) {
Future.delayed(
const Duration(milliseconds: 100),
() => setState(() {
menuItemColor = widget.menuItemColor;
}),
);
}
void _onCancel() {
setState(() {
menuItemColor = widget.menuItemColor;
});
}
}

4
lib/ui/settings/about_section_widget.dart
View file

@ -2,6 +2,7 @@
import 'package:flutter/material.dart';
import 'package:photos/services/update_service.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/common/web_page.dart';
import 'package:photos/ui/components/captioned_text_widget.dart';
import 'package:photos/ui/components/expandable_menu_item_widget.dart';
@ -47,6 +48,7 @@ class AboutSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Source code",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {
@ -61,6 +63,7 @@ class AboutSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Check for updates",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {
@ -111,6 +114,7 @@ class AboutMenuItemWidget extends StatelessWidget {
captionedTextWidget: CaptionedTextWidget(
title: title,
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {

4
lib/ui/settings/account_section_widget.dart
View file

@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_sodium/flutter_sodium.dart';
import 'package:photos/services/local_authentication_service.dart';
import 'package:photos/services/user_service.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/account/change_email_dialog.dart';
import 'package:photos/ui/account/password_entry_page.dart';
import 'package:photos/ui/account/recovery_key_page.dart';
@ -34,6 +35,7 @@ class AccountSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Recovery key",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {
@ -67,6 +69,7 @@ class AccountSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Change email",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {
@ -92,6 +95,7 @@ class AccountSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Change password",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {

4
lib/ui/settings/backup_section_widget.dart
View file

@ -9,6 +9,7 @@ import 'package:photos/models/backup_status.dart';
import 'package:photos/models/duplicate_files.dart';
import 'package:photos/services/deduplication_service.dart';
import 'package:photos/services/sync_service.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/backup_folder_selection_page.dart';
import 'package:photos/ui/common/dialogs.dart';
import 'package:photos/ui/components/captioned_text_widget.dart';
@ -48,6 +49,7 @@ class BackupSectionWidgetState extends State<BackupSectionWidget> {
captionedTextWidget: const CaptionedTextWidget(
title: "Backed up folders",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () {
@ -122,6 +124,7 @@ class BackupSectionWidgetState extends State<BackupSectionWidget> {
captionedTextWidget: const CaptionedTextWidget(
title: "Free up space",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {
@ -157,6 +160,7 @@ class BackupSectionWidgetState extends State<BackupSectionWidget> {
captionedTextWidget: const CaptionedTextWidget(
title: "Deduplicate files",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {

3
lib/ui/settings/danger_section_widget.dart
View file

@ -3,6 +3,7 @@
import 'package:flutter/material.dart';
import 'package:photos/ente_theme_data.dart';
import 'package:photos/services/user_service.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/account/delete_account_page.dart';
import 'package:photos/ui/components/captioned_text_widget.dart';
import 'package:photos/ui/components/expandable_menu_item_widget.dart';
@ -30,6 +31,7 @@ class DangerSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Logout",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () {
@ -41,6 +43,7 @@ class DangerSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Delete account",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () {

4
lib/ui/settings/debug_section_widget.dart
View file

@ -6,6 +6,7 @@ import 'package:photos/core/configuration.dart';
import 'package:photos/services/ignored_files_service.dart';
import 'package:photos/services/local_sync_service.dart';
import 'package:photos/services/sync_service.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/components/captioned_text_widget.dart';
import 'package:photos/ui/components/expandable_menu_item_widget.dart';
import 'package:photos/ui/components/menu_item_widget.dart';
@ -32,6 +33,7 @@ class DebugSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Key attributes",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {
@ -43,6 +45,7 @@ class DebugSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Delete Local Import DB",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {
@ -55,6 +58,7 @@ class DebugSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Allow auto-upload for ignored files",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {

2
lib/ui/settings/security_section_widget.dart
View file

@ -11,6 +11,7 @@ import 'package:photos/ente_theme_data.dart';
import 'package:photos/events/two_factor_status_change_event.dart';
import 'package:photos/services/local_authentication_service.dart';
import 'package:photos/services/user_service.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/account/sessions_page.dart';
import 'package:photos/ui/common/loading_widget.dart';
import 'package:photos/ui/components/captioned_text_widget.dart';
@ -216,6 +217,7 @@ class _SecuritySectionWidgetState extends State<SecuritySectionWidget> {
captionedTextWidget: const CaptionedTextWidget(
title: "Active sessions",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {

2
lib/ui/settings/social_section_widget.dart
View file

@ -4,6 +4,7 @@ import 'dart:io';
import 'package:flutter/material.dart';
import 'package:photos/services/update_service.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/components/captioned_text_widget.dart';
import 'package:photos/ui/components/expandable_menu_item_widget.dart';
import 'package:photos/ui/components/menu_item_widget.dart';
@ -61,6 +62,7 @@ class SocialsMenuItemWidget extends StatelessWidget {
captionedTextWidget: CaptionedTextWidget(
title: text,
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () {

4
lib/ui/settings/support_section_widget.dart
View file

@ -5,6 +5,7 @@ import 'dart:io';
import 'package:flutter/material.dart';
import 'package:photos/core/configuration.dart';
import 'package:photos/core/constants.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/common/web_page.dart';
import 'package:photos/ui/components/captioned_text_widget.dart';
import 'package:photos/ui/components/expandable_menu_item_widget.dart';
@ -34,6 +35,7 @@ class SupportSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Email",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {
@ -45,6 +47,7 @@ class SupportSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Roadmap",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () {
@ -67,6 +70,7 @@ class SupportSectionWidget extends StatelessWidget {
captionedTextWidget: const CaptionedTextWidget(
title: "Report a bug",
),
pressedColor: getEnteColorScheme(context).fillFaint,
trailingIcon: Icons.chevron_right_outlined,
trailingIconIsMuted: true,
onTap: () async {

4
lib/ui/settings/theme_switch_widget.dart
View file

@ -4,6 +4,7 @@ import 'package:adaptive_theme/adaptive_theme.dart';
import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:photos/ente_theme_data.dart';
import 'package:photos/theme/ente_theme.dart';
import 'package:photos/ui/components/captioned_text_widget.dart';
import 'package:photos/ui/components/expandable_menu_item_widget.dart';
import 'package:photos/ui/components/menu_item_widget.dart';
@ -69,7 +70,8 @@ class _ThemeSwitchWidgetState extends State<ThemeSwitchWidget> {
title: toBeginningOfSentenceCase(themeMode.name),
textStyle: Theme.of(context).colorScheme.enteTheme.textTheme.body,
),
isHeaderOfExpansion: false,
pressedColor: getEnteColorScheme(context).fillFaint,
isExpandable: false,
trailingIcon: currentThemeMode == themeMode ? Icons.check : null,
onTap: () async {
AdaptiveTheme.of(context).setThemeMode(themeMode);