CWA-212 | created currency picker and provider picker; moved template tile to widgets directory; created exchange template page
Oleksandr Sobol committed
May 13, 2020 at 21:26 UTC
714661e91b545cc14c5a97f30565746add196751
8 files changed
+360
-20
lib/src/screens/exchange/exchange_page.dart
+3
-2
@@ -19,9 +19,9 @@ import 'package:cake_wallet/src/stores/exchange/exchange_store.dart';
19
import 'package:cake_wallet/src/screens/base_page.dart';
20
import 'package:cake_wallet/src/screens/exchange/widgets/exchange_card.dart';
21
import 'package:cake_wallet/src/widgets/primary_button.dart';
22
-import 'package:cake_wallet/src/widgets/picker.dart';
22
import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
23
import 'package:cake_wallet/src/widgets/top_panel.dart';
24
+import 'package:cake_wallet/src/screens/exchange/widgets/provider_picker.dart';
25
26
class ExchangePage extends BasePage {
27
@override
@@ -102,7 +102,7 @@ class ExchangePage extends BasePage {
102
final selectedItem = items.indexOf(exchangeStore.provider);
103
104
showDialog<void>(
105
- builder: (_) => Picker(
105
+ builder: (_) => ProviderPicker(
106
items: items,
107
selectedAtIndex: selectedItem,
108
title: S.of(context).change_exchange_provider,
@@ -184,6 +184,7 @@ class ExchangeFormState extends State<ExchangeForm> {
184
exchangeStore.changeDepositCurrency(currency: currency),
185
imageArrow: arrowBottomPurple,
186
currencyButtonColor: PaletteDark.walletCardSubAddressField,
187
+ addressButtonsColor: PaletteDark.menuList,
188
currencyValueValidator: (value) {
189
exchangeStore.validateCryptoCurrency(value);
190
return exchangeStore.errorMessage;
lib/src/screens/exchange/exchange_template_page.dart
new
+104
@@ -0,0 +1,104 @@
1
+import 'dart:ui';
2
+import 'package:dotted_border/dotted_border.dart';
3
+import 'package:flutter/cupertino.dart';
4
+import 'package:flutter/material.dart';
5
+import 'package:flutter_mobx/flutter_mobx.dart';
6
+import 'package:mobx/mobx.dart';
7
+import 'package:provider/provider.dart';
8
+import 'package:cake_wallet/palette.dart';
9
+import 'package:cake_wallet/routes.dart';
10
+import 'package:cake_wallet/generated/i18n.dart';
11
+import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
12
+import 'package:cake_wallet/src/domain/exchange/exchange_provider.dart';
13
+import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart';
14
+import 'package:cake_wallet/src/domain/exchange/xmrto/xmrto_exchange_provider.dart';
15
+import 'package:cake_wallet/src/stores/exchange/exchange_trade_state.dart';
16
+import 'package:cake_wallet/src/stores/exchange/limits_state.dart';
17
+import 'package:cake_wallet/src/stores/wallet/wallet_store.dart';
18
+import 'package:cake_wallet/src/stores/exchange/exchange_store.dart';
19
+import 'package:cake_wallet/src/screens/base_page.dart';
20
+import 'package:cake_wallet/src/screens/exchange/widgets/exchange_card.dart';
21
+import 'package:cake_wallet/src/widgets/primary_button.dart';
22
+import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
23
+import 'package:cake_wallet/src/widgets/top_panel.dart';
24
+import 'package:cake_wallet/src/screens/exchange/widgets/provider_picker.dart';
25
+
26
+class ExchangeTemplatePage extends BasePage {
27
+ @override
28
+ String get title => 'New template';
29
+
30
+ @override
31
+ Color get backgroundColor => PaletteDark.walletCardSubAddressField;
32
+
33
+ final Image arrowBottom =
34
+ Image.asset('assets/images/arrow_bottom_purple_icon.png', color: Colors.white, height: 8);
35
+
36
+ @override
37
+ Widget trailing(BuildContext context) {
38
+ final exchangeStore = Provider.of<ExchangeStore>(context);
39
+
40
+ return FlatButton(
41
+ onPressed: () => _presentProviderPicker(context),
42
+ highlightColor: Colors.transparent,
43
+ splashColor: Colors.transparent,
44
+ child: Row(
45
+ mainAxisSize: MainAxisSize.min,
46
+ crossAxisAlignment: CrossAxisAlignment.start,
47
+ children: <Widget>[
48
+ Column(
49
+ crossAxisAlignment: CrossAxisAlignment.center,
50
+ mainAxisSize: MainAxisSize.min,
51
+ children: <Widget>[
52
+ Text(S.of(context).exchange,
53
+ style: TextStyle(
54
+ fontSize: 16.0,
55
+ fontWeight: FontWeight.w400,
56
+ color: Colors.white)),
57
+ Observer(
58
+ builder: (_) => Text('${exchangeStore.provider.title}',
59
+ style: TextStyle(
60
+ fontSize: 10.0,
61
+ fontWeight: FontWeight.w400,
62
+ color:PaletteDark.walletCardText)))
63
+ ],
64
+ ),
65
+ SizedBox(width: 5),
66
+ Padding(
67
+ padding: EdgeInsets.only(top: 8),
68
+ child: arrowBottom,
69
+ )
70
+ ],
71
+ )
72
+ );
73
+ }
74
+
75
+ void _presentProviderPicker(BuildContext context) {
76
+ final exchangeStore = Provider.of<ExchangeStore>(context);
77
+ final items = exchangeStore.providersForCurrentPair();
78
+ final selectedItem = items.indexOf(exchangeStore.provider);
79
+
80
+ showDialog<void>(
81
+ builder: (_) => ProviderPicker(
82
+ items: items,
83
+ selectedAtIndex: selectedItem,
84
+ title: S.of(context).change_exchange_provider,
85
+ onItemSelected: (ExchangeProvider provider) =>
86
+ exchangeStore.changeProvider(provider: provider)),
87
+ context: context);
88
+ }
89
+
90
+ @override
91
+ Widget body(BuildContext context) => ExchangeTemplateForm();
92
+}
93
+
94
+class ExchangeTemplateForm extends StatefulWidget{
95
+ @override
96
+ ExchangeTemplateFormState createState() => ExchangeTemplateFormState();
97
+}
98
+
99
+class ExchangeTemplateFormState extends State<ExchangeTemplateForm> {
100
+ @override
101
+ Widget build(BuildContext context) {
102
+ return Container();
103
+ }
104
+}
\ No newline at end of file
lib/src/screens/exchange/widgets/currency_picker.dart
new
+119
@@ -0,0 +1,119 @@
1
+import 'dart:ui';
2
+import 'package:flutter/cupertino.dart';
3
+import 'package:flutter/material.dart';
4
+import 'package:cake_wallet/palette.dart';
5
+import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
6
+
7
+class CurrencyPicker extends StatelessWidget {
8
+ CurrencyPicker({
9
+ @required this.selectedAtIndex,
10
+ @required this.items,
11
+ @required this.title,
12
+ @required this.onItemSelected,
13
+ });
14
+
15
+ final int selectedAtIndex;
16
+ final List<CryptoCurrency> items;
17
+ final String title;
18
+ final Function(CryptoCurrency) onItemSelected;
19
+
20
+ @override
21
+ Widget build(BuildContext context) {
22
+ return GestureDetector(
23
+ onTap: () => Navigator.of(context).pop(),
24
+ child: Container(
25
+ color: Colors.transparent,
26
+ child: BackdropFilter(
27
+ filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
28
+ child: Container(
29
+ decoration: BoxDecoration(color: PaletteDark.historyPanel.withOpacity(0.75)),
30
+ child: Center(
31
+ child: Column(
32
+ mainAxisSize: MainAxisSize.min,
33
+ children: <Widget>[
34
+ Container(
35
+ padding: EdgeInsets.only(left: 24, right: 24),
36
+ child: Text(
37
+ title,
38
+ textAlign: TextAlign.center,
39
+ style: TextStyle(
40
+ fontSize: 18,
41
+ fontWeight: FontWeight.bold,
42
+ decoration: TextDecoration.none,
43
+ color: Colors.white
44
+ ),
45
+ ),
46
+ ),
47
+ Padding(
48
+ padding: EdgeInsets.only(top: 24),
49
+ child: GestureDetector(
50
+ onTap: () => null,
51
+ child: ClipRRect(
52
+ borderRadius: BorderRadius.all(Radius.circular(14)),
53
+ child: Container(
54
+ height: 400,
55
+ width: 300,
56
+ color: PaletteDark.walletCardSubAddressField,
57
+ child: GridView.count(
58
+ shrinkWrap: true,
59
+ crossAxisCount: 3,
60
+ childAspectRatio: 1.25,
61
+ physics: const NeverScrollableScrollPhysics(),
62
+ crossAxisSpacing: 1,
63
+ mainAxisSpacing: 1,
64
+ children: List.generate(15, (index) {
65
+
66
+ if (index == 14) {
67
+ return Container(
68
+ color: PaletteDark.menuList,
69
+ );
70
+ }
71
+
72
+ final item = items[index];
73
+ final isItemSelected = index == selectedAtIndex;
74
+
75
+ final color = isItemSelected
76
+ ? PaletteDark.historyPanel
77
+ : PaletteDark.menuList;
78
+ final textColor = isItemSelected
79
+ ? Colors.blue
80
+ : Colors.white;
81
+
82
+ return GestureDetector(
83
+ onTap: () {
84
+ if (onItemSelected == null) {
85
+ return;
86
+ }
87
+ Navigator.of(context).pop();
88
+ onItemSelected(item);
89
+ },
90
+ child: Container(
91
+ color: color,
92
+ child: Center(
93
+ child: Text(
94
+ item.toString(),
95
+ style: TextStyle(
96
+ fontSize: 18,
97
+ fontWeight: FontWeight.bold,
98
+ decoration: TextDecoration.none,
99
+ color: textColor
100
+ ),
101
+ ),
102
+ ),
103
+ ),
104
+ );
105
+ })
106
+ ),
107
+ ),
108
+ ),
109
+ ),
110
+ )
111
+ ],
112
+ ),
113
+ )
114
+ ),
115
+ ),
116
+ ),
117
+ );
118
+ }
119
+}
\ No newline at end of file
lib/src/screens/exchange/widgets/exchange_card.dart
+9
-6
@@ -3,9 +3,9 @@ import 'package:flutter/material.dart';
3
import 'package:cake_wallet/palette.dart';
4
import 'package:cake_wallet/generated/i18n.dart';
5
import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
6
-import 'package:cake_wallet/src/widgets/picker.dart';
6
import 'package:cake_wallet/src/widgets/address_text_field.dart';
7
import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
8
+import 'package:cake_wallet/src/screens/exchange/widgets/currency_picker.dart';
9
10
class ExchangeCard extends StatefulWidget {
11
ExchangeCard(
@@ -21,6 +21,7 @@ class ExchangeCard extends StatefulWidget {
21
this.onCurrencySelected,
22
this.imageArrow,
23
this.currencyButtonColor = Colors.transparent,
24
+ this.addressButtonsColor = PaletteDark.walletCardSubAddressField,
25
this.currencyValueValidator,
26
this.addressTextFieldValidator})
27
: super(key: key);
@@ -36,6 +37,7 @@ class ExchangeCard extends StatefulWidget {
37
final bool isAmountEstimated;
38
final Image imageArrow;
39
final Color currencyButtonColor;
40
+ final Color addressButtonsColor;
41
final FormFieldValidator<String> currencyValueValidator;
42
final FormFieldValidator<String> addressTextFieldValidator;
43
@@ -216,6 +218,7 @@ class ExchangeCardState extends State<ExchangeCard> {
218
]
219
: [],
220
isBorderExist: false,
221
+ buttonColor: widget.addressButtonsColor,
222
validator: widget.addressTextFieldValidator,
223
),
224
)
@@ -352,14 +355,14 @@ class ExchangeCardState extends State<ExchangeCard> {
355
356
void _presentPicker(BuildContext context) {
357
showDialog<void>(
355
- builder: (_) => Picker(
356
- items: widget.currencies,
358
+ builder: (_) => CurrencyPicker(
359
selectedAtIndex: widget.currencies.indexOf(_selectedCurrency),
360
+ items: widget.currencies,
361
title: S.of(context).change_currency,
362
onItemSelected: (CryptoCurrency item) =>
360
- widget.onCurrencySelected != null
361
- ? widget.onCurrencySelected(item)
362
- : null),
363
+ widget.onCurrencySelected != null
364
+ ? widget.onCurrencySelected(item)
365
+ : null),
366
context: context);
367
}
368
}
lib/src/screens/exchange/widgets/provider_picker.dart
new
+111
@@ -0,0 +1,111 @@
1
+import 'dart:ui';
2
+import 'package:flutter/cupertino.dart';
3
+import 'package:flutter/material.dart';
4
+import 'package:cake_wallet/palette.dart';
5
+import 'package:cake_wallet/src/domain/exchange/exchange_provider.dart';
6
+
7
+class ProviderPicker extends StatelessWidget {
8
+ ProviderPicker({
9
+ @required this.selectedAtIndex,
10
+ @required this.items,
11
+ @required this.title,
12
+ @required this.onItemSelected,
13
+ });
14
+
15
+ final int selectedAtIndex;
16
+ final List<ExchangeProvider> items;
17
+ final String title;
18
+ final Function(ExchangeProvider) onItemSelected;
19
+
20
+ @override
21
+ Widget build(BuildContext context) {
22
+ return GestureDetector(
23
+ onTap: () => Navigator.of(context).pop(),
24
+ child: Container(
25
+ color: Colors.transparent,
26
+ child: BackdropFilter(
27
+ filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
28
+ child: Container(
29
+ decoration: BoxDecoration(color: PaletteDark.historyPanel.withOpacity(0.75)),
30
+ child: Center(
31
+ child: Column(
32
+ mainAxisSize: MainAxisSize.min,
33
+ children: <Widget>[
34
+ Container(
35
+ padding: EdgeInsets.only(left: 24, right: 24),
36
+ child: Text(
37
+ title,
38
+ textAlign: TextAlign.center,
39
+ style: TextStyle(
40
+ fontSize: 18,
41
+ fontWeight: FontWeight.bold,
42
+ decoration: TextDecoration.none,
43
+ color: Colors.white
44
+ ),
45
+ ),
46
+ ),
47
+ Padding(
48
+ padding: EdgeInsets.only(left: 24, right: 24, top: 24),
49
+ child: GestureDetector(
50
+ onTap: () => null,
51
+ child: ClipRRect(
52
+ borderRadius: BorderRadius.all(Radius.circular(14)),
53
+ child: Container(
54
+ height: 233,
55
+ color: PaletteDark.menuList,
56
+ child: ListView.separated(
57
+ separatorBuilder: (context, index) => Divider(
58
+ color: PaletteDark.mainBackgroundColor,
59
+ height: 1,
60
+ ),
61
+ itemCount: items == null ? 0 : items.length,
62
+ itemBuilder: (context, index) {
63
+ final item = items[index];
64
+ final isItemSelected = index == selectedAtIndex;
65
+
66
+ final color = isItemSelected
67
+ ? PaletteDark.menuHeader
68
+ : Colors.transparent;
69
+ final textColor = isItemSelected
70
+ ? Colors.blue
71
+ : Colors.white;
72
+
73
+ return GestureDetector(
74
+ onTap: () {
75
+ if (onItemSelected == null) {
76
+ return;
77
+ }
78
+ Navigator.of(context).pop();
79
+ onItemSelected(item);
80
+ },
81
+ child: Container(
82
+ height: 77,
83
+ padding: EdgeInsets.only(left: 24, right: 24),
84
+ alignment: Alignment.center,
85
+ color: color,
86
+ child: Text(
87
+ item.toString(),
88
+ style: TextStyle(
89
+ fontSize: 18,
90
+ fontWeight: FontWeight.bold,
91
+ color: textColor,
92
+ decoration: TextDecoration.none,
93
+ ),
94
+ ),
95
+ ),
96
+ );
97
+ },
98
+ )
99
+ ),
100
+ ),
101
+ ),
102
+ )
103
+ ],
104
+ ),
105
+ )
106
+ ),
107
+ ),
108
+ ),
109
+ );
110
+ }
111
+}
\ No newline at end of file
lib/src/screens/send/send_page.dart
+3
-3
@@ -27,7 +27,7 @@ import 'package:cake_wallet/src/widgets/alert_with_one_action.dart';
27
import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart';
28
import 'package:cake_wallet/src/screens/send/widgets/confirm_sending_alert.dart';
29
import 'package:cake_wallet/src/screens/send/widgets/sending_alert.dart';
30
-import 'package:cake_wallet/src/screens/send/widgets/template_tile.dart';
30
+import 'package:cake_wallet/src/widgets/template_tile.dart';
31
import 'package:cake_wallet/src/stores/send_template/send_template_store.dart';
32
33
class SendPage extends BasePage {
@@ -394,9 +394,9 @@ class SendFormState extends State<SendForm> {
394
final template = sendTemplateStore.templates[index];
395
396
return TemplateTile(
397
- name: template.name,
397
+ to: template.name,
398
amount: template.amount,
399
- cryptoCurrency: template.cryptoCurrency,
399
+ from: template.cryptoCurrency,
400
onTap: () {
401
_addressController.text = template.address;
402
_cryptoAmountController.text = template.amount;
lib/src/widgets/address_text_field.dart
+5
-3
@@ -20,6 +20,7 @@ class AddressTextField extends StatelessWidget {
20
this.onURIScanned,
21
this.focusNode,
22
this.isBorderExist = true,
23
+ this.buttonColor = PaletteDark.walletCardSubAddressField,
24
this.validator});
25
26
static const prefixIconWidth = 34.0;
@@ -33,6 +34,7 @@ class AddressTextField extends StatelessWidget {
34
final List<AddressTextFieldOption> options;
35
final FormFieldValidator<String> validator;
36
final bool isBorderExist;
37
+ final Color buttonColor;
38
FocusNode focusNode;
39
40
@override
@@ -64,7 +66,7 @@ class AddressTextField extends StatelessWidget {
66
child: Container(
67
padding: EdgeInsets.all(8),
68
decoration: BoxDecoration(
67
- color: PaletteDark.walletCardSubAddressField,
69
+ color: buttonColor,
70
borderRadius:
71
BorderRadius.all(Radius.circular(6))),
72
child: Image.asset('assets/images/qr_code_icon.png')),
@@ -82,7 +84,7 @@ class AddressTextField extends StatelessWidget {
84
child: Container(
85
padding: EdgeInsets.all(8),
86
decoration: BoxDecoration(
85
- color: PaletteDark.walletCardSubAddressField,
87
+ color: buttonColor,
88
borderRadius:
89
BorderRadius.all(Radius.circular(6))),
90
child: Image.asset(
@@ -101,7 +103,7 @@ class AddressTextField extends StatelessWidget {
103
child: Container(
104
padding: EdgeInsets.all(8),
105
decoration: BoxDecoration(
104
- color: PaletteDark.walletCardSubAddressField,
106
+ color: buttonColor,
107
borderRadius:
108
BorderRadius.all(Radius.circular(6))),
109
child: Image.asset(
lib/src/widgets/template_tile.dart
renamed
+6
-6
@@ -3,15 +3,15 @@ import 'package:cake_wallet/palette.dart';
3
4
class TemplateTile extends StatelessWidget {
5
TemplateTile({
6
- @required this.name,
6
+ @required this.to,
7
@required this.amount,
8
- @required this.cryptoCurrency,
8
+ @required this.from,
9
@required this.onTap
10
});
11
12
- final String name;
12
+ final String to;
13
final String amount;
14
- final String cryptoCurrency;
14
+ final String from;
15
final VoidCallback onTap;
16
17
final toIcon = Image.asset('assets/images/to_icon.png');
@@ -44,7 +44,7 @@ class TemplateTile extends StatelessWidget {
44
Padding(
45
padding: EdgeInsets.only(left: 5),
46
child: Text(
47
- cryptoCurrency,
47
+ from,
48
style: TextStyle(
49
fontSize: 16,
50
fontWeight: FontWeight.w600,
@@ -59,7 +59,7 @@ class TemplateTile extends StatelessWidget {
59
Padding(
60
padding: EdgeInsets.only(left: 5),
61
child: Text(
62
- name,
62
+ to,
63
style: TextStyle(
64
fontSize: 16,
65
fontWeight: FontWeight.w600,