diff --git a/lib/src/screens/exchange/exchange_page.dart b/lib/src/screens/exchange/exchange_page.dart index 7993247c1..92e4bbd7b 100644 --- a/lib/src/screens/exchange/exchange_page.dart +++ b/lib/src/screens/exchange/exchange_page.dart @@ -1,4 +1,6 @@ import 'dart:ui'; +import 'package:dotted_border/dotted_border.dart'; +import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:flutter_mobx/flutter_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/picker.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 { @override String get title => S.current.exchange; @override - bool get isModalBackButton => true; + Color get backgroundColor => PaletteDark.walletCardSubAddressField; - final Image arrowBottomPurple = - Image.asset('assets/images/arrow_bottom_purple_icon.png', height: 8); + final Image arrowBottom = + Image.asset('assets/images/arrow_bottom_purple_icon.png', color: Colors.white, height: 6); @override Widget middle(BuildContext context) { @@ -38,31 +41,34 @@ class ExchangePage extends BasePage { onPressed: () => _presentProviderPicker(context), highlightColor: Colors.transparent, splashColor: Colors.transparent, - child: Column( - crossAxisAlignment: CrossAxisAlignment.center, - mainAxisAlignment: MainAxisAlignment.center, + child: Row( + mainAxisSize: MainAxisSize.min, + crossAxisAlignment: CrossAxisAlignment.start, children: [ - Row( - mainAxisAlignment: MainAxisAlignment.center, - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - 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}', + Column( + crossAxisAlignment: CrossAxisAlignment.center, + mainAxisSize: MainAxisSize.min, + children: [ + Text(S.of(context).exchange, style: TextStyle( - fontSize: 10.0, + fontSize: 16.0, fontWeight: FontWeight.w400, - color: - Theme.of(context).primaryTextTheme.headline.color))) + color: Colors.white)), + 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( minWidth: double.minPositive, + highlightColor: Colors.transparent, + splashColor: Colors.transparent, child: FlatButton( padding: EdgeInsets.all(0), child: Text( S.of(context).clear, style: TextStyle( - color: Theme.of(context).accentTextTheme.caption.color, + color: PaletteDark.walletCardText, fontWeight: FontWeight.w500, - fontSize: 16), + fontSize: 14), ), onPressed: () => exchangeStore.reset()), ); @@ -117,10 +125,12 @@ class ExchangeFormState extends State { final Image arrowBottomPurple = Image.asset( 'assets/images/arrow_bottom_purple_icon.png', + color: Colors.white, height: 8, ); final Image arrowBottomCakeGreen = Image.asset( 'assets/images/arrow_bottom_cake_green.png', + color: Colors.white, height: 8, ); @@ -141,156 +151,309 @@ class ExchangeFormState extends State { WidgetsBinding.instance.addPostFrameCallback( (_) => _setReactions(context, exchangeStore, walletStore)); - return Form( - key: _formKey, - child: ScrollableWithBottomSection( - contentPadding: EdgeInsets.only(left: 20, right: 20), - content: SingleChildScrollView( - child: Column( - mainAxisAlignment: MainAxisAlignment.spaceAround, + return Container( + color: PaletteDark.historyPanel, + child: Form( + key: _formKey, + child: ScrollableWithBottomSection( + contentPadding: EdgeInsets.only(bottom: 24), + content: Column( children: [ + TopPanel( + color: PaletteDark.menuList, + edgeInsets: EdgeInsets.only(bottom: 24), + widget: Column( + children: [ + 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: EdgeInsets.only(top: 10, bottom: 20), - child: Text( - S.of(context).you_will_send, - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 18, - height: 1.1, - color: Theme.of(context).primaryTextTheme.title.color), + padding: EdgeInsets.only( + top: 32, + left: 24, + bottom: 24 + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + Text( + S.of(context).send_templates, + style: TextStyle( + fontSize: 18, + fontWeight: FontWeight.w600, + color: PaletteDark.walletCardText + ), + ) + ], ), ), - ExchangeCard( - key: depositKey, - 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, - currencyValueValidator: (value) { - exchangeStore.validateCryptoCurrency(value); - return exchangeStore.errorMessage; - }, - addressTextFieldValidator: (value) { - exchangeStore.validateAddress(value, - cryptoCurrency: exchangeStore.depositCurrency); - return exchangeStore.errorMessage; - }, - ), - SizedBox(height: 35), - Padding( - padding: EdgeInsets.only(bottom: 20), + Container( + height: 40, + width: double.infinity, + padding: EdgeInsets.only(left: 24), + child: Observer( + builder: (_) { + + return ListView.builder( + scrollDirection: Axis.horizontal, + itemCount: 1, + itemBuilder: (context, index) { + + if (index == 0) { + return GestureDetector( + onTap: () {}, + child: Container( + padding: EdgeInsets.only(right: 10), + child: DottedBorder( + borderType: BorderType.RRect, + dashPattern: [8, 4], + color: PaletteDark.menuList, + strokeWidth: 2, + radius: Radius.circular(20), + child: Container( + height: 40, + width: 75, + padding: EdgeInsets.only(left: 10, right: 10), + 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: [ + Padding( + padding: EdgeInsets.only(top: 10, bottom: 20), child: Text( - S.of(context).you_will_get, + S.of(context).you_will_send, style: TextStyle( fontWeight: FontWeight.bold, fontSize: 18, height: 1.1, - color: - Theme.of(context).primaryTextTheme.title.color), - )), - Observer( - builder: (_) => ExchangeCard( - key: receiveKey, - 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, - currencyValueValidator: (value) { - exchangeStore.validateCryptoCurrency(value); - return exchangeStore.errorMessage; - }, - addressTextFieldValidator: (value) { - exchangeStore.validateAddress(value, - cryptoCurrency: exchangeStore.receiveCurrency); - return exchangeStore.errorMessage; - }, - )), - ], - ), - ), - bottomSectionPadding: EdgeInsets.only(top: 35, left: 20, right: 20), - bottomSection: Column(children: [ - 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: Palette.blueGrey, fontSize: 12), + color: Theme.of(context).primaryTextTheme.title.color), + ), + ), + ExchangeCard( + key: depositKey, + 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, + currencyValueValidator: (value) { + exchangeStore.validateCryptoCurrency(value); + return exchangeStore.errorMessage; + }, + addressTextFieldValidator: (value) { + exchangeStore.validateAddress(value, + cryptoCurrency: exchangeStore.depositCurrency); + return exchangeStore.errorMessage; + }, + ), + SizedBox(height: 35), + Padding( + padding: EdgeInsets.only(bottom: 20), + child: Text( + S.of(context).you_will_get, + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 18, + height: 1.1, + color: + Theme.of(context).primaryTextTheme.title.color), + )), + Observer( + builder: (_) => ExchangeCard( + key: receiveKey, + 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, + 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: [ + 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: [ + 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: [ - Image.asset(imageSrc), - SizedBox(width: 10), - Text( - S.of(context).powered_by(title), - style: TextStyle(fontSize: 14, color: Palette.powered), - ) - ], - ), - ); - }) - ]), - )); + })*/ + ]), + )), + ); } void _setReactions( diff --git a/lib/src/screens/exchange/widgets/exchange_card.dart b/lib/src/screens/exchange/widgets/exchange_card.dart index 833b18895..06430f074 100644 --- a/lib/src/screens/exchange/widgets/exchange_card.dart +++ b/lib/src/screens/exchange/widgets/exchange_card.dart @@ -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/widgets/picker.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 { ExchangeCard( {Key key, + this.title = '', this.initialCurrency, this.initialAddress, this.initialWalletName, @@ -18,12 +20,14 @@ class ExchangeCard extends StatefulWidget { this.currencies, this.onCurrencySelected, this.imageArrow, + this.currencyButtonColor = Colors.transparent, this.currencyValueValidator, this.addressTextFieldValidator}) : super(key: key); final List currencies; final Function(CryptoCurrency) onCurrencySelected; + final String title; final CryptoCurrency initialCurrency; final String initialWalletName; final String initialAddress; @@ -31,6 +35,7 @@ class ExchangeCard extends StatefulWidget { final bool initialIsAddressEditable; final bool isAmountEstimated; final Image imageArrow; + final Color currencyButtonColor; final FormFieldValidator currencyValueValidator; final FormFieldValidator addressTextFieldValidator; @@ -42,6 +47,7 @@ class ExchangeCardState extends State { final addressController = TextEditingController(); final amountController = TextEditingController(); + String _title; String _min; String _max; CryptoCurrency _selectedCurrency; @@ -52,6 +58,7 @@ class ExchangeCardState extends State { @override void initState() { + _title = widget.title; _isAmountEditable = widget.initialIsAmountEditable; _isAddressEditable = widget.initialIsAddressEditable; _walletName = widget.initialWalletName; @@ -103,33 +110,117 @@ class ExchangeCardState extends State { @override Widget build(BuildContext context) { return Container( - padding: EdgeInsets.fromLTRB(22, 15, 22, 30), width: double.infinity, - decoration: BoxDecoration( - color: Theme.of(context).cardColor, - borderRadius: BorderRadius.all(Radius.circular(12))), - child: Column(children: [ - _isAmountEstimated != null && _isAmountEstimated - ? Row(mainAxisAlignment: MainAxisAlignment.end, children: [ - SizedBox( - height: 30, - child: Container( - padding: EdgeInsets.fromLTRB(10, 5, 10, 5), - decoration: BoxDecoration( - color: Palette.lightGrey, - borderRadius: BorderRadius.circular(10.0)), - child: Text( - S.of(context).estimated, - style: TextStyle( - fontSize: 14, - color: Palette.wildDarkBlue, - fontWeight: FontWeight.bold), - ), + color: Colors.transparent, + child: Column( + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.start, + children: [ + Text( + _title, + style: TextStyle( + fontSize: 18, + fontWeight: FontWeight.w600, + color: PaletteDark.walletCardText + ), + ) + ], + ), + Padding( + padding: EdgeInsets.only(top: 10), + child: Stack( + children: [ + 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: [ + 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: [ + _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( crossAxisAlignment: CrossAxisAlignment.center, children: [ @@ -254,7 +345,7 @@ class ExchangeCardState extends State { ] : [], validator: widget.addressTextFieldValidator, - ) + )*/ ]), ); } diff --git a/lib/src/widgets/address_text_field.dart b/lib/src/widgets/address_text_field.dart index d8525a4e9..6051cb826 100644 --- a/lib/src/widgets/address_text_field.dart +++ b/lib/src/widgets/address_text_field.dart @@ -19,6 +19,7 @@ class AddressTextField extends StatelessWidget { ], this.onURIScanned, this.focusNode, + this.isBorderExist = true, this.validator}); static const prefixIconWidth = 34.0; @@ -31,6 +32,7 @@ class AddressTextField extends StatelessWidget { final Function(Uri) onURIScanned; final List options; final FormFieldValidator validator; + final bool isBorderExist; FocusNode focusNode; @override @@ -114,13 +116,17 @@ class AddressTextField extends StatelessWidget { color: PaletteDark.walletCardText ), hintText: placeholder ?? S.current.widgets_address, - focusedBorder: UnderlineInputBorder( + focusedBorder: isBorderExist + ? UnderlineInputBorder( borderSide: BorderSide( color: PaletteDark.walletCardSubAddressField, - width: 1.0)), - enabledBorder: UnderlineInputBorder( + width: 1.0)) + : InputBorder.none, + enabledBorder: isBorderExist + ? UnderlineInputBorder( borderSide: - BorderSide(color: PaletteDark.walletCardSubAddressField, width: 1.0)), + BorderSide(color: PaletteDark.walletCardSubAddressField, width: 1.0)) + : InputBorder.none, ), validator: validator, ); diff --git a/lib/src/widgets/base_text_form_field.dart b/lib/src/widgets/base_text_form_field.dart index 5b76475b6..e05c3a277 100644 --- a/lib/src/widgets/base_text_form_field.dart +++ b/lib/src/widgets/base_text_form_field.dart @@ -15,6 +15,9 @@ class BaseTextFormField extends StatelessWidget { this.textColor = Colors.white, this.hintColor = PaletteDark.walletCardText, this.borderColor = PaletteDark.menuList, + this.prefix, + this.suffix, + this.enabled = true, this.validator }); @@ -29,6 +32,9 @@ class BaseTextFormField extends StatelessWidget { final Color textColor; final Color hintColor; final Color borderColor; + final Widget prefix; + final Widget suffix; + final bool enabled; final FormFieldValidator validator; @override @@ -41,11 +47,14 @@ class BaseTextFormField extends StatelessWidget { autovalidate: autovalidate, maxLines: maxLines, inputFormatters: inputFormatters, + enabled: enabled, style: TextStyle( fontSize: 16.0, color: textColor ), decoration: InputDecoration( + prefix: prefix, + suffix: suffix, hintStyle: TextStyle( color: hintColor, fontSize: 16 diff --git a/lib/src/widgets/top_panel.dart b/lib/src/widgets/top_panel.dart index dc8b5c1d5..5e2cc2c91 100644 --- a/lib/src/widgets/top_panel.dart +++ b/lib/src/widgets/top_panel.dart @@ -1,24 +1,40 @@ import 'package:flutter/material.dart'; -class TopPanel extends StatelessWidget { - TopPanel({@required this.color, @required this.widget}); +class TopPanel extends StatefulWidget { + TopPanel({ + @required this.color, + @required this.widget, + this.edgeInsets = const EdgeInsets.all(24) + }); final Color color; final Widget widget; + final EdgeInsets edgeInsets; + + @override + TopPanelState createState() => TopPanelState(color, widget, edgeInsets); +} + +class TopPanelState extends State { + TopPanelState(this._color, this._widget, this._edgeInsets); + + final Color _color; + final Widget _widget; + final EdgeInsets _edgeInsets; @override Widget build(BuildContext context) { return Container( width: double.infinity, - padding: EdgeInsets.all(24), + padding: _edgeInsets, decoration: BoxDecoration( borderRadius: BorderRadius.only( bottomLeft: Radius.circular(24), bottomRight: Radius.circular(24) ), - color: color + color: _color ), - child: widget, + child: _widget, ); } } \ No newline at end of file