mirror of
https://github.com/cake-tech/cake_wallet.git
synced 2024-12-23 03:59:23 +00:00
Cw 354 app issues with huge font size (#906)
* fix: make welcome screen scrollable * fix: make pre seed page scrollable * fix: make wallet seed page scrollable * refactor: remove unnecessary and stacked widgets and remove IntrinsicHeight & LayoutBuilder used for SingleChildScrollView, and replace it for CustomScrollView on welcome_page.dart * refactor: remove unnecessary Flexible widgets and remove IntrinsicHeight & LayoutBuilder for SingleChildScrollView and replace it for CustomScrollView on pre_seed_page.dart * refactor: remove unnecessary and stacked widgets and remove IntrinsicHeight & LayoutBuilder used for SingleChildScrollView, and replace it for CustomScrollView on wallet_seed_page.dart * fix: revert welcome_page.dart unwanted changes * fix: image expands more than needed * fix: fix image expands more than needed while testing on Linux build * Fix Scrolling behavior on Desktop and Overflow on Mobile --------- Co-authored-by: OmarHatem <omarh.ismail1@gmail.com>
This commit is contained in:
parent
d5642fa0ff
commit
bb6dea0292
3 changed files with 231 additions and 285 deletions
|
@ -2,7 +2,6 @@ import 'package:cake_wallet/utils/responsive_layout_util.dart';
|
||||||
import 'package:cw_core/wallet_type.dart';
|
import 'package:cw_core/wallet_type.dart';
|
||||||
import 'package:cake_wallet/routes.dart';
|
import 'package:cake_wallet/routes.dart';
|
||||||
import 'package:cake_wallet/themes/theme_base.dart';
|
import 'package:cake_wallet/themes/theme_base.dart';
|
||||||
import 'package:flutter/cupertino.dart';
|
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:cake_wallet/generated/i18n.dart';
|
import 'package:cake_wallet/generated/i18n.dart';
|
||||||
import 'package:cake_wallet/src/widgets/primary_button.dart';
|
import 'package:cake_wallet/src/widgets/primary_button.dart';
|
||||||
|
@ -38,46 +37,33 @@ class PreSeedPage extends BasePage {
|
||||||
padding: EdgeInsets.all(24),
|
padding: EdgeInsets.all(24),
|
||||||
child: ConstrainedBox(
|
child: ConstrainedBox(
|
||||||
constraints: BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint),
|
constraints: BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint),
|
||||||
child: Column(
|
|
||||||
children: [
|
|
||||||
Flexible(
|
|
||||||
flex: 2,
|
|
||||||
child: AspectRatio(
|
|
||||||
aspectRatio: 1,
|
|
||||||
child: FittedBox(child: image, fit: BoxFit.contain))),
|
|
||||||
Flexible(
|
|
||||||
flex: 3,
|
|
||||||
child: Column(
|
child: Column(
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
children: [
|
children: <Widget>[
|
||||||
|
ConstrainedBox(
|
||||||
|
constraints: BoxConstraints(
|
||||||
|
maxHeight: MediaQuery.of(context).size.height * 0.3
|
||||||
|
),
|
||||||
|
child: AspectRatio(aspectRatio: 1, child: image),
|
||||||
|
),
|
||||||
Padding(
|
Padding(
|
||||||
padding: EdgeInsets.only(top: 70, left: 16, right: 16),
|
padding: EdgeInsets.all(10),
|
||||||
child: Text(
|
child: Text(
|
||||||
S
|
S.of(context).pre_seed_description(wordsCount.toString()),
|
||||||
.of(context)
|
|
||||||
.pre_seed_description(wordsCount.toString()),
|
|
||||||
textAlign: TextAlign.center,
|
textAlign: TextAlign.center,
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
fontSize: 14,
|
fontSize: 14,
|
||||||
fontWeight: FontWeight.normal,
|
fontWeight: FontWeight.normal,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context).primaryTextTheme.bodySmall!.color!),
|
||||||
.primaryTextTheme!
|
|
||||||
.bodySmall!
|
|
||||||
.color!),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
PrimaryButton(
|
PrimaryButton(
|
||||||
onPressed: () => Navigator.of(context)
|
onPressed: () =>
|
||||||
.popAndPushNamed(Routes.seed, arguments: true),
|
Navigator.of(context).popAndPushNamed(Routes.seed, arguments: true),
|
||||||
text: S.of(context).pre_seed_button_text,
|
text: S.of(context).pre_seed_button_text,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context).accentTextTheme!.bodyLarge!.color!,
|
||||||
.accentTextTheme!
|
|
||||||
.bodyLarge!
|
|
||||||
.color!,
|
|
||||||
textColor: Colors.white)
|
textColor: Colors.white)
|
||||||
],
|
],
|
||||||
))
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
));
|
));
|
||||||
|
|
|
@ -52,8 +52,7 @@ class WalletSeedPage extends BasePage {
|
||||||
}
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget? leading(BuildContext context) =>
|
Widget? leading(BuildContext context) => isNewWalletCreated ? null : super.leading(context);
|
||||||
isNewWalletCreated ? null: super.leading(context);
|
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget trailing(BuildContext context) {
|
Widget trailing(BuildContext context) {
|
||||||
|
@ -67,16 +66,11 @@ class WalletSeedPage extends BasePage {
|
||||||
margin: EdgeInsets.only(left: 10),
|
margin: EdgeInsets.only(left: 10),
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||||
color: Theme.of(context)
|
color: Theme.of(context).accentTextTheme.bodySmall!.color!),
|
||||||
.accentTextTheme!
|
|
||||||
.bodySmall!
|
|
||||||
.color!),
|
|
||||||
child: Text(
|
child: Text(
|
||||||
S.of(context).seed_language_next,
|
S.of(context).seed_language_next,
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
fontSize: 14,
|
fontSize: 14, fontWeight: FontWeight.w600, color: Palette.blueCraiola),
|
||||||
fontWeight: FontWeight.w600,
|
|
||||||
color: Palette.blueCraiola),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
|
@ -87,27 +81,22 @@ class WalletSeedPage extends BasePage {
|
||||||
Widget body(BuildContext context) {
|
Widget body(BuildContext context) {
|
||||||
final image = currentTheme.type == ThemeType.dark ? imageDark : imageLight;
|
final image = currentTheme.type == ThemeType.dark ? imageDark : imageLight;
|
||||||
|
|
||||||
return WillPopScope(onWillPop: () async => false, child: Container(
|
return WillPopScope(
|
||||||
|
onWillPop: () async => false,
|
||||||
|
child: Container(
|
||||||
padding: EdgeInsets.all(24),
|
padding: EdgeInsets.all(24),
|
||||||
alignment: Alignment.center,
|
alignment: Alignment.center,
|
||||||
child: ConstrainedBox(
|
child: ConstrainedBox(
|
||||||
constraints:
|
constraints: BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint),
|
||||||
BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint),
|
|
||||||
child: Column(
|
|
||||||
children: <Widget>[
|
|
||||||
Flexible(
|
|
||||||
flex: 2,
|
|
||||||
child: AspectRatio(
|
|
||||||
aspectRatio: 1,
|
|
||||||
child: FittedBox(child: image, fit: BoxFit.fill))),
|
|
||||||
Flexible(
|
|
||||||
flex: 3,
|
|
||||||
child: Column(
|
child: Column(
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
Padding(
|
ConstrainedBox(
|
||||||
padding: EdgeInsets.only(top: 33),
|
constraints:
|
||||||
child: Observer(builder: (_) {
|
BoxConstraints(maxHeight: MediaQuery.of(context).size.height * 0.3),
|
||||||
|
child: AspectRatio(aspectRatio: 1, child: image),
|
||||||
|
),
|
||||||
|
Observer(builder: (_) {
|
||||||
return Column(
|
return Column(
|
||||||
crossAxisAlignment: CrossAxisAlignment.center,
|
crossAxisAlignment: CrossAxisAlignment.center,
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
|
@ -116,46 +105,34 @@ class WalletSeedPage extends BasePage {
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
fontSize: 20,
|
fontSize: 20,
|
||||||
fontWeight: FontWeight.w600,
|
fontWeight: FontWeight.w600,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context).primaryTextTheme.titleLarge!.color!),
|
||||||
.primaryTextTheme!
|
|
||||||
.titleLarge!
|
|
||||||
.color!),
|
|
||||||
),
|
),
|
||||||
Padding(
|
Padding(
|
||||||
padding:
|
padding: EdgeInsets.only(top: 20, left: 16, right: 16),
|
||||||
EdgeInsets.only(top: 20, left: 16, right: 16),
|
|
||||||
child: Text(
|
child: Text(
|
||||||
walletSeedViewModel.seed,
|
walletSeedViewModel.seed,
|
||||||
textAlign: TextAlign.center,
|
textAlign: TextAlign.center,
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
fontSize: 14,
|
fontSize: 14,
|
||||||
fontWeight: FontWeight.normal,
|
fontWeight: FontWeight.normal,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context).primaryTextTheme.bodySmall!.color!),
|
||||||
.primaryTextTheme!
|
|
||||||
.bodySmall!
|
|
||||||
.color!),
|
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
],
|
],
|
||||||
);
|
);
|
||||||
}),
|
}),
|
||||||
),
|
|
||||||
Column(
|
Column(
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
isNewWalletCreated
|
isNewWalletCreated
|
||||||
? Padding(
|
? Padding(
|
||||||
padding: EdgeInsets.only(
|
padding: EdgeInsets.only(bottom: 43, left: 43, right: 43),
|
||||||
bottom: 52, left: 43, right: 43),
|
|
||||||
child: Text(
|
child: Text(
|
||||||
S.of(context).seed_reminder,
|
S.of(context).seed_reminder,
|
||||||
textAlign: TextAlign.center,
|
textAlign: TextAlign.center,
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
fontWeight: FontWeight.normal,
|
fontWeight: FontWeight.normal,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context).primaryTextTheme.labelSmall!.color!),
|
||||||
.primaryTextTheme!
|
|
||||||
.labelSmall!
|
|
||||||
.color!),
|
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
: Offstage(),
|
: Offstage(),
|
||||||
|
@ -182,16 +159,12 @@ class WalletSeedPage extends BasePage {
|
||||||
child: Builder(
|
child: Builder(
|
||||||
builder: (context) => PrimaryButton(
|
builder: (context) => PrimaryButton(
|
||||||
onPressed: () {
|
onPressed: () {
|
||||||
Clipboard.setData(ClipboardData(
|
Clipboard.setData(
|
||||||
text: walletSeedViewModel.seed));
|
ClipboardData(text: walletSeedViewModel.seed));
|
||||||
showBar<void>(context,
|
showBar<void>(context, S.of(context).copied_to_clipboard);
|
||||||
S.of(context).copied_to_clipboard);
|
|
||||||
},
|
},
|
||||||
text: S.of(context).copy,
|
text: S.of(context).copy,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context).accentTextTheme.bodyMedium!.color!,
|
||||||
.accentTextTheme!
|
|
||||||
.bodyMedium!
|
|
||||||
.color!,
|
|
||||||
textColor: Colors.white)),
|
textColor: Colors.white)),
|
||||||
))
|
))
|
||||||
],
|
],
|
||||||
|
@ -199,9 +172,8 @@ class WalletSeedPage extends BasePage {
|
||||||
],
|
],
|
||||||
)
|
)
|
||||||
],
|
],
|
||||||
))
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
)));
|
),
|
||||||
|
));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -46,43 +46,41 @@ class WelcomePage extends BasePage {
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget body(BuildContext context) {
|
Widget body(BuildContext context) {
|
||||||
final welcomeImage = currentTheme.type == ThemeType.dark ? welcomeImageDark : welcomeImageLight;
|
final welcomeImage = currentTheme.type == ThemeType.dark
|
||||||
|
? welcomeImageDark
|
||||||
|
: welcomeImageLight;
|
||||||
|
|
||||||
final newWalletImage = Image.asset('assets/images/new_wallet.png',
|
final newWalletImage = Image.asset('assets/images/new_wallet.png',
|
||||||
height: 12,
|
height: 12,
|
||||||
width: 12,
|
width: 12,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.accentTextTheme!
|
.accentTextTheme.headlineSmall!
|
||||||
.headlineSmall!
|
|
||||||
.decorationColor!);
|
.decorationColor!);
|
||||||
final restoreWalletImage = Image.asset('assets/images/restore_wallet.png',
|
final restoreWalletImage = Image.asset('assets/images/restore_wallet.png',
|
||||||
height: 12,
|
height: 12,
|
||||||
|
|
||||||
width: 12,
|
width: 12,
|
||||||
color: Theme.of(context).primaryTextTheme!.titleLarge!.color!);
|
|
||||||
|
color: Theme.of(context).primaryTextTheme.titleLarge!.color!);
|
||||||
|
|
||||||
return WillPopScope(
|
return WillPopScope(
|
||||||
onWillPop: () async => false,
|
onWillPop: () async => false,
|
||||||
child: Container(
|
child: Container(
|
||||||
|
alignment: Alignment.center,
|
||||||
padding: EdgeInsets.only(top: 64, bottom: 24, left: 24, right: 24),
|
padding: EdgeInsets.only(top: 64, bottom: 24, left: 24, right: 24),
|
||||||
child: Center(
|
|
||||||
child: ConstrainedBox(
|
child: ConstrainedBox(
|
||||||
constraints:
|
constraints: BoxConstraints(
|
||||||
BoxConstraints(maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint),
|
maxWidth: ResponsiveLayoutUtil.kDesktopMaxWidthConstraint),
|
||||||
child: Column(
|
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
||||||
children: <Widget>[
|
|
||||||
Flexible(
|
|
||||||
flex: 2,
|
|
||||||
child: AspectRatio(
|
|
||||||
aspectRatio: aspectRatioImage,
|
|
||||||
child: FittedBox(child: welcomeImage, fit: BoxFit.fill))),
|
|
||||||
Flexible(
|
|
||||||
flex: 3,
|
|
||||||
child: Column(
|
child: Column(
|
||||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
Column(
|
Column(
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
|
AspectRatio(
|
||||||
|
aspectRatio: aspectRatioImage,
|
||||||
|
child: FittedBox(
|
||||||
|
child: welcomeImage, fit: BoxFit.contain),
|
||||||
|
),
|
||||||
Padding(
|
Padding(
|
||||||
padding: EdgeInsets.only(top: 24),
|
padding: EdgeInsets.only(top: 24),
|
||||||
child: Text(
|
child: Text(
|
||||||
|
@ -91,9 +89,8 @@ class WelcomePage extends BasePage {
|
||||||
fontSize: 18,
|
fontSize: 18,
|
||||||
fontWeight: FontWeight.w500,
|
fontWeight: FontWeight.w500,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.accentTextTheme!
|
.accentTextTheme.displayMedium!
|
||||||
.displayMedium!
|
.color!,
|
||||||
.color,
|
|
||||||
),
|
),
|
||||||
textAlign: TextAlign.center,
|
textAlign: TextAlign.center,
|
||||||
),
|
),
|
||||||
|
@ -106,8 +103,7 @@ class WelcomePage extends BasePage {
|
||||||
fontSize: 36,
|
fontSize: 36,
|
||||||
fontWeight: FontWeight.bold,
|
fontWeight: FontWeight.bold,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.primaryTextTheme!
|
.primaryTextTheme.titleLarge!
|
||||||
.titleLarge!
|
|
||||||
.color!,
|
.color!,
|
||||||
),
|
),
|
||||||
textAlign: TextAlign.center,
|
textAlign: TextAlign.center,
|
||||||
|
@ -121,9 +117,8 @@ class WelcomePage extends BasePage {
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
fontWeight: FontWeight.w500,
|
fontWeight: FontWeight.w500,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.accentTextTheme!
|
.accentTextTheme.displayMedium!
|
||||||
.displayMedium!
|
.color!,
|
||||||
.color,
|
|
||||||
),
|
),
|
||||||
textAlign: TextAlign.center,
|
textAlign: TextAlign.center,
|
||||||
),
|
),
|
||||||
|
@ -138,26 +133,23 @@ class WelcomePage extends BasePage {
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
fontWeight: FontWeight.normal,
|
fontWeight: FontWeight.normal,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.accentTextTheme!
|
.accentTextTheme.displayMedium!
|
||||||
.displayMedium!
|
.color!,
|
||||||
.color,
|
|
||||||
),
|
),
|
||||||
textAlign: TextAlign.center,
|
textAlign: TextAlign.center,
|
||||||
),
|
),
|
||||||
Padding(
|
Padding(
|
||||||
padding: EdgeInsets.only(top: 24),
|
padding: EdgeInsets.only(top: 24),
|
||||||
child: PrimaryImageButton(
|
child: PrimaryImageButton(
|
||||||
onPressed: () =>
|
onPressed: () => Navigator.pushNamed(
|
||||||
Navigator.pushNamed(context, Routes.newWalletFromWelcome),
|
context, Routes.newWalletFromWelcome),
|
||||||
image: newWalletImage,
|
image: newWalletImage,
|
||||||
text: S.of(context).create_new,
|
text: S.of(context).create_new,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.accentTextTheme!
|
.accentTextTheme.titleSmall!
|
||||||
.titleSmall!
|
|
||||||
.decorationColor!,
|
.decorationColor!,
|
||||||
textColor: Theme.of(context)
|
textColor: Theme.of(context)
|
||||||
.accentTextTheme!
|
.accentTextTheme.headlineSmall!
|
||||||
.headlineSmall!
|
|
||||||
.decorationColor!,
|
.decorationColor!,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
@ -165,26 +157,22 @@ class WelcomePage extends BasePage {
|
||||||
padding: EdgeInsets.only(top: 10),
|
padding: EdgeInsets.only(top: 10),
|
||||||
child: PrimaryImageButton(
|
child: PrimaryImageButton(
|
||||||
onPressed: () {
|
onPressed: () {
|
||||||
Navigator.pushNamed(context, Routes.restoreOptions,
|
Navigator.pushNamed(
|
||||||
|
context, Routes.restoreOptions,
|
||||||
arguments: true);
|
arguments: true);
|
||||||
},
|
},
|
||||||
image: restoreWalletImage,
|
image: restoreWalletImage,
|
||||||
text: S.of(context).restore_wallet,
|
text: S.of(context).restore_wallet,
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.accentTextTheme!
|
.accentTextTheme.bodySmall!
|
||||||
.bodySmall!
|
|
||||||
.color!,
|
.color!,
|
||||||
textColor: Theme.of(context)
|
textColor: Theme.of(context)
|
||||||
.primaryTextTheme!
|
.primaryTextTheme.titleLarge!
|
||||||
.titleLarge!
|
|
||||||
.color!),
|
.color!),
|
||||||
)
|
)
|
||||||
],
|
],
|
||||||
)
|
)
|
||||||
],
|
],
|
||||||
))
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
)));
|
)));
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue