From b7845ec223a54a58c2aea3d7b5459a9921c94514 Mon Sep 17 00:00:00 2001 From: hawkbee1 Date: Fri, 28 Jun 2024 07:23:52 +0000 Subject: [PATCH] better design --- lib/app/shared/widget/custom_app_bar.dart | 7 ++- .../shared/widget/divider_for_radio_list.dart | 18 +++++++ .../widgets/manage_accounts_item.dart | 3 +- .../widget/client_authentication_widget.dart | 19 ++----- .../widget/client_type_widget.dart | 19 ++----- .../widget/did_key_type_widget.dart | 15 ++---- .../widget/draft_type_widget.dart | 19 ++----- .../widget/proof_header_widget.dart | 19 ++----- .../widget/proof_type_widget.dart | 19 ++----- .../widget/vc_format_widget.dart | 19 ++----- .../widget/language_selector_widget.dart | 11 ++-- .../home_credential_category_item.dart | 50 +++++++++++-------- 12 files changed, 87 insertions(+), 131 deletions(-) create mode 100644 lib/app/shared/widget/divider_for_radio_list.dart diff --git a/lib/app/shared/widget/custom_app_bar.dart b/lib/app/shared/widget/custom_app_bar.dart index b1fbf9bf5..cbda62bc4 100644 --- a/lib/app/shared/widget/custom_app_bar.dart +++ b/lib/app/shared/widget/custom_app_bar.dart @@ -26,7 +26,12 @@ class CustomAppBar extends PreferredSize { color: Theme.of(context).colorScheme.surface, child: SafeArea( child: Padding( - padding: const EdgeInsets.symmetric(horizontal: 12), + padding: const EdgeInsets.fromLTRB( + 10, + 0, + 15, + 0, + ), child: Stack( alignment: Alignment.topCenter, children: [ diff --git a/lib/app/shared/widget/divider_for_radio_list.dart b/lib/app/shared/widget/divider_for_radio_list.dart new file mode 100644 index 000000000..cd900316a --- /dev/null +++ b/lib/app/shared/widget/divider_for_radio_list.dart @@ -0,0 +1,18 @@ +import 'package:flutter/material.dart'; + +class DividerForRadioList extends StatelessWidget { + const DividerForRadioList({ + super.key, + }); + + @override + Widget build(BuildContext context) { + return Padding( + padding: const EdgeInsets.symmetric(horizontal: 8), + child: Divider( + height: 0, + color: Theme.of(context).colorScheme.onSurface.withOpacity(0.12), + ), + ); + } +} diff --git a/lib/dashboard/drawer/blockchain_settings/manage_accounts/widgets/manage_accounts_item.dart b/lib/dashboard/drawer/blockchain_settings/manage_accounts/widgets/manage_accounts_item.dart index 88c1b0c93..9eb615476 100644 --- a/lib/dashboard/drawer/blockchain_settings/manage_accounts/widgets/manage_accounts_item.dart +++ b/lib/dashboard/drawer/blockchain_settings/manage_accounts/widgets/manage_accounts_item.dart @@ -66,7 +66,7 @@ class ManageAccountsItem extends StatelessWidget { child: Icon( Icons.edit, size: 20, - color: Theme.of(context).colorScheme.onPrimary, + color: Theme.of(context).colorScheme.onSurface, ), ), const SizedBox(width: Sizes.spaceXSmall), @@ -103,6 +103,7 @@ class ManageAccountsItem extends StatelessWidget { IconStrings.copy, width: Sizes.icon, height: Sizes.icon, + color: Theme.of(context).colorScheme.onSurface, ), ), const SizedBox(width: Sizes.spaceSmall), diff --git a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/client_authentication_widget.dart b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/client_authentication_widget.dart index 8fb078117..dd3ad5521 100644 --- a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/client_authentication_widget.dart +++ b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/client_authentication_widget.dart @@ -1,4 +1,5 @@ import 'package:altme/app/app.dart'; +import 'package:altme/app/shared/widget/divider_for_radio_list.dart'; import 'package:altme/dashboard/dashboard.dart'; import 'package:altme/l10n/l10n.dart'; import 'package:flutter/material.dart'; @@ -30,17 +31,6 @@ class ClientAuthenticationWidget extends StatelessWidget { return Column( children: [ - if (index != 0) - Padding( - padding: const EdgeInsets.symmetric(horizontal: 8), - child: Divider( - height: 0, - color: Theme.of(context) - .colorScheme - .onSurface - .withOpacity(0.12), - ), - ), ListTile( onTap: () { context.read().updateProfileSetting( @@ -55,9 +45,7 @@ class ClientAuthenticationWidget extends StatelessWidget { ), title: Text( clientAuthenticationType.value, - style: Theme.of(context).textTheme.bodyLarge?.copyWith( - color: Theme.of(context).colorScheme.onPrimary, - ), + style: Theme.of(context).textTheme.bodyLarge, ), trailing: Icon( state.model.profileSetting.selfSovereignIdentityOptions @@ -66,9 +54,10 @@ class ClientAuthenticationWidget extends StatelessWidget { ? Icons.radio_button_checked : Icons.radio_button_unchecked, size: Sizes.icon2x, - color: Theme.of(context).colorScheme.onPrimary, + color: Theme.of(context).colorScheme.primary, ), ), + const DividerForRadioList(), ], ); }, diff --git a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/client_type_widget.dart b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/client_type_widget.dart index a96ba238c..9e1182770 100644 --- a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/client_type_widget.dart +++ b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/client_type_widget.dart @@ -1,4 +1,5 @@ import 'package:altme/app/app.dart'; +import 'package:altme/app/shared/widget/divider_for_radio_list.dart'; import 'package:altme/dashboard/dashboard.dart'; import 'package:altme/l10n/l10n.dart'; import 'package:flutter/material.dart'; @@ -25,17 +26,6 @@ class ClientTypeWidget extends StatelessWidget { final clientType = ClientType.values[index]; return Column( children: [ - if (index != 0) - Padding( - padding: const EdgeInsets.symmetric(horizontal: 8), - child: Divider( - height: 0, - color: Theme.of(context) - .colorScheme - .onSurface - .withOpacity(0.12), - ), - ), ListTile( onTap: () { context.read().updateProfileSetting( @@ -50,9 +40,7 @@ class ClientTypeWidget extends StatelessWidget { ), title: Text( clientType.getTitle, - style: Theme.of(context).textTheme.bodyLarge?.copyWith( - color: Theme.of(context).colorScheme.onPrimary, - ), + style: Theme.of(context).textTheme.bodyLarge, ), trailing: Icon( state.model.profileSetting.selfSovereignIdentityOptions @@ -61,9 +49,10 @@ class ClientTypeWidget extends StatelessWidget { ? Icons.radio_button_checked : Icons.radio_button_unchecked, size: Sizes.icon2x, - color: Theme.of(context).colorScheme.onPrimary, + color: Theme.of(context).colorScheme.primary, ), ), + const DividerForRadioList(), ], ); }, diff --git a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/did_key_type_widget.dart b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/did_key_type_widget.dart index f444a4329..a6455b491 100644 --- a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/did_key_type_widget.dart +++ b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/did_key_type_widget.dart @@ -1,4 +1,5 @@ import 'package:altme/app/app.dart'; +import 'package:altme/app/shared/widget/divider_for_radio_list.dart'; import 'package:altme/dashboard/dashboard.dart'; import 'package:altme/l10n/l10n.dart'; import 'package:flutter/material.dart'; @@ -29,17 +30,6 @@ class DidKeyTypeWidget extends StatelessWidget { } return Column( children: [ - if (index != 0) - Padding( - padding: const EdgeInsets.symmetric(horizontal: 8), - child: Divider( - height: 0, - color: Theme.of(context) - .colorScheme - .onSurface - .withOpacity(0.12), - ), - ), ListTile( onTap: () { final customOidc4vcProfile = state.model.profileSetting @@ -87,9 +77,10 @@ class DidKeyTypeWidget extends StatelessWidget { ? Icons.radio_button_checked : Icons.radio_button_unchecked, size: Sizes.icon2x, - color: Theme.of(context).colorScheme.onPrimary, + color: Theme.of(context).colorScheme.primary, ), ), + const DividerForRadioList(), ], ); }, diff --git a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/draft_type_widget.dart b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/draft_type_widget.dart index f535378a1..6232a4434 100644 --- a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/draft_type_widget.dart +++ b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/draft_type_widget.dart @@ -1,4 +1,5 @@ import 'package:altme/app/app.dart'; +import 'package:altme/app/shared/widget/divider_for_radio_list.dart'; import 'package:altme/dashboard/dashboard.dart'; import 'package:altme/l10n/l10n.dart'; import 'package:flutter/material.dart'; @@ -25,17 +26,6 @@ class DraftTypeWidget extends StatelessWidget { final draftType = OIDC4VCIDraftType.values[index]; return Column( children: [ - if (index != 0) - Padding( - padding: const EdgeInsets.symmetric(horizontal: 8), - child: Divider( - height: 0, - color: Theme.of(context) - .colorScheme - .onSurface - .withOpacity(0.12), - ), - ), ListTile( onTap: () { context.read().updateProfileSetting( @@ -50,9 +40,7 @@ class DraftTypeWidget extends StatelessWidget { ), title: Text( draftType.formattedString, - style: Theme.of(context).textTheme.bodyLarge?.copyWith( - color: Theme.of(context).colorScheme.onPrimary, - ), + style: Theme.of(context).textTheme.bodyLarge, ), trailing: Icon( state.model.profileSetting.selfSovereignIdentityOptions @@ -61,9 +49,10 @@ class DraftTypeWidget extends StatelessWidget { ? Icons.radio_button_checked : Icons.radio_button_unchecked, size: Sizes.icon2x, - color: Theme.of(context).colorScheme.onPrimary, + color: Theme.of(context).colorScheme.primary, ), ), + const DividerForRadioList() ], ); }, diff --git a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/proof_header_widget.dart b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/proof_header_widget.dart index a1e62c379..40d3f993e 100644 --- a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/proof_header_widget.dart +++ b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/proof_header_widget.dart @@ -1,4 +1,5 @@ import 'package:altme/app/app.dart'; +import 'package:altme/app/shared/widget/divider_for_radio_list.dart'; import 'package:altme/dashboard/dashboard.dart'; import 'package:altme/l10n/l10n.dart'; import 'package:flutter/material.dart'; @@ -25,17 +26,6 @@ class ProofHeaderWidget extends StatelessWidget { final proofHeaderType = ProofHeaderType.values[index]; return Column( children: [ - if (index != 0) - Padding( - padding: const EdgeInsets.symmetric(horizontal: 8), - child: Divider( - height: 0, - color: Theme.of(context) - .colorScheme - .onSurface - .withOpacity(0.12), - ), - ), ListTile( onTap: () { context.read().updateProfileSetting( @@ -50,9 +40,7 @@ class ProofHeaderWidget extends StatelessWidget { ), title: Text( proofHeaderType.formattedString, - style: Theme.of(context).textTheme.bodyLarge?.copyWith( - color: Theme.of(context).colorScheme.onPrimary, - ), + style: Theme.of(context).textTheme.bodyLarge, ), trailing: Icon( state.model.profileSetting.selfSovereignIdentityOptions @@ -61,9 +49,10 @@ class ProofHeaderWidget extends StatelessWidget { ? Icons.radio_button_checked : Icons.radio_button_unchecked, size: Sizes.icon2x, - color: Theme.of(context).colorScheme.onPrimary, + color: Theme.of(context).colorScheme.primary, ), ), + const DividerForRadioList(), ], ); }, diff --git a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/proof_type_widget.dart b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/proof_type_widget.dart index 98af2898d..1adf0cae1 100644 --- a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/proof_type_widget.dart +++ b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/proof_type_widget.dart @@ -1,4 +1,5 @@ import 'package:altme/app/app.dart'; +import 'package:altme/app/shared/widget/divider_for_radio_list.dart'; import 'package:altme/dashboard/dashboard.dart'; import 'package:altme/l10n/l10n.dart'; import 'package:flutter/material.dart'; @@ -25,17 +26,6 @@ class ProofTypeWidget extends StatelessWidget { final proofType = ProofType.values[index]; return Column( children: [ - if (index != 0) - Padding( - padding: const EdgeInsets.symmetric(horizontal: 8), - child: Divider( - height: 0, - color: Theme.of(context) - .colorScheme - .onSurface - .withOpacity(0.12), - ), - ), ListTile( onTap: () { context.read().updateProfileSetting( @@ -50,9 +40,7 @@ class ProofTypeWidget extends StatelessWidget { ), title: Text( proofType.formattedString, - style: Theme.of(context).textTheme.bodyLarge?.copyWith( - color: Theme.of(context).colorScheme.onPrimary, - ), + style: Theme.of(context).textTheme.bodyLarge, ), trailing: Icon( state.model.profileSetting.selfSovereignIdentityOptions @@ -61,9 +49,10 @@ class ProofTypeWidget extends StatelessWidget { ? Icons.radio_button_checked : Icons.radio_button_unchecked, size: Sizes.icon2x, - color: Theme.of(context).colorScheme.onPrimary, + color: Theme.of(context).colorScheme.primary, ), ), + const DividerForRadioList(), ], ); }, diff --git a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/vc_format_widget.dart b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/vc_format_widget.dart index 868cc7e7c..4eeff5dcc 100644 --- a/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/vc_format_widget.dart +++ b/lib/dashboard/drawer/ssi/oidc4vc_settngs/widget/vc_format_widget.dart @@ -1,4 +1,5 @@ import 'package:altme/app/app.dart'; +import 'package:altme/app/shared/widget/divider_for_radio_list.dart'; import 'package:altme/dashboard/dashboard.dart'; import 'package:altme/l10n/l10n.dart'; import 'package:flutter/material.dart'; @@ -25,17 +26,6 @@ class VCFormatWidget extends StatelessWidget { final vcFormatType = VCFormatType.values[index]; return Column( children: [ - if (index != 0) - Padding( - padding: const EdgeInsets.symmetric(horizontal: 8), - child: Divider( - height: 0, - color: Theme.of(context) - .colorScheme - .onSurface - .withOpacity(0.12), - ), - ), ListTile( onTap: () { context.read().updateProfileSetting( @@ -50,9 +40,7 @@ class VCFormatWidget extends StatelessWidget { ), title: Text( vcFormatType.vcValue, - style: Theme.of(context).textTheme.bodyLarge?.copyWith( - color: Theme.of(context).colorScheme.onPrimary, - ), + style: Theme.of(context).textTheme.bodyLarge, ), trailing: Icon( state.model.profileSetting.selfSovereignIdentityOptions @@ -61,9 +49,10 @@ class VCFormatWidget extends StatelessWidget { ? Icons.radio_button_checked : Icons.radio_button_unchecked, size: Sizes.icon2x, - color: Theme.of(context).colorScheme.onPrimary, + color: Theme.of(context).colorScheme.primary, ), ), + const DividerForRadioList(), ], ); }, diff --git a/lib/dashboard/drawer/wallet_settings/widget/language_selector_widget.dart b/lib/dashboard/drawer/wallet_settings/widget/language_selector_widget.dart index 8eb1f298c..6111908fe 100644 --- a/lib/dashboard/drawer/wallet_settings/widget/language_selector_widget.dart +++ b/lib/dashboard/drawer/wallet_settings/widget/language_selector_widget.dart @@ -68,11 +68,12 @@ class LanguageSelectorWidget extends StatelessWidget { ), ), title: Text( - languageType.getTitle( - l10n: l10n, - name: languageType.name, - ), - style: Theme.of(context).textTheme.bodyLarge), + languageType.getTitle( + l10n: l10n, + name: languageType.name, + ), + style: Theme.of(context).textTheme.bodyLarge, + ), trailing: Icon( state.languageType == languageType ? Icons.radio_button_checked diff --git a/lib/dashboard/home/tab_bar/credentials/list/widgets/home_credential_category_item.dart b/lib/dashboard/home/tab_bar/credentials/list/widgets/home_credential_category_item.dart index 6fc517883..2875d8f0b 100644 --- a/lib/dashboard/home/tab_bar/credentials/list/widgets/home_credential_category_item.dart +++ b/lib/dashboard/home/tab_bar/credentials/list/widgets/home_credential_category_item.dart @@ -57,30 +57,36 @@ class HomeCredentialCategoryItem extends StatelessWidget { ), ), const SizedBox(height: 14), - GridView.builder( - physics: const NeverScrollableScrollPhysics(), - shrinkWrap: true, - gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount( - crossAxisCount: 2, - crossAxisSpacing: 14, - mainAxisSpacing: 14, - childAspectRatio: Sizes.credentialAspectRatio, + Padding( + padding: const EdgeInsets.symmetric( + horizontal: 4, + vertical: 0, ), - itemCount: sortedCredentials.length + 1, - itemBuilder: (_, index) { - if (index == sortedCredentials.length) { - if (credentialCategory == CredentialCategory.pendingCards) { - return Container(); + child: GridView.builder( + physics: const NeverScrollableScrollPhysics(), + shrinkWrap: true, + gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount( + crossAxisCount: 2, + crossAxisSpacing: 14, + mainAxisSpacing: 14, + childAspectRatio: Sizes.credentialAspectRatio, + ), + itemCount: sortedCredentials.length + 1, + itemBuilder: (_, index) { + if (index == sortedCredentials.length) { + if (credentialCategory == CredentialCategory.pendingCards) { + return Container(); + } + return AddCredentialButton( + credentialCategory: credentialCategory, + ); + } else { + return HomeCredentialItem( + credentialModel: sortedCredentials[index], + ); } - return AddCredentialButton( - credentialCategory: credentialCategory, - ); - } else { - return HomeCredentialItem( - credentialModel: sortedCredentials[index], - ); - } - }, + }, + ), ), ], ),