Ecosystem/cake_wallet
1
0
Fork 0
mirror of https://github.com/cake-tech/cake_wallet.git synced 2025-01-20 17:54:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 15

Fix Popup width constraint and add focus orders

Browse source
This commit is contained in:
Godwin Asuquo 2023-02-20 23:24:19 +02:00
parent 17aa72e460
commit 44b1eec81d
12 changed files with 508 additions and 522 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
lib/router.dart
View file

@ -334,7 +334,7 @@ Route<dynamic> createRoute(RouteSettings settings) {
getIt.get<ContactListPage>()); getIt.get<ContactListPage>());
case Routes.pickerAddressBook: case Routes.pickerAddressBook:
final selectedCurrency = settings.arguments as CryptoCurrency; final selectedCurrency = settings.arguments as CryptoCurrency?;
return MaterialPageRoute<void>( return MaterialPageRoute<void>(
builder: (_) => getIt.get<ContactListPage>(param1: selectedCurrency)); builder: (_) => getIt.get<ContactListPage>(param1: selectedCurrency));

32
lib/src/screens/exchange/exchange_template_page.dart
View file

@ -1,13 +1,9 @@
import 'dart:ui';
import 'package:cake_wallet/exchange/exchange_provider.dart'; import 'package:cake_wallet/exchange/exchange_provider.dart';
import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/screens/base_page.dart';
import 'package:cake_wallet/src/widgets/keyboard_done_button.dart'; import 'package:cake_wallet/src/widgets/keyboard_done_button.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:flutter_mobx/flutter_mobx.dart';
import 'package:keyboard_actions/keyboard_actions.dart'; import 'package:keyboard_actions/keyboard_actions.dart';
import 'package:keyboard_actions/keyboard_actions_config.dart';
import 'package:keyboard_actions/keyboard_actions_item.dart';
import 'package:mobx/mobx.dart'; import 'package:mobx/mobx.dart';
import 'package:cake_wallet/generated/i18n.dart'; import 'package:cake_wallet/generated/i18n.dart';
import 'package:cw_core/crypto_currency.dart'; import 'package:cw_core/crypto_currency.dart';
@ -78,7 +74,7 @@ class ExchangeTemplatePage extends BasePage {
config: KeyboardActionsConfig( config: KeyboardActionsConfig(
keyboardActionsPlatform: KeyboardActionsPlatform.IOS, keyboardActionsPlatform: KeyboardActionsPlatform.IOS,
keyboardBarColor: keyboardBarColor:
Theme.of(context).accentTextTheme!.bodyText1!.backgroundColor!, Theme.of(context).accentTextTheme.bodyText1!.backgroundColor!,
nextFocus: false, nextFocus: false,
actions: [ actions: [
KeyboardActionsItem( KeyboardActionsItem(
@ -103,13 +99,15 @@ class ExchangeTemplatePage extends BasePage {
), ),
gradient: LinearGradient( gradient: LinearGradient(
colors: [ colors: [
Theme.of(context).primaryTextTheme!.bodyText2!.color!, Theme.of(context).primaryTextTheme.bodyText2!.color!,
Theme.of(context).primaryTextTheme!.bodyText2!.decorationColor!, Theme.of(context).primaryTextTheme.bodyText2!.decorationColor!,
], ],
stops: [0.35, 1.0], stops: [0.35, 1.0],
begin: Alignment.topLeft, begin: Alignment.topLeft,
end: Alignment.bottomRight), end: Alignment.bottomRight),
), ),
child: FocusTraversalGroup(
policy: OrderedTraversalPolicy(),
child: Column( child: Column(
children: <Widget>[ children: <Widget>[
Container( Container(
@ -121,12 +119,10 @@ class ExchangeTemplatePage extends BasePage {
gradient: LinearGradient( gradient: LinearGradient(
colors: [ colors: [
Theme.of(context) Theme.of(context)
.primaryTextTheme! .primaryTextTheme.subtitle2!
.subtitle2!
.color!, .color!,
Theme.of(context) Theme.of(context)
.primaryTextTheme! .primaryTextTheme.subtitle2!
.subtitle2!
.decorationColor!, .decorationColor!,
], ],
begin: Alignment.topLeft, begin: Alignment.topLeft,
@ -159,10 +155,9 @@ class ExchangeTemplatePage extends BasePage {
imageArrow: arrowBottomPurple, imageArrow: arrowBottomPurple,
currencyButtonColor: Colors.transparent, currencyButtonColor: Colors.transparent,
addressButtonsColor: addressButtonsColor:
Theme.of(context).focusColor!, Theme.of(context).focusColor,
borderColor: Theme.of(context) borderColor: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.bodyText1!
.bodyText1!
.color!, .color!,
currencyValueValidator: AmountValidator( currencyValueValidator: AmountValidator(
type: exchangeViewModel.wallet.type), type: exchangeViewModel.wallet.type),
@ -200,10 +195,9 @@ class ExchangeTemplatePage extends BasePage {
imageArrow: arrowBottomCakeGreen, imageArrow: arrowBottomCakeGreen,
currencyButtonColor: Colors.transparent, currencyButtonColor: Colors.transparent,
addressButtonsColor: addressButtonsColor:
Theme.of(context).focusColor!, Theme.of(context).focusColor,
borderColor: Theme.of(context) borderColor: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.bodyText1!
.bodyText1!
.decorationColor!, .decorationColor!,
currencyValueValidator: AmountValidator( currencyValueValidator: AmountValidator(
type: exchangeViewModel.wallet.type), type: exchangeViewModel.wallet.type),
@ -214,6 +208,7 @@ class ExchangeTemplatePage extends BasePage {
], ],
), ),
), ),
),
bottomSectionPadding: bottomSectionPadding:
EdgeInsets.only(left: 24, right: 24, bottom: 24), EdgeInsets.only(left: 24, right: 24, bottom: 24),
bottomSection: Column(children: <Widget>[ bottomSection: Column(children: <Widget>[
@ -230,8 +225,7 @@ class ExchangeTemplatePage extends BasePage {
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: TextStyle( style: TextStyle(
color: Theme.of(context) color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline1!
.headline1!
.decorationColor!, .decorationColor!,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 12), fontSize: 12),

19
lib/src/screens/exchange/widgets/currency_picker.dart
View file

@ -1,8 +1,7 @@
import 'dart:ui';
import 'package:cake_wallet/src/screens/exchange/widgets/currency_picker_item_widget.dart'; import 'package:cake_wallet/src/screens/exchange/widgets/currency_picker_item_widget.dart';
import 'package:cake_wallet/src/screens/exchange/widgets/picker_item.dart'; import 'package:cake_wallet/src/screens/exchange/widgets/picker_item.dart';
import 'package:cake_wallet/src/widgets/alert_close_button.dart'; import 'package:cake_wallet/src/widgets/alert_close_button.dart';
import 'package:flutter/cupertino.dart'; import 'package:cake_wallet/utils/responsive_layout_util.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:cw_core/crypto_currency.dart'; import 'package:cw_core/crypto_currency.dart';
import 'package:cake_wallet/src/widgets/alert_background.dart'; import 'package:cake_wallet/src/widgets/alert_background.dart';
@ -54,7 +53,7 @@ class CurrencyPickerState extends State<CurrencyPicker> {
if (subString.isNotEmpty) { if (subString.isNotEmpty) {
subPickerItemsList = items subPickerItemsList = items
.where((element) => .where((element) =>
(element.title != null ? element.title.toLowerCase().contains(subString.toLowerCase()) : false) || (element.title.toLowerCase().contains(subString.toLowerCase())) ||
(element.tag != null ? element.tag!.toLowerCase().contains(subString.toLowerCase()) : false) || (element.tag != null ? element.tag!.toLowerCase().contains(subString.toLowerCase()) : false) ||
(element.name != null ? element.name!.toLowerCase().contains(subString.toLowerCase()) : false)) (element.name != null ? element.name!.toLowerCase().contains(subString.toLowerCase()) : false))
.toList(); .toList();
@ -67,11 +66,9 @@ class CurrencyPickerState extends State<CurrencyPicker> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return AlertBackground( return AlertBackground(
child: Stack( child: Column(
alignment: Alignment.center,
children: [
Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[ children: <Widget>[
if (widget.title?.isNotEmpty ?? false) if (widget.title?.isNotEmpty ?? false)
Container( Container(
@ -93,10 +90,11 @@ class CurrencyPickerState extends State<CurrencyPicker> {
child: ClipRRect( child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(30)), borderRadius: BorderRadius.all(Radius.circular(30)),
child: Container( child: Container(
color: Theme.of(context).accentTextTheme!.headline6!.color!, color: Theme.of(context).accentTextTheme.headline6!.color!,
child: ConstrainedBox( child: ConstrainedBox(
constraints: BoxConstraints( constraints: BoxConstraints(
maxHeight: MediaQuery.of(context).size.height * 0.65, maxHeight: MediaQuery.of(context).size.height * 0.65,
maxWidth: ResponsiveLayoutUtil.kPopupWidth
), ),
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
@ -132,7 +130,7 @@ class CurrencyPickerState extends State<CurrencyPicker> {
), ),
), ),
Divider( Divider(
color: Theme.of(context).accentTextTheme!.headline6!.backgroundColor!, color: Theme.of(context).accentTextTheme.headline6!.backgroundColor!,
height: 1, height: 1,
), ),
if (widget.selectedAtIndex != -1) if (widget.selectedAtIndex != -1)
@ -170,8 +168,7 @@ class CurrencyPickerState extends State<CurrencyPicker> {
), ),
), ),
), ),
], SizedBox(height: ResponsiveLayoutUtil.kPopupSpaceHeight),
),
AlertCloseButton(), AlertCloseButton(),
], ],
), ),

5
lib/src/screens/exchange/widgets/desktop_exchange_cards_section.dart
View file

@ -12,7 +12,9 @@ class DesktopExchangeCardsSection extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Column( return FocusTraversalGroup(
policy: OrderedTraversalPolicy(),
child: Column(
children: <Widget>[ children: <Widget>[
Padding( Padding(
padding: EdgeInsets.only(top: 55, left: 24, right: 24), padding: EdgeInsets.only(top: 55, left: 24, right: 24),
@ -23,6 +25,7 @@ class DesktopExchangeCardsSection extends StatelessWidget {
child: secondExchangeCard, child: secondExchangeCard,
), ),
], ],
),
); );
} }
} }

49
lib/src/screens/exchange/widgets/exchange_card.dart
View file

@ -159,7 +159,7 @@ class ExchangeCardState extends State<ExchangeCard> {
final copyImage = Image.asset('assets/images/copy_content.png', final copyImage = Image.asset('assets/images/copy_content.png',
height: 16, height: 16,
width: 16, width: 16,
color: Theme.of(context).primaryTextTheme!.headline3!.color!); color: Theme.of(context).primaryTextTheme.headline3!.color!);
return Container( return Container(
width: double.infinity, width: double.infinity,
@ -174,7 +174,7 @@ class ExchangeCardState extends State<ExchangeCard> {
style: TextStyle( style: TextStyle(
fontSize: 18, fontSize: 18,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Theme.of(context).textTheme!.headline5!.color!), color: Theme.of(context).textTheme.headline5!.color!),
) )
], ],
), ),
@ -209,7 +209,7 @@ class ExchangeCardState extends State<ExchangeCard> {
child: Container( child: Container(
height: 32, height: 32,
decoration: BoxDecoration( decoration: BoxDecoration(
color: widget.addressButtonsColor ?? Theme.of(context).primaryTextTheme!.headline4!.color!, color: widget.addressButtonsColor ?? Theme.of(context).primaryTextTheme.headline4!.color!,
borderRadius: borderRadius:
BorderRadius.all(Radius.circular(6))), BorderRadius.all(Radius.circular(6))),
child: Center( child: Center(
@ -220,8 +220,7 @@ class ExchangeCardState extends State<ExchangeCard> {
fontSize: 12, fontSize: 12,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
color: Theme.of(context) color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline4!
.headline4!
.decorationColor!)), .decorationColor!)),
), ),
), ),
@ -240,6 +239,8 @@ class ExchangeCardState extends State<ExchangeCard> {
mainAxisAlignment: MainAxisAlignment.spaceBetween, mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [ children: [
Flexible( Flexible(
child: FocusTraversalOrder(
order: NumericFocusOrder(1),
child: BaseTextFormField( child: BaseTextFormField(
focusNode: widget.amountFocusNode, focusNode: widget.amountFocusNode,
controller: amountController, controller: amountController,
@ -262,21 +263,20 @@ class ExchangeCardState extends State<ExchangeCard> {
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.headline1!
.headline1!
.decorationColor!), .decorationColor!),
validator: _isAmountEditable validator: _isAmountEditable
? widget.currencyValueValidator ? widget.currencyValueValidator
: null), : null),
), ),
),
if (widget.hasAllAmount) if (widget.hasAllAmount)
Container( Container(
height: 32, height: 32,
width: 32, width: 32,
decoration: BoxDecoration( decoration: BoxDecoration(
color: Theme.of(context) color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline4!
.headline4!
.color!, .color!,
borderRadius: borderRadius:
BorderRadius.all(Radius.circular(6))), BorderRadius.all(Radius.circular(6))),
@ -289,8 +289,7 @@ class ExchangeCardState extends State<ExchangeCard> {
fontSize: 12, fontSize: 12,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
color: Theme.of(context) color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline4!
.headline4!
.decorationColor!)), .decorationColor!)),
), ),
), ),
@ -301,8 +300,7 @@ class ExchangeCardState extends State<ExchangeCard> {
], ],
)), )),
Divider(height: 1,color: Theme.of(context) Divider(height: 1,color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline5!
.headline5!
.decorationColor!), .decorationColor!),
Padding( Padding(
padding: EdgeInsets.only(top: 5), padding: EdgeInsets.only(top: 5),
@ -320,8 +318,7 @@ class ExchangeCardState extends State<ExchangeCard> {
fontSize: 10, fontSize: 10,
height: 1.2, height: 1.2,
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.headline1!
.headline1!
.decorationColor!), .decorationColor!),
) )
: Offstage(), : Offstage(),
@ -335,8 +332,7 @@ class ExchangeCardState extends State<ExchangeCard> {
fontSize: 10, fontSize: 10,
height: 1.2, height: 1.2,
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.headline1!
.headline1!
.decorationColor!)) .decorationColor!))
: Offstage(), : Offstage(),
])), ])),
@ -350,13 +346,14 @@ class ExchangeCardState extends State<ExchangeCard> {
fontSize: 14, fontSize: 14,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.headline1!
.headline1!
.decorationColor!), .decorationColor!),
)) ))
: Offstage(), : Offstage(),
_isAddressEditable _isAddressEditable
? Padding( ? FocusTraversalOrder(
order: NumericFocusOrder(2),
child: Padding(
padding: EdgeInsets.only(top: 20), padding: EdgeInsets.only(top: 20),
child: AddressTextField( child: AddressTextField(
focusNode: widget.addressFocusNode, focusNode: widget.addressFocusNode,
@ -389,8 +386,7 @@ class ExchangeCardState extends State<ExchangeCard> {
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Theme.of(context) color: Theme.of(context)
.accentTextTheme! .accentTextTheme.headline1!
.headline1!
.decorationColor!), .decorationColor!),
buttonColor: widget.addressButtonsColor, buttonColor: widget.addressButtonsColor,
validator: widget.addressTextFieldValidator, validator: widget.addressTextFieldValidator,
@ -399,12 +395,15 @@ class ExchangeCardState extends State<ExchangeCard> {
selectedCurrency: _selectedCurrency selectedCurrency: _selectedCurrency
), ),
),
) )
: Padding( : Padding(
padding: EdgeInsets.only(top: 10), padding: EdgeInsets.only(top: 10),
child: Builder( child: Builder(
builder: (context) => Stack(children: <Widget>[ builder: (context) => Stack(children: <Widget>[
BaseTextFormField( FocusTraversalOrder(
order: NumericFocusOrder(3),
child: BaseTextFormField(
controller: addressController, controller: addressController,
readOnly: true, readOnly: true,
borderColor: Colors.transparent, borderColor: Colors.transparent,
@ -415,6 +414,7 @@ class ExchangeCardState extends State<ExchangeCard> {
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Colors.white), color: Colors.white),
validator: widget.addressTextFieldValidator), validator: widget.addressTextFieldValidator),
),
Positioned( Positioned(
top: 2, top: 2,
right: 0, right: 0,
@ -457,8 +457,7 @@ class ExchangeCardState extends State<ExchangeCard> {
child: Image.asset( child: Image.asset(
'assets/images/open_book.png', 'assets/images/open_book.png',
color: Theme.of(context) color: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline4!
.headline4!
.decorationColor!, .decorationColor!,
)), )),
)), )),

24
lib/src/screens/send/send_page.dart
View file

@ -117,7 +117,9 @@ class SendPage extends BasePage {
key: _formKey, key: _formKey,
child: ScrollableWithBottomSection( child: ScrollableWithBottomSection(
contentPadding: EdgeInsets.only(bottom: 24), contentPadding: EdgeInsets.only(bottom: 24),
content: Column( content: FocusTraversalGroup(
policy: OrderedTraversalPolicy(),
child: Column(
children: <Widget>[ children: <Widget>[
Container( Container(
height: _sendCardHeight(context), height: _sendCardHeight(context),
@ -158,12 +160,10 @@ class SendPage extends BasePage {
dotWidth: 6.0, dotWidth: 6.0,
dotHeight: 6.0, dotHeight: 6.0,
dotColor: Theme.of(context) dotColor: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline3!
.headline3!
.backgroundColor!, .backgroundColor!,
activeDotColor: Theme.of(context) activeDotColor: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline2!
.headline2!
.backgroundColor!), .backgroundColor!),
) )
: Offstage(); : Offstage();
@ -248,6 +248,7 @@ class SendPage extends BasePage {
) )
], ],
), ),
),
bottomSectionPadding: bottomSectionPadding:
EdgeInsets.only(left: 24, right: 24, bottom: 24), EdgeInsets.only(left: 24, right: 24, bottom: 24),
bottomSection: Column( bottomSection: Column(
@ -261,8 +262,7 @@ class SendPage extends BasePage {
text: 'Change your asset (${sendViewModel.selectedCryptoCurrency})', text: 'Change your asset (${sendViewModel.selectedCryptoCurrency})',
color: Colors.transparent, color: Colors.transparent,
textColor: Theme.of(context) textColor: Theme.of(context)
.accentTextTheme! .accentTextTheme.headline3!
.headline3!
.decorationColor!, .decorationColor!,
) )
) )
@ -280,13 +280,11 @@ class SendPage extends BasePage {
text: S.of(context).add_receiver, text: S.of(context).add_receiver,
color: Colors.transparent, color: Colors.transparent,
textColor: Theme.of(context) textColor: Theme.of(context)
.accentTextTheme! .accentTextTheme.headline3!
.headline3!
.decorationColor!, .decorationColor!,
isDottedBorder: true, isDottedBorder: true,
borderColor: Theme.of(context) borderColor: Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline3!
.headline3!
.decorationColor!, .decorationColor!,
)), )),
Observer( Observer(
@ -306,7 +304,7 @@ class SendPage extends BasePage {
item.address.isEmpty || item.cryptoAmount.isEmpty) item.address.isEmpty || item.cryptoAmount.isEmpty)
.toList(); .toList();
if (notValidItems?.isNotEmpty ?? false) { if (notValidItems.isNotEmpty ?? false) {
showErrorValidationAlert(context); showErrorValidationAlert(context);
return; return;
} }
@ -315,7 +313,7 @@ class SendPage extends BasePage {
}, },
text: S.of(context).send, text: S.of(context).send,
color: Theme.of(context).accentTextTheme!.bodyText1!.color!, color: Theme.of(context).accentTextTheme.bodyText1!.color!,
textColor: Colors.white, textColor: Colors.white,
isLoading: sendViewModel.state is IsExecutingState || isLoading: sendViewModel.state is IsExecutingState ||
sendViewModel.state is TransactionCommitting, sendViewModel.state is TransactionCommitting,

21
lib/src/widgets/address_text_field.dart
View file

@ -58,12 +58,13 @@ class AddressTextField extends StatelessWidget {
TextFormField( TextFormField(
onFieldSubmitted: (_) => FocusScope.of(context).unfocus(), onFieldSubmitted: (_) => FocusScope.of(context).unfocus(),
enabled: isActive, enabled: isActive,
autofocus: true,
controller: controller, controller: controller,
focusNode: focusNode, focusNode: focusNode,
style: textStyle ?? style: textStyle ??
TextStyle( TextStyle(
fontSize: 16, fontSize: 16,
color: Theme.of(context).primaryTextTheme!.headline6!.color!), color: Theme.of(context).primaryTextTheme.headline6!.color!),
decoration: InputDecoration( decoration: InputDecoration(
suffixIcon: SizedBox( suffixIcon: SizedBox(
width: prefixIconWidth * options.length + width: prefixIconWidth * options.length +
@ -115,8 +116,7 @@ class AddressTextField extends StatelessWidget {
decoration: BoxDecoration( decoration: BoxDecoration(
color: buttonColor ?? color: buttonColor ??
Theme.of(context) Theme.of(context)
.accentTextTheme! .accentTextTheme.headline6!
.headline6!
.color!, .color!,
borderRadius: borderRadius:
BorderRadius.all(Radius.circular(6))), BorderRadius.all(Radius.circular(6))),
@ -124,8 +124,7 @@ class AddressTextField extends StatelessWidget {
'assets/images/paste_ios.png', 'assets/images/paste_ios.png',
color: iconColor ?? color: iconColor ??
Theme.of(context) Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline4!
.headline4!
.decorationColor!, .decorationColor!,
)), )),
)), )),
@ -142,8 +141,7 @@ class AddressTextField extends StatelessWidget {
decoration: BoxDecoration( decoration: BoxDecoration(
color: buttonColor ?? color: buttonColor ??
Theme.of(context) Theme.of(context)
.accentTextTheme! .accentTextTheme.headline6!
.headline6!
.color!, .color!,
borderRadius: borderRadius:
BorderRadius.all(Radius.circular(6))), BorderRadius.all(Radius.circular(6))),
@ -151,8 +149,7 @@ class AddressTextField extends StatelessWidget {
'assets/images/qr_code_icon.png', 'assets/images/qr_code_icon.png',
color: iconColor ?? color: iconColor ??
Theme.of(context) Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline4!
.headline4!
.decorationColor!, .decorationColor!,
)), )),
)) ))
@ -171,8 +168,7 @@ class AddressTextField extends StatelessWidget {
decoration: BoxDecoration( decoration: BoxDecoration(
color: buttonColor ?? color: buttonColor ??
Theme.of(context) Theme.of(context)
.accentTextTheme! .accentTextTheme.headline6!
.headline6!
.color!, .color!,
borderRadius: borderRadius:
BorderRadius.all(Radius.circular(6))), BorderRadius.all(Radius.circular(6))),
@ -180,8 +176,7 @@ class AddressTextField extends StatelessWidget {
'assets/images/open_book.png', 'assets/images/open_book.png',
color: iconColor ?? color: iconColor ??
Theme.of(context) Theme.of(context)
.primaryTextTheme! .primaryTextTheme.headline4!
.headline4!
.decorationColor!, .decorationColor!,
)), )),
)) ))

5
lib/src/widgets/alert_close_button.dart
View file

@ -13,9 +13,7 @@ class AlertCloseButton extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Positioned( return GestureDetector(
bottom: 60,
child: GestureDetector(
onTap: () => Navigator.of(context).pop(), onTap: () => Navigator.of(context).pop(),
child: Container( child: Container(
height: 42, height: 42,
@ -28,7 +26,6 @@ class AlertCloseButton extends StatelessWidget {
child: image ?? closeButton, child: image ?? closeButton,
), ),
), ),
)
); );
} }
} }

9
lib/src/widgets/base_text_form_field.dart
View file

@ -64,6 +64,7 @@ class BaseTextFormField extends StatelessWidget {
readOnly: readOnly, readOnly: readOnly,
initialValue: initialValue, initialValue: initialValue,
focusNode: focusNode, focusNode: focusNode,
autofocus: true,
controller: controller, controller: controller,
keyboardType: keyboardType, keyboardType: keyboardType,
textInputAction: textInputAction, textInputAction: textInputAction,
@ -78,7 +79,7 @@ class BaseTextFormField extends StatelessWidget {
TextStyle( TextStyle(
fontSize: 16.0, fontSize: 16.0,
color: color:
textColor ?? Theme.of(context).primaryTextTheme!.headline6!.color!), textColor ?? Theme.of(context).primaryTextTheme.headline6!.color!),
decoration: InputDecoration( decoration: InputDecoration(
prefix: prefix, prefix: prefix,
prefixIcon: prefixIcon, prefixIcon: prefixIcon,
@ -92,17 +93,17 @@ class BaseTextFormField extends StatelessWidget {
focusedBorder: UnderlineInputBorder( focusedBorder: UnderlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: borderColor ?? color: borderColor ??
Theme.of(context).primaryTextTheme!.headline6!.backgroundColor!, Theme.of(context).primaryTextTheme.headline6!.backgroundColor!,
width: borderWidth)), width: borderWidth)),
disabledBorder: UnderlineInputBorder( disabledBorder: UnderlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: borderColor ?? color: borderColor ??
Theme.of(context).primaryTextTheme!.headline6!.backgroundColor!, Theme.of(context).primaryTextTheme.headline6!.backgroundColor!,
width: borderWidth)), width: borderWidth)),
enabledBorder: UnderlineInputBorder( enabledBorder: UnderlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: borderColor ?? color: borderColor ??
Theme.of(context).primaryTextTheme!.headline6!.backgroundColor!, Theme.of(context).primaryTextTheme.headline6!.backgroundColor!,
width: borderWidth))), width: borderWidth))),
validator: validator, validator: validator,
); );

28
lib/src/widgets/check_box_picker.dart
View file

@ -1,4 +1,5 @@
import 'package:cake_wallet/palette.dart'; import 'package:cake_wallet/palette.dart';
import 'package:cake_wallet/utils/responsive_layout_util.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:cake_wallet/src/widgets/alert_background.dart'; import 'package:cake_wallet/src/widgets/alert_background.dart';
import 'package:cake_wallet/src/widgets/alert_close_button.dart'; import 'package:cake_wallet/src/widgets/alert_close_button.dart';
@ -32,13 +33,11 @@ class CheckBoxPickerState extends State<CheckBoxPicker> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return AlertBackground( return AlertBackground(
child: Stack( child: Center(
alignment: Alignment.center, child: Column(
children: <Widget>[
Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: <Widget>[ children: <Widget>[
if (widget.title?.isNotEmpty ?? false) if (widget.title.isNotEmpty)
Container( Container(
padding: EdgeInsets.symmetric(horizontal: 24), padding: EdgeInsets.symmetric(horizontal: 24),
child: Text( child: Text(
@ -58,10 +57,11 @@ class CheckBoxPickerState extends State<CheckBoxPicker> {
child: ClipRRect( child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(30)), borderRadius: BorderRadius.all(Radius.circular(30)),
child: Container( child: Container(
color: Theme.of(context).accentTextTheme!.headline6!.color!, color: Theme.of(context).accentTextTheme.headline6!.color!,
child: ConstrainedBox( child: ConstrainedBox(
constraints: BoxConstraints( constraints: BoxConstraints(
maxHeight: MediaQuery.of(context).size.height * 0.65, maxHeight: MediaQuery.of(context).size.height * 0.65,
maxWidth: ResponsiveLayoutUtil.kPopupWidth,
), ),
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
@ -70,7 +70,7 @@ class CheckBoxPickerState extends State<CheckBoxPicker> {
child: Stack( child: Stack(
alignment: Alignment.center, alignment: Alignment.center,
children: <Widget>[ children: <Widget>[
(items?.length ?? 0) > 3 (items.length) > 3
? Scrollbar( ? Scrollbar(
controller: controller, controller: controller,
child: itemsList(), child: itemsList(),
@ -84,25 +84,25 @@ class CheckBoxPickerState extends State<CheckBoxPicker> {
), ),
), ),
), ),
)
],
), ),
SizedBox(height: ResponsiveLayoutUtil.kPopupSpaceHeight),
AlertCloseButton(), AlertCloseButton(),
], ],
), ),
),
); );
} }
Widget itemsList() { Widget itemsList() {
return Container( return Container(
color: Theme.of(context).accentTextTheme!.headline6!.backgroundColor!, color: Theme.of(context).accentTextTheme.headline6!.backgroundColor!,
child: ListView.separated( child: ListView.separated(
padding: EdgeInsets.zero, padding: EdgeInsets.zero,
controller: controller, controller: controller,
shrinkWrap: true, shrinkWrap: true,
separatorBuilder: (context, index) => widget.isSeparated separatorBuilder: (context, index) => widget.isSeparated
? Divider( ? Divider(
color: Theme.of(context).accentTextTheme!.headline6!.backgroundColor!, color: Theme.of(context).accentTextTheme.headline6!.backgroundColor!,
height: 1, height: 1,
) )
: const SizedBox(), : const SizedBox(),
@ -121,13 +121,13 @@ class CheckBoxPickerState extends State<CheckBoxPicker> {
}, },
child: Container( child: Container(
height: 55, height: 55,
color: Theme.of(context).accentTextTheme!.headline6!.color!, color: Theme.of(context).accentTextTheme.headline6!.color!,
padding: EdgeInsets.only(left: 24, right: 24), padding: EdgeInsets.only(left: 24, right: 24),
child: CheckboxListTile( child: CheckboxListTile(
value: item.value, value: item.value,
activeColor: item.value activeColor: item.value
? Palette.blueCraiola ? Palette.blueCraiola
: Theme.of(context).accentTextTheme!.subtitle1!.decorationColor!, : Theme.of(context).accentTextTheme.subtitle1!.decorationColor!,
checkColor: Colors.white, checkColor: Colors.white,
title: widget.displayItem?.call(item) ?? title: widget.displayItem?.call(item) ??
Text( Text(
@ -138,7 +138,7 @@ class CheckBoxPickerState extends State<CheckBoxPicker> {
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: item.isDisabled color: item.isDisabled
? Colors.grey.withOpacity(0.5) ? Colors.grey.withOpacity(0.5)
: Theme.of(context).primaryTextTheme!.headline6!.color!, : Theme.of(context).primaryTextTheme.headline6!.color!,
decoration: TextDecoration.none, decoration: TextDecoration.none,
), ),
), ),

11
lib/src/widgets/picker.dart
View file

@ -1,5 +1,6 @@
// ignore_for_file: deprecated_member_use // ignore_for_file: deprecated_member_use
import 'package:cake_wallet/utils/responsive_layout_util.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:cake_wallet/src/widgets/alert_background.dart'; import 'package:cake_wallet/src/widgets/alert_background.dart';
import 'package:cake_wallet/src/widgets/alert_close_button.dart'; import 'package:cake_wallet/src/widgets/alert_close_button.dart';
@ -70,11 +71,9 @@ class _PickerState<Item> extends State<Picker> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return AlertBackground( return AlertBackground(
child: Stack( child: Column(
alignment: Alignment.center,
children: <Widget>[
Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[ children: <Widget>[
if (widget.title?.isNotEmpty ?? false) if (widget.title?.isNotEmpty ?? false)
Container( Container(
@ -100,6 +99,7 @@ class _PickerState<Item> extends State<Picker> {
child: ConstrainedBox( child: ConstrainedBox(
constraints: BoxConstraints( constraints: BoxConstraints(
maxHeight: MediaQuery.of(context).size.height * 0.65, maxHeight: MediaQuery.of(context).size.height * 0.65,
maxWidth: ResponsiveLayoutUtil.kPopupWidth,
), ),
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
@ -169,9 +169,8 @@ class _PickerState<Item> extends State<Picker> {
), ),
), ),
), ),
)
],
), ),
SizedBox(height: ResponsiveLayoutUtil.kPopupSpaceHeight),
AlertCloseButton(), AlertCloseButton(),
], ],
), ),

3
lib/utils/responsive_layout_util.dart
View file

@ -3,6 +3,9 @@ import 'package:flutter/material.dart';
class ResponsiveLayoutUtil { class ResponsiveLayoutUtil {
static const double _kMobileThreshold = 900; static const double _kMobileThreshold = 900;
static const double kDesktopMaxWidthConstraint = 400; static const double kDesktopMaxWidthConstraint = 400;
static const double kPopupWidth = 400;
static const double kPopupSpaceHeight = 100;
const ResponsiveLayoutUtil._(); const ResponsiveLayoutUtil._();