CWA-212 | applied new design to exchange page; reworked exchange card; added new properties to address_text_field, base_text_form_field and top_panel

This commit is contained in:
Oleksandr Sobol 2020-05-12 20:46:42 +03:00
parent 38d7dbcb33
commit 16dfb3a2d5
5 changed files with 484 additions and 199 deletions

View file

@ -1,4 +1,6 @@
import 'dart:ui'; import 'dart:ui';
import 'package:dotted_border/dotted_border.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:mobx/mobx.dart'; import 'package:mobx/mobx.dart';
@ -19,16 +21,17 @@ import 'package:cake_wallet/src/screens/exchange/widgets/exchange_card.dart';
import 'package:cake_wallet/src/widgets/primary_button.dart'; import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/src/widgets/picker.dart'; import 'package:cake_wallet/src/widgets/picker.dart';
import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart'; import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
import 'package:cake_wallet/src/widgets/top_panel.dart';
class ExchangePage extends BasePage { class ExchangePage extends BasePage {
@override @override
String get title => S.current.exchange; String get title => S.current.exchange;
@override @override
bool get isModalBackButton => true; Color get backgroundColor => PaletteDark.walletCardSubAddressField;
final Image arrowBottomPurple = final Image arrowBottom =
Image.asset('assets/images/arrow_bottom_purple_icon.png', height: 8); Image.asset('assets/images/arrow_bottom_purple_icon.png', color: Colors.white, height: 6);
@override @override
Widget middle(BuildContext context) { Widget middle(BuildContext context) {
@ -38,31 +41,34 @@ class ExchangePage extends BasePage {
onPressed: () => _presentProviderPicker(context), onPressed: () => _presentProviderPicker(context),
highlightColor: Colors.transparent, highlightColor: Colors.transparent,
splashColor: Colors.transparent, splashColor: Colors.transparent,
child: Column( child: Row(
crossAxisAlignment: CrossAxisAlignment.center, mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[ children: <Widget>[
Row( Column(
mainAxisAlignment: MainAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center, mainAxisSize: MainAxisSize.min,
children: [ children: <Widget>[
Text(S.of(context).exchange, Text(S.of(context).exchange,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.w400,
color: Theme.of(context).primaryTextTheme.title.color)),
SizedBox(width: 5),
arrowBottomPurple
]),
Observer(
builder: (_) => Text('${exchangeStore.provider.title}',
style: TextStyle( style: TextStyle(
fontSize: 10.0, fontSize: 16.0,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
color: color: Colors.white)),
Theme.of(context).primaryTextTheme.headline.color))) Observer(
builder: (_) => Text('${exchangeStore.provider.title}',
style: TextStyle(
fontSize: 10.0,
fontWeight: FontWeight.w400,
color:PaletteDark.walletCardText)))
],
),
SizedBox(width: 5),
Padding(
padding: EdgeInsets.only(top: 8),
child: arrowBottom,
)
], ],
), )
); );
} }
@ -72,14 +78,16 @@ class ExchangePage extends BasePage {
return ButtonTheme( return ButtonTheme(
minWidth: double.minPositive, minWidth: double.minPositive,
highlightColor: Colors.transparent,
splashColor: Colors.transparent,
child: FlatButton( child: FlatButton(
padding: EdgeInsets.all(0), padding: EdgeInsets.all(0),
child: Text( child: Text(
S.of(context).clear, S.of(context).clear,
style: TextStyle( style: TextStyle(
color: Theme.of(context).accentTextTheme.caption.color, color: PaletteDark.walletCardText,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 16), fontSize: 14),
), ),
onPressed: () => exchangeStore.reset()), onPressed: () => exchangeStore.reset()),
); );
@ -117,10 +125,12 @@ class ExchangeFormState extends State<ExchangeForm> {
final Image arrowBottomPurple = Image.asset( final Image arrowBottomPurple = Image.asset(
'assets/images/arrow_bottom_purple_icon.png', 'assets/images/arrow_bottom_purple_icon.png',
color: Colors.white,
height: 8, height: 8,
); );
final Image arrowBottomCakeGreen = Image.asset( final Image arrowBottomCakeGreen = Image.asset(
'assets/images/arrow_bottom_cake_green.png', 'assets/images/arrow_bottom_cake_green.png',
color: Colors.white,
height: 8, height: 8,
); );
@ -141,156 +151,309 @@ class ExchangeFormState extends State<ExchangeForm> {
WidgetsBinding.instance.addPostFrameCallback( WidgetsBinding.instance.addPostFrameCallback(
(_) => _setReactions(context, exchangeStore, walletStore)); (_) => _setReactions(context, exchangeStore, walletStore));
return Form( return Container(
key: _formKey, color: PaletteDark.historyPanel,
child: ScrollableWithBottomSection( child: Form(
contentPadding: EdgeInsets.only(left: 20, right: 20), key: _formKey,
content: SingleChildScrollView( child: ScrollableWithBottomSection(
child: Column( contentPadding: EdgeInsets.only(bottom: 24),
mainAxisAlignment: MainAxisAlignment.spaceAround, content: Column(
children: <Widget>[ children: <Widget>[
TopPanel(
color: PaletteDark.menuList,
edgeInsets: EdgeInsets.only(bottom: 24),
widget: Column(
children: <Widget>[
TopPanel(
color: PaletteDark.walletCardSubAddressField,
widget: Observer(
builder: (_) => ExchangeCard(
key: depositKey,
title: S.of(context).you_will_send,
initialCurrency: exchangeStore.depositCurrency,
initialWalletName: depositWalletName,
initialAddress:
exchangeStore.depositCurrency == walletStore.type
? walletStore.address
: null,
initialIsAmountEditable: true,
initialIsAddressEditable: true,
isAmountEstimated: false,
currencies: CryptoCurrency.all,
onCurrencySelected: (currency) =>
exchangeStore.changeDepositCurrency(currency: currency),
imageArrow: arrowBottomPurple,
currencyButtonColor: PaletteDark.walletCardSubAddressField,
currencyValueValidator: (value) {
exchangeStore.validateCryptoCurrency(value);
return exchangeStore.errorMessage;
},
addressTextFieldValidator: (value) {
exchangeStore.validateAddress(value,
cryptoCurrency: exchangeStore.depositCurrency);
return exchangeStore.errorMessage;
},
),
)
),
Padding(
padding: EdgeInsets.only(top: 32, left: 24, right: 24),
child: Observer(
builder: (_) => ExchangeCard(
key: receiveKey,
title: S.of(context).you_will_get,
initialCurrency: exchangeStore.receiveCurrency,
initialWalletName: receiveWalletName,
initialAddress:
exchangeStore.receiveCurrency == walletStore.type
? walletStore.address
: null,
initialIsAmountEditable: false,
initialIsAddressEditable: true,
isAmountEstimated: true,
currencies: CryptoCurrency.all,
onCurrencySelected: (currency) => exchangeStore
.changeReceiveCurrency(currency: currency),
imageArrow: arrowBottomCakeGreen,
currencyButtonColor: PaletteDark.menuList,
currencyValueValidator: (value) {
exchangeStore.validateCryptoCurrency(value);
return exchangeStore.errorMessage;
},
addressTextFieldValidator: (value) {
exchangeStore.validateAddress(value,
cryptoCurrency: exchangeStore.receiveCurrency);
return exchangeStore.errorMessage;
},
)),
)
],
)
),
Padding( Padding(
padding: EdgeInsets.only(top: 10, bottom: 20), padding: EdgeInsets.only(
child: Text( top: 32,
S.of(context).you_will_send, left: 24,
style: TextStyle( bottom: 24
fontWeight: FontWeight.bold, ),
fontSize: 18, child: Row(
height: 1.1, mainAxisAlignment: MainAxisAlignment.start,
color: Theme.of(context).primaryTextTheme.title.color), children: <Widget>[
Text(
S.of(context).send_templates,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: PaletteDark.walletCardText
),
)
],
), ),
), ),
ExchangeCard( Container(
key: depositKey, height: 40,
initialCurrency: exchangeStore.depositCurrency, width: double.infinity,
initialWalletName: depositWalletName, padding: EdgeInsets.only(left: 24),
initialAddress: child: Observer(
exchangeStore.depositCurrency == walletStore.type builder: (_) {
? walletStore.address
: null, return ListView.builder(
initialIsAmountEditable: true, scrollDirection: Axis.horizontal,
initialIsAddressEditable: true, itemCount: 1,
isAmountEstimated: false, itemBuilder: (context, index) {
currencies: CryptoCurrency.all,
onCurrencySelected: (currency) => if (index == 0) {
exchangeStore.changeDepositCurrency(currency: currency), return GestureDetector(
imageArrow: arrowBottomPurple, onTap: () {},
currencyValueValidator: (value) { child: Container(
exchangeStore.validateCryptoCurrency(value); padding: EdgeInsets.only(right: 10),
return exchangeStore.errorMessage; child: DottedBorder(
}, borderType: BorderType.RRect,
addressTextFieldValidator: (value) { dashPattern: [8, 4],
exchangeStore.validateAddress(value, color: PaletteDark.menuList,
cryptoCurrency: exchangeStore.depositCurrency); strokeWidth: 2,
return exchangeStore.errorMessage; radius: Radius.circular(20),
}, child: Container(
), height: 40,
SizedBox(height: 35), width: 75,
Padding( padding: EdgeInsets.only(left: 10, right: 10),
padding: EdgeInsets.only(bottom: 20), alignment: Alignment.center,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(20)),
color: Colors.transparent,
),
child: Text(
S.of(context).send_new,
style: TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
color: PaletteDark.walletCardText
),
),
)
),
),
);
}
index -= 1;
return Container();
}
);
}
),
)
],
),
/*SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 10, bottom: 20),
child: Text( child: Text(
S.of(context).you_will_get, S.of(context).you_will_send,
style: TextStyle( style: TextStyle(
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 18, fontSize: 18,
height: 1.1, height: 1.1,
color: color: Theme.of(context).primaryTextTheme.title.color),
Theme.of(context).primaryTextTheme.title.color), ),
)), ),
Observer( ExchangeCard(
builder: (_) => ExchangeCard( key: depositKey,
key: receiveKey, initialCurrency: exchangeStore.depositCurrency,
initialCurrency: exchangeStore.receiveCurrency, initialWalletName: depositWalletName,
initialWalletName: receiveWalletName, initialAddress:
initialAddress: exchangeStore.depositCurrency == walletStore.type
exchangeStore.receiveCurrency == walletStore.type ? walletStore.address
? walletStore.address : null,
: null, initialIsAmountEditable: true,
initialIsAmountEditable: false, initialIsAddressEditable: true,
initialIsAddressEditable: true, isAmountEstimated: false,
isAmountEstimated: true, currencies: CryptoCurrency.all,
currencies: CryptoCurrency.all, /*onCurrencySelected: (currency) =>
onCurrencySelected: (currency) => exchangeStore exchangeStore.changeDepositCurrency(currency: currency),*/
.changeReceiveCurrency(currency: currency), imageArrow: arrowBottomPurple,
imageArrow: arrowBottomCakeGreen, currencyValueValidator: (value) {
currencyValueValidator: (value) { exchangeStore.validateCryptoCurrency(value);
exchangeStore.validateCryptoCurrency(value); return exchangeStore.errorMessage;
return exchangeStore.errorMessage; },
}, addressTextFieldValidator: (value) {
addressTextFieldValidator: (value) { exchangeStore.validateAddress(value,
exchangeStore.validateAddress(value, cryptoCurrency: exchangeStore.depositCurrency);
cryptoCurrency: exchangeStore.receiveCurrency); return exchangeStore.errorMessage;
return exchangeStore.errorMessage; },
}, ),
)), SizedBox(height: 35),
], Padding(
), padding: EdgeInsets.only(bottom: 20),
), child: Text(
bottomSectionPadding: EdgeInsets.only(top: 35, left: 20, right: 20), S.of(context).you_will_get,
bottomSection: Column(children: <Widget>[ style: TextStyle(
Padding( fontWeight: FontWeight.bold,
padding: EdgeInsets.only(bottom: 15), fontSize: 18,
child: Observer(builder: (_) { height: 1.1,
final description = color:
exchangeStore.provider is XMRTOExchangeProvider Theme.of(context).primaryTextTheme.title.color),
? S.of(context).amount_is_guaranteed )),
: S.of(context).amount_is_estimate; Observer(
return Center( builder: (_) => ExchangeCard(
child: Text( key: receiveKey,
description, initialCurrency: exchangeStore.receiveCurrency,
style: TextStyle(color: Palette.blueGrey, fontSize: 12), initialWalletName: receiveWalletName,
initialAddress:
exchangeStore.receiveCurrency == walletStore.type
? walletStore.address
: null,
initialIsAmountEditable: false,
initialIsAddressEditable: true,
isAmountEstimated: true,
currencies: CryptoCurrency.all,
/*onCurrencySelected: (currency) => exchangeStore
.changeReceiveCurrency(currency: currency),*/
imageArrow: arrowBottomCakeGreen,
currencyValueValidator: (value) {
exchangeStore.validateCryptoCurrency(value);
return exchangeStore.errorMessage;
},
addressTextFieldValidator: (value) {
exchangeStore.validateAddress(value,
cryptoCurrency: exchangeStore.receiveCurrency);
return exchangeStore.errorMessage;
},
)),
],
),
),*/
bottomSectionPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24),
bottomSection: Column(children: <Widget>[
Padding(
padding: EdgeInsets.only(bottom: 15),
child: Observer(builder: (_) {
final description =
exchangeStore.provider is XMRTOExchangeProvider
? S.of(context).amount_is_guaranteed
: S.of(context).amount_is_estimate;
return Center(
child: Text(
description,
style: TextStyle(
color: PaletteDark.walletCardText,
fontSize: 12
),
),
);
}),
),
Observer(
builder: (_) => LoadingPrimaryButton(
text: S.of(context).exchange,
onPressed: () {
if (_formKey.currentState.validate()) {
exchangeStore.createTrade();
}
},
color: Colors.blue,
textColor: Colors.white,
isLoading: exchangeStore.tradeState is TradeIsCreating,
)),
/*Observer(builder: (_) {
final title = exchangeStore.provider.description.title;
var imageSrc = '';
switch (exchangeStore.provider.description) {
case ExchangeProviderDescription.xmrto:
imageSrc = 'assets/images/xmr_btc.png';
break;
case ExchangeProviderDescription.changeNow:
imageSrc = 'assets/images/change_now.png';
break;
case ExchangeProviderDescription.morphToken:
imageSrc = 'assets/images/morph_icon.png';
break;
}
return Padding(
padding: EdgeInsets.only(top: 20, bottom: 20),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Image.asset(imageSrc),
SizedBox(width: 10),
Text(
S.of(context).powered_by(title),
style: TextStyle(fontSize: 14, color: Palette.powered),
)
],
), ),
); );
}), })*/
), ]),
Observer( )),
builder: (_) => LoadingPrimaryButton( );
text: S.of(context).exchange,
onPressed: () {
if (_formKey.currentState.validate()) {
exchangeStore.createTrade();
}
},
color: Theme.of(context)
.primaryTextTheme
.button
.backgroundColor,
textColor: Theme.of(context).primaryTextTheme.button.color,
isLoading: exchangeStore.tradeState is TradeIsCreating,
)),
Observer(builder: (_) {
final title = exchangeStore.provider.description.title;
var imageSrc = '';
switch (exchangeStore.provider.description) {
case ExchangeProviderDescription.xmrto:
imageSrc = 'assets/images/xmr_btc.png';
break;
case ExchangeProviderDescription.changeNow:
imageSrc = 'assets/images/change_now.png';
break;
case ExchangeProviderDescription.morphToken:
imageSrc = 'assets/images/morph_icon.png';
break;
}
return Padding(
padding: EdgeInsets.only(top: 20, bottom: 20),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Image.asset(imageSrc),
SizedBox(width: 10),
Text(
S.of(context).powered_by(title),
style: TextStyle(fontSize: 14, color: Palette.powered),
)
],
),
);
})
]),
));
} }
void _setReactions( void _setReactions(

View file

@ -5,10 +5,12 @@ import 'package:cake_wallet/generated/i18n.dart';
import 'package:cake_wallet/src/domain/common/crypto_currency.dart'; import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
import 'package:cake_wallet/src/widgets/picker.dart'; import 'package:cake_wallet/src/widgets/picker.dart';
import 'package:cake_wallet/src/widgets/address_text_field.dart'; import 'package:cake_wallet/src/widgets/address_text_field.dart';
import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
class ExchangeCard extends StatefulWidget { class ExchangeCard extends StatefulWidget {
ExchangeCard( ExchangeCard(
{Key key, {Key key,
this.title = '',
this.initialCurrency, this.initialCurrency,
this.initialAddress, this.initialAddress,
this.initialWalletName, this.initialWalletName,
@ -18,12 +20,14 @@ class ExchangeCard extends StatefulWidget {
this.currencies, this.currencies,
this.onCurrencySelected, this.onCurrencySelected,
this.imageArrow, this.imageArrow,
this.currencyButtonColor = Colors.transparent,
this.currencyValueValidator, this.currencyValueValidator,
this.addressTextFieldValidator}) this.addressTextFieldValidator})
: super(key: key); : super(key: key);
final List<CryptoCurrency> currencies; final List<CryptoCurrency> currencies;
final Function(CryptoCurrency) onCurrencySelected; final Function(CryptoCurrency) onCurrencySelected;
final String title;
final CryptoCurrency initialCurrency; final CryptoCurrency initialCurrency;
final String initialWalletName; final String initialWalletName;
final String initialAddress; final String initialAddress;
@ -31,6 +35,7 @@ class ExchangeCard extends StatefulWidget {
final bool initialIsAddressEditable; final bool initialIsAddressEditable;
final bool isAmountEstimated; final bool isAmountEstimated;
final Image imageArrow; final Image imageArrow;
final Color currencyButtonColor;
final FormFieldValidator<String> currencyValueValidator; final FormFieldValidator<String> currencyValueValidator;
final FormFieldValidator<String> addressTextFieldValidator; final FormFieldValidator<String> addressTextFieldValidator;
@ -42,6 +47,7 @@ class ExchangeCardState extends State<ExchangeCard> {
final addressController = TextEditingController(); final addressController = TextEditingController();
final amountController = TextEditingController(); final amountController = TextEditingController();
String _title;
String _min; String _min;
String _max; String _max;
CryptoCurrency _selectedCurrency; CryptoCurrency _selectedCurrency;
@ -52,6 +58,7 @@ class ExchangeCardState extends State<ExchangeCard> {
@override @override
void initState() { void initState() {
_title = widget.title;
_isAmountEditable = widget.initialIsAmountEditable; _isAmountEditable = widget.initialIsAmountEditable;
_isAddressEditable = widget.initialIsAddressEditable; _isAddressEditable = widget.initialIsAddressEditable;
_walletName = widget.initialWalletName; _walletName = widget.initialWalletName;
@ -103,33 +110,117 @@ class ExchangeCardState extends State<ExchangeCard> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Container(
padding: EdgeInsets.fromLTRB(22, 15, 22, 30),
width: double.infinity, width: double.infinity,
decoration: BoxDecoration( color: Colors.transparent,
color: Theme.of(context).cardColor, child: Column(
borderRadius: BorderRadius.all(Radius.circular(12))), children: <Widget>[
child: Column(children: <Widget>[ Row(
_isAmountEstimated != null && _isAmountEstimated mainAxisAlignment: MainAxisAlignment.start,
? Row(mainAxisAlignment: MainAxisAlignment.end, children: <Widget>[ children: <Widget>[
SizedBox( Text(
height: 30, _title,
child: Container( style: TextStyle(
padding: EdgeInsets.fromLTRB(10, 5, 10, 5), fontSize: 18,
decoration: BoxDecoration( fontWeight: FontWeight.w600,
color: Palette.lightGrey, color: PaletteDark.walletCardText
borderRadius: BorderRadius.circular(10.0)), ),
child: Text( )
S.of(context).estimated, ],
style: TextStyle( ),
fontSize: 14, Padding(
color: Palette.wildDarkBlue, padding: EdgeInsets.only(top: 10),
fontWeight: FontWeight.bold), child: Stack(
), children: <Widget>[
BaseTextFormField(
controller: amountController,
enabled: _isAmountEditable,
textAlign: TextAlign.left,
keyboardType: TextInputType.numberWithOptions(
signed: false, decimal: true),
inputFormatters: [
BlacklistingTextInputFormatter(
RegExp('[\\-|\\ |\\,]'))
],
hintText: '0.0000',
borderColor: PaletteDark.borderCardColor,
validator: widget.currencyValueValidator
),
Positioned(
bottom: 8,
right: 0,
child: Container(
height: 32,
padding: EdgeInsets.only(left: 10),
color: widget.currencyButtonColor,
child: InkWell(
onTap: () => _presentPicker(context),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Text(
_selectedCurrency.toString(),
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 16,
color: Colors.white)),
Padding(
padding: EdgeInsets.only(left: 5),
child: widget.imageArrow,
)
]),
), ),
), ),
]) )
: Container(), ],
Container( )
),
Padding(
padding: EdgeInsets.only(top: 5),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
_min != null
? Text(
S.of(context).min_value(
_min, _selectedCurrency.toString()),
style: TextStyle(
fontSize: 10,
height: 1.2,
color: PaletteDark.walletCardText),
)
: Offstage(),
_min != null ? SizedBox(width: 10) : Offstage(),
_max != null
? Text(
S.of(context).max_value(
_max, _selectedCurrency.toString()),
style: TextStyle(
fontSize: 10,
height: 1.2,
color: PaletteDark.walletCardText))
: Offstage(),
]),
),
Padding(
padding: EdgeInsets.only(top: 10),
child: AddressTextField(
controller: addressController,
isActive: _isAddressEditable,
options: _isAddressEditable
? _walletName != null
? []
: [
AddressTextFieldOption.qrCode,
AddressTextFieldOption.addressBook,
]
: [],
isBorderExist: false,
validator: widget.addressTextFieldValidator,
),
)
/*Container(
child: Row( child: Row(
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[ children: <Widget>[
@ -254,7 +345,7 @@ class ExchangeCardState extends State<ExchangeCard> {
] ]
: [], : [],
validator: widget.addressTextFieldValidator, validator: widget.addressTextFieldValidator,
) )*/
]), ]),
); );
} }

View file

@ -19,6 +19,7 @@ class AddressTextField extends StatelessWidget {
], ],
this.onURIScanned, this.onURIScanned,
this.focusNode, this.focusNode,
this.isBorderExist = true,
this.validator}); this.validator});
static const prefixIconWidth = 34.0; static const prefixIconWidth = 34.0;
@ -31,6 +32,7 @@ class AddressTextField extends StatelessWidget {
final Function(Uri) onURIScanned; final Function(Uri) onURIScanned;
final List<AddressTextFieldOption> options; final List<AddressTextFieldOption> options;
final FormFieldValidator<String> validator; final FormFieldValidator<String> validator;
final bool isBorderExist;
FocusNode focusNode; FocusNode focusNode;
@override @override
@ -114,13 +116,17 @@ class AddressTextField extends StatelessWidget {
color: PaletteDark.walletCardText color: PaletteDark.walletCardText
), ),
hintText: placeholder ?? S.current.widgets_address, hintText: placeholder ?? S.current.widgets_address,
focusedBorder: UnderlineInputBorder( focusedBorder: isBorderExist
? UnderlineInputBorder(
borderSide: BorderSide( borderSide: BorderSide(
color: PaletteDark.walletCardSubAddressField, color: PaletteDark.walletCardSubAddressField,
width: 1.0)), width: 1.0))
enabledBorder: UnderlineInputBorder( : InputBorder.none,
enabledBorder: isBorderExist
? UnderlineInputBorder(
borderSide: borderSide:
BorderSide(color: PaletteDark.walletCardSubAddressField, width: 1.0)), BorderSide(color: PaletteDark.walletCardSubAddressField, width: 1.0))
: InputBorder.none,
), ),
validator: validator, validator: validator,
); );

View file

@ -15,6 +15,9 @@ class BaseTextFormField extends StatelessWidget {
this.textColor = Colors.white, this.textColor = Colors.white,
this.hintColor = PaletteDark.walletCardText, this.hintColor = PaletteDark.walletCardText,
this.borderColor = PaletteDark.menuList, this.borderColor = PaletteDark.menuList,
this.prefix,
this.suffix,
this.enabled = true,
this.validator this.validator
}); });
@ -29,6 +32,9 @@ class BaseTextFormField extends StatelessWidget {
final Color textColor; final Color textColor;
final Color hintColor; final Color hintColor;
final Color borderColor; final Color borderColor;
final Widget prefix;
final Widget suffix;
final bool enabled;
final FormFieldValidator<String> validator; final FormFieldValidator<String> validator;
@override @override
@ -41,11 +47,14 @@ class BaseTextFormField extends StatelessWidget {
autovalidate: autovalidate, autovalidate: autovalidate,
maxLines: maxLines, maxLines: maxLines,
inputFormatters: inputFormatters, inputFormatters: inputFormatters,
enabled: enabled,
style: TextStyle( style: TextStyle(
fontSize: 16.0, fontSize: 16.0,
color: textColor color: textColor
), ),
decoration: InputDecoration( decoration: InputDecoration(
prefix: prefix,
suffix: suffix,
hintStyle: TextStyle( hintStyle: TextStyle(
color: hintColor, color: hintColor,
fontSize: 16 fontSize: 16

View file

@ -1,24 +1,40 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
class TopPanel extends StatelessWidget { class TopPanel extends StatefulWidget {
TopPanel({@required this.color, @required this.widget}); TopPanel({
@required this.color,
@required this.widget,
this.edgeInsets = const EdgeInsets.all(24)
});
final Color color; final Color color;
final Widget widget; final Widget widget;
final EdgeInsets edgeInsets;
@override
TopPanelState createState() => TopPanelState(color, widget, edgeInsets);
}
class TopPanelState extends State<TopPanel> {
TopPanelState(this._color, this._widget, this._edgeInsets);
final Color _color;
final Widget _widget;
final EdgeInsets _edgeInsets;
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Container(
width: double.infinity, width: double.infinity,
padding: EdgeInsets.all(24), padding: _edgeInsets,
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.only( borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(24), bottomLeft: Radius.circular(24),
bottomRight: Radius.circular(24) bottomRight: Radius.circular(24)
), ),
color: color color: _color
), ),
child: widget, child: _widget,
); );
} }
} }