CWA-212 | created currency picker and provider picker; moved template tile to widgets directory; created exchange template page

This commit is contained in:
Oleksandr Sobol 2020-05-13 21:26:15 +03:00
parent 16dfb3a2d5
commit 714661e91b
8 changed files with 360 additions and 20 deletions

View file

@ -19,9 +19,9 @@ import 'package:cake_wallet/src/stores/exchange/exchange_store.dart';
import 'package:cake_wallet/src/screens/base_page.dart';
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';
import 'package:cake_wallet/src/screens/exchange/widgets/provider_picker.dart';
class ExchangePage extends BasePage {
@override
@ -102,7 +102,7 @@ class ExchangePage extends BasePage {
final selectedItem = items.indexOf(exchangeStore.provider);
showDialog<void>(
builder: (_) => Picker(
builder: (_) => ProviderPicker(
items: items,
selectedAtIndex: selectedItem,
title: S.of(context).change_exchange_provider,
@ -184,6 +184,7 @@ class ExchangeFormState extends State<ExchangeForm> {
exchangeStore.changeDepositCurrency(currency: currency),
imageArrow: arrowBottomPurple,
currencyButtonColor: PaletteDark.walletCardSubAddressField,
addressButtonsColor: PaletteDark.menuList,
currencyValueValidator: (value) {
exchangeStore.validateCryptoCurrency(value);
return exchangeStore.errorMessage;

View file

@ -0,0 +1,104 @@
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';
import 'package:provider/provider.dart';
import 'package:cake_wallet/palette.dart';
import 'package:cake_wallet/routes.dart';
import 'package:cake_wallet/generated/i18n.dart';
import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
import 'package:cake_wallet/src/domain/exchange/exchange_provider.dart';
import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart';
import 'package:cake_wallet/src/domain/exchange/xmrto/xmrto_exchange_provider.dart';
import 'package:cake_wallet/src/stores/exchange/exchange_trade_state.dart';
import 'package:cake_wallet/src/stores/exchange/limits_state.dart';
import 'package:cake_wallet/src/stores/wallet/wallet_store.dart';
import 'package:cake_wallet/src/stores/exchange/exchange_store.dart';
import 'package:cake_wallet/src/screens/base_page.dart';
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/scollable_with_bottom_section.dart';
import 'package:cake_wallet/src/widgets/top_panel.dart';
import 'package:cake_wallet/src/screens/exchange/widgets/provider_picker.dart';
class ExchangeTemplatePage extends BasePage {
@override
String get title => 'New template';
@override
Color get backgroundColor => PaletteDark.walletCardSubAddressField;
final Image arrowBottom =
Image.asset('assets/images/arrow_bottom_purple_icon.png', color: Colors.white, height: 8);
@override
Widget trailing(BuildContext context) {
final exchangeStore = Provider.of<ExchangeStore>(context);
return FlatButton(
onPressed: () => _presentProviderPicker(context),
highlightColor: Colors.transparent,
splashColor: Colors.transparent,
child: Row(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Text(S.of(context).exchange,
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.w400,
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,
)
],
)
);
}
void _presentProviderPicker(BuildContext context) {
final exchangeStore = Provider.of<ExchangeStore>(context);
final items = exchangeStore.providersForCurrentPair();
final selectedItem = items.indexOf(exchangeStore.provider);
showDialog<void>(
builder: (_) => ProviderPicker(
items: items,
selectedAtIndex: selectedItem,
title: S.of(context).change_exchange_provider,
onItemSelected: (ExchangeProvider provider) =>
exchangeStore.changeProvider(provider: provider)),
context: context);
}
@override
Widget body(BuildContext context) => ExchangeTemplateForm();
}
class ExchangeTemplateForm extends StatefulWidget{
@override
ExchangeTemplateFormState createState() => ExchangeTemplateFormState();
}
class ExchangeTemplateFormState extends State<ExchangeTemplateForm> {
@override
Widget build(BuildContext context) {
return Container();
}
}

View file

@ -0,0 +1,119 @@
import 'dart:ui';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/palette.dart';
import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
class CurrencyPicker extends StatelessWidget {
CurrencyPicker({
@required this.selectedAtIndex,
@required this.items,
@required this.title,
@required this.onItemSelected,
});
final int selectedAtIndex;
final List<CryptoCurrency> items;
final String title;
final Function(CryptoCurrency) onItemSelected;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () => Navigator.of(context).pop(),
child: Container(
color: Colors.transparent,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
child: Container(
decoration: BoxDecoration(color: PaletteDark.historyPanel.withOpacity(0.75)),
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
padding: EdgeInsets.only(left: 24, right: 24),
child: Text(
title,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
decoration: TextDecoration.none,
color: Colors.white
),
),
),
Padding(
padding: EdgeInsets.only(top: 24),
child: GestureDetector(
onTap: () => null,
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(14)),
child: Container(
height: 400,
width: 300,
color: PaletteDark.walletCardSubAddressField,
child: GridView.count(
shrinkWrap: true,
crossAxisCount: 3,
childAspectRatio: 1.25,
physics: const NeverScrollableScrollPhysics(),
crossAxisSpacing: 1,
mainAxisSpacing: 1,
children: List.generate(15, (index) {
if (index == 14) {
return Container(
color: PaletteDark.menuList,
);
}
final item = items[index];
final isItemSelected = index == selectedAtIndex;
final color = isItemSelected
? PaletteDark.historyPanel
: PaletteDark.menuList;
final textColor = isItemSelected
? Colors.blue
: Colors.white;
return GestureDetector(
onTap: () {
if (onItemSelected == null) {
return;
}
Navigator.of(context).pop();
onItemSelected(item);
},
child: Container(
color: color,
child: Center(
child: Text(
item.toString(),
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
decoration: TextDecoration.none,
color: textColor
),
),
),
),
);
})
),
),
),
),
)
],
),
)
),
),
),
);
}
}

View file

@ -3,9 +3,9 @@ import 'package:flutter/material.dart';
import 'package:cake_wallet/palette.dart';
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';
import 'package:cake_wallet/src/screens/exchange/widgets/currency_picker.dart';
class ExchangeCard extends StatefulWidget {
ExchangeCard(
@ -21,6 +21,7 @@ class ExchangeCard extends StatefulWidget {
this.onCurrencySelected,
this.imageArrow,
this.currencyButtonColor = Colors.transparent,
this.addressButtonsColor = PaletteDark.walletCardSubAddressField,
this.currencyValueValidator,
this.addressTextFieldValidator})
: super(key: key);
@ -36,6 +37,7 @@ class ExchangeCard extends StatefulWidget {
final bool isAmountEstimated;
final Image imageArrow;
final Color currencyButtonColor;
final Color addressButtonsColor;
final FormFieldValidator<String> currencyValueValidator;
final FormFieldValidator<String> addressTextFieldValidator;
@ -216,6 +218,7 @@ class ExchangeCardState extends State<ExchangeCard> {
]
: [],
isBorderExist: false,
buttonColor: widget.addressButtonsColor,
validator: widget.addressTextFieldValidator,
),
)
@ -352,14 +355,14 @@ class ExchangeCardState extends State<ExchangeCard> {
void _presentPicker(BuildContext context) {
showDialog<void>(
builder: (_) => Picker(
items: widget.currencies,
builder: (_) => CurrencyPicker(
selectedAtIndex: widget.currencies.indexOf(_selectedCurrency),
items: widget.currencies,
title: S.of(context).change_currency,
onItemSelected: (CryptoCurrency item) =>
widget.onCurrencySelected != null
? widget.onCurrencySelected(item)
: null),
widget.onCurrencySelected != null
? widget.onCurrencySelected(item)
: null),
context: context);
}
}

View file

@ -0,0 +1,111 @@
import 'dart:ui';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:cake_wallet/palette.dart';
import 'package:cake_wallet/src/domain/exchange/exchange_provider.dart';
class ProviderPicker extends StatelessWidget {
ProviderPicker({
@required this.selectedAtIndex,
@required this.items,
@required this.title,
@required this.onItemSelected,
});
final int selectedAtIndex;
final List<ExchangeProvider> items;
final String title;
final Function(ExchangeProvider) onItemSelected;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () => Navigator.of(context).pop(),
child: Container(
color: Colors.transparent,
child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
child: Container(
decoration: BoxDecoration(color: PaletteDark.historyPanel.withOpacity(0.75)),
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
padding: EdgeInsets.only(left: 24, right: 24),
child: Text(
title,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
decoration: TextDecoration.none,
color: Colors.white
),
),
),
Padding(
padding: EdgeInsets.only(left: 24, right: 24, top: 24),
child: GestureDetector(
onTap: () => null,
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(14)),
child: Container(
height: 233,
color: PaletteDark.menuList,
child: ListView.separated(
separatorBuilder: (context, index) => Divider(
color: PaletteDark.mainBackgroundColor,
height: 1,
),
itemCount: items == null ? 0 : items.length,
itemBuilder: (context, index) {
final item = items[index];
final isItemSelected = index == selectedAtIndex;
final color = isItemSelected
? PaletteDark.menuHeader
: Colors.transparent;
final textColor = isItemSelected
? Colors.blue
: Colors.white;
return GestureDetector(
onTap: () {
if (onItemSelected == null) {
return;
}
Navigator.of(context).pop();
onItemSelected(item);
},
child: Container(
height: 77,
padding: EdgeInsets.only(left: 24, right: 24),
alignment: Alignment.center,
color: color,
child: Text(
item.toString(),
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
color: textColor,
decoration: TextDecoration.none,
),
),
),
);
},
)
),
),
),
)
],
),
)
),
),
),
);
}
}

View file

@ -27,7 +27,7 @@ import 'package:cake_wallet/src/widgets/alert_with_one_action.dart';
import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart';
import 'package:cake_wallet/src/screens/send/widgets/confirm_sending_alert.dart';
import 'package:cake_wallet/src/screens/send/widgets/sending_alert.dart';
import 'package:cake_wallet/src/screens/send/widgets/template_tile.dart';
import 'package:cake_wallet/src/widgets/template_tile.dart';
import 'package:cake_wallet/src/stores/send_template/send_template_store.dart';
class SendPage extends BasePage {
@ -394,9 +394,9 @@ class SendFormState extends State<SendForm> {
final template = sendTemplateStore.templates[index];
return TemplateTile(
name: template.name,
to: template.name,
amount: template.amount,
cryptoCurrency: template.cryptoCurrency,
from: template.cryptoCurrency,
onTap: () {
_addressController.text = template.address;
_cryptoAmountController.text = template.amount;

View file

@ -20,6 +20,7 @@ class AddressTextField extends StatelessWidget {
this.onURIScanned,
this.focusNode,
this.isBorderExist = true,
this.buttonColor = PaletteDark.walletCardSubAddressField,
this.validator});
static const prefixIconWidth = 34.0;
@ -33,6 +34,7 @@ class AddressTextField extends StatelessWidget {
final List<AddressTextFieldOption> options;
final FormFieldValidator<String> validator;
final bool isBorderExist;
final Color buttonColor;
FocusNode focusNode;
@override
@ -64,7 +66,7 @@ class AddressTextField extends StatelessWidget {
child: Container(
padding: EdgeInsets.all(8),
decoration: BoxDecoration(
color: PaletteDark.walletCardSubAddressField,
color: buttonColor,
borderRadius:
BorderRadius.all(Radius.circular(6))),
child: Image.asset('assets/images/qr_code_icon.png')),
@ -82,7 +84,7 @@ class AddressTextField extends StatelessWidget {
child: Container(
padding: EdgeInsets.all(8),
decoration: BoxDecoration(
color: PaletteDark.walletCardSubAddressField,
color: buttonColor,
borderRadius:
BorderRadius.all(Radius.circular(6))),
child: Image.asset(
@ -101,7 +103,7 @@ class AddressTextField extends StatelessWidget {
child: Container(
padding: EdgeInsets.all(8),
decoration: BoxDecoration(
color: PaletteDark.walletCardSubAddressField,
color: buttonColor,
borderRadius:
BorderRadius.all(Radius.circular(6))),
child: Image.asset(

View file

@ -3,15 +3,15 @@ import 'package:cake_wallet/palette.dart';
class TemplateTile extends StatelessWidget {
TemplateTile({
@required this.name,
@required this.to,
@required this.amount,
@required this.cryptoCurrency,
@required this.from,
@required this.onTap
});
final String name;
final String to;
final String amount;
final String cryptoCurrency;
final String from;
final VoidCallback onTap;
final toIcon = Image.asset('assets/images/to_icon.png');
@ -44,7 +44,7 @@ class TemplateTile extends StatelessWidget {
Padding(
padding: EdgeInsets.only(left: 5),
child: Text(
cryptoCurrency,
from,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,
@ -59,7 +59,7 @@ class TemplateTile extends StatelessWidget {
Padding(
padding: EdgeInsets.only(left: 5),
child: Text(
name,
to,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w600,