Update widget contraints

This commit is contained in:
Godwin Asuquo 2023-02-10 20:07:53 +02:00
parent 150d43b2da
commit 32d2bf2c85
2 changed files with 168 additions and 152 deletions

View file

@ -50,7 +50,7 @@ class _WalletNameFormState extends State<WalletNameForm> {
_languageSelectorKey = GlobalKey<SeedLanguageSelectorState>(), _languageSelectorKey = GlobalKey<SeedLanguageSelectorState>(),
_controller = TextEditingController(); _controller = TextEditingController();
// static const aspectRatioImage = 1.22; static const aspectRatioImage = 1.22;
final GlobalKey<FormState> _formKey; final GlobalKey<FormState> _formKey;
final GlobalKey<SeedLanguageSelectorState> _languageSelectorKey; final GlobalKey<SeedLanguageSelectorState> _languageSelectorKey;
@ -84,126 +84,138 @@ class _WalletNameFormState extends State<WalletNameForm> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Padding(
padding: EdgeInsets.only(top: 24), padding: EdgeInsets.only(top: 24),
child: ScrollableWithBottomSection( child: Center(
contentPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24), child: ConstrainedBox(
content: Column(crossAxisAlignment: CrossAxisAlignment.center, children: [ constraints: BoxConstraints(maxWidth: 600),
Padding( child: ScrollableWithBottomSection(
padding: EdgeInsets.only(left: 12, right: 12), contentPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24),
child: SizedBox( content: Column(crossAxisAlignment: CrossAxisAlignment.center, children: [
height: MediaQuery.of(context).size.height * 0.4, Padding(
child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)), padding: EdgeInsets.only(left: 12, right: 12),
), child: AspectRatio(
Padding( aspectRatio: aspectRatioImage,
padding: EdgeInsets.only(top: 24), child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)),
child: Form( ),
key: _formKey, Padding(
child: Stack( padding: EdgeInsets.only(top: 24),
alignment: Alignment.centerRight, child: Form(
children: [ key: _formKey,
TextFormField( child: Stack(
onChanged: (value) => _walletNewVM.name = value, alignment: Alignment.centerRight,
controller: _controller, children: [
textAlign: TextAlign.center, TextFormField(
style: TextStyle( onChanged: (value) => _walletNewVM.name = value,
fontSize: 20.0, controller: _controller,
fontWeight: FontWeight.w600, textAlign: TextAlign.center,
color: Theme.of(context).primaryTextTheme!.headline6!.color!), style: TextStyle(
decoration: InputDecoration( fontSize: 20.0,
hintStyle: TextStyle( fontWeight: FontWeight.w600,
fontSize: 18.0, color: Theme.of(context).primaryTextTheme!.headline6!.color!),
fontWeight: FontWeight.w500, decoration: InputDecoration(
color: Theme.of(context).accentTextTheme!.headline2!.color!), hintStyle: TextStyle(
hintText: S.of(context).wallet_name, fontSize: 18.0,
focusedBorder: UnderlineInputBorder( fontWeight: FontWeight.w500,
borderSide: BorderSide( color: Theme.of(context).accentTextTheme!.headline2!.color!),
color: hintText: S.of(context).wallet_name,
Theme.of(context).accentTextTheme!.headline2!.decorationColor!, focusedBorder: UnderlineInputBorder(
width: 1.0)), borderSide: BorderSide(
enabledBorder: UnderlineInputBorder( color: Theme.of(context)
borderSide: BorderSide( .accentTextTheme!
color: Theme.of(context).accentTextTheme!.headline2!.decorationColor!, .headline2!
width: 1.0), .decorationColor!,
), width: 1.0)),
suffixIcon: IconButton( enabledBorder: UnderlineInputBorder(
onPressed: () async { borderSide: BorderSide(
final rName = await generateName(); color: Theme.of(context)
FocusManager.instance.primaryFocus?.unfocus(); .accentTextTheme!
.headline2!
setState(() { .decorationColor!,
_controller.text = rName; width: 1.0),
_walletNewVM.name = rName;
_controller.selection = TextSelection.fromPosition(
TextPosition(offset: _controller.text.length));
});
},
icon: Container(
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(6.0),
color: Theme.of(context).hintColor,
), ),
width: 34, suffixIcon: IconButton(
height: 34, onPressed: () async {
child: Image.asset( final rName = await generateName();
'assets/images/refresh_icon.png', FocusManager.instance.primaryFocus?.unfocus();
color:
Theme.of(context).primaryTextTheme!.headline4!.decorationColor!, setState(() {
_controller.text = rName;
_walletNewVM.name = rName;
_controller.selection = TextSelection.fromPosition(
TextPosition(offset: _controller.text.length));
});
},
icon: Container(
padding: const EdgeInsets.all(8),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(6.0),
color: Theme.of(context).hintColor,
),
width: 34,
height: 34,
child: Image.asset(
'assets/images/refresh_icon.png',
color: Theme.of(context)
.primaryTextTheme!
.headline4!
.decorationColor!,
),
),
), ),
), ),
validator: WalletNameValidator(),
), ),
), ],
validator: WalletNameValidator(),
), ),
], ),
), ),
), if (_walletNewVM.hasLanguageSelector) ...[
), Padding(
if (_walletNewVM.hasLanguageSelector) ...[ padding: EdgeInsets.only(top: 40),
Padding( child: Text(
padding: EdgeInsets.only(top: 40), S.of(context).seed_language_choose,
child: Text( textAlign: TextAlign.center,
S.of(context).seed_language_choose, style: TextStyle(
textAlign: TextAlign.center, fontSize: 16.0,
style: TextStyle( fontWeight: FontWeight.w500,
fontSize: 16.0, color: Theme.of(context).primaryTextTheme!.headline6!.color!),
fontWeight: FontWeight.w500, ),
color: Theme.of(context).primaryTextTheme!.headline6!.color!), ),
), Padding(
), padding: EdgeInsets.only(top: 24),
Padding( child: SeedLanguageSelector(
padding: EdgeInsets.only(top: 24), key: _languageSelectorKey, initialSelected: defaultSeedLanguage),
child: SeedLanguageSelector( )
key: _languageSelectorKey, initialSelected: defaultSeedLanguage), ]
) ]),
] bottomSectionPadding: EdgeInsets.all(24),
]), bottomSection: Column(
bottomSectionPadding: EdgeInsets.all(24), children: [
bottomSection: Column( Observer(
children: [ builder: (context) {
Observer( return LoadingPrimaryButton(
builder: (context) { onPressed: _confirmForm,
return LoadingPrimaryButton( text: S.of(context).seed_language_next,
onPressed: _confirmForm, color: Colors.green,
text: S.of(context).seed_language_next, textColor: Colors.white,
color: Colors.green, isLoading: _walletNewVM.state is IsExecutingState,
textColor: Colors.white, isDisabled: _walletNewVM.name.isEmpty,
isLoading: _walletNewVM.state is IsExecutingState, );
isDisabled: _walletNewVM.name.isEmpty, },
); ),
}, const SizedBox(height: 25),
), GestureDetector(
const SizedBox(height: 25), onTap: () {
GestureDetector( Navigator.of(context)
onTap: () { .pushNamed(Routes.advancedPrivacySettings, arguments: _walletNewVM.type);
Navigator.of(context) },
.pushNamed(Routes.advancedPrivacySettings, arguments: _walletNewVM.type); child: Text(S.of(context).advanced_privacy_settings),
}, ),
child: Text(S.of(context).advanced_privacy_settings), ],
), )),
], ),
)), ),
); );
} }

View file

@ -57,46 +57,50 @@ class WalletTypeFormState extends State<WalletTypeForm> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return ScrollableWithBottomSection( return Center(
contentPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24), child: ConstrainedBox(
content: Column( constraints: BoxConstraints(maxWidth: 600),
crossAxisAlignment: CrossAxisAlignment.center, child: ScrollableWithBottomSection(
children: <Widget>[ contentPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24),
Padding( content: Column(
padding: EdgeInsets.only(left: 12, right: 12), crossAxisAlignment: CrossAxisAlignment.center,
child: SizedBox( children: <Widget>[
height: MediaQuery.of(context).size.height * 0.4, Padding(
child: FittedBox(child: widget.walletImage, fit: BoxFit.fitWidth), padding: EdgeInsets.only(left: 12, right: 12),
), child: AspectRatio(
aspectRatio: aspectRatioImage,
child: FittedBox(child: widget.walletImage, fit: BoxFit.fill)),
),
Padding(
padding: EdgeInsets.only(top: 48),
child: Text(
S.of(context).choose_wallet_currency,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
color: Theme.of(context).primaryTextTheme.headline6!.color!),
),
),
...types.map((type) => Padding(
padding: EdgeInsets.only(top: 24),
child: SelectButton(
image: _iconFor(type),
text: walletTypeToDisplayName(type),
isSelected: selected == type,
onTap: () => setState(() => selected = type)),
))
],
), ),
Padding( bottomSectionPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24),
padding: EdgeInsets.only(top: 48), bottomSection: PrimaryButton(
child: Text( onPressed: () => onTypeSelected(),
S.of(context).choose_wallet_currency, text: S.of(context).seed_language_next,
textAlign: TextAlign.center, color: Theme.of(context).accentTextTheme.bodyText1!.color!,
style: TextStyle( textColor: Colors.white,
fontSize: 16, isDisabled: selected == null,
fontWeight: FontWeight.w500,
color: Theme.of(context).primaryTextTheme.headline6!.color!),
),
), ),
...types.map((type) => Padding( ),
padding: EdgeInsets.only(top: 24),
child: SelectButton(
image: _iconFor(type),
text: walletTypeToDisplayName(type),
isSelected: selected == type,
onTap: () => setState(() => selected = type)),
))
],
),
bottomSectionPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24),
bottomSection: PrimaryButton(
onPressed: () => onTypeSelected(),
text: S.of(context).seed_language_next,
color: Theme.of(context).accentTextTheme.bodyText1!.color!,
textColor: Colors.white,
isDisabled: selected == null,
), ),
); );
} }