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
Oleksandr Sobol committed
May 12, 2020 at 20:46 UTC
16dfb3a2d5c539ba6f9638a0034561353d7dfded
5 files changed
+484
-199
lib/src/screens/exchange/exchange_page.dart
+328
-165
@@ -1,4 +1,6 @@
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';
@@ -19,16 +21,17 @@ 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';
23
import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
24
+import 'package:cake_wallet/src/widgets/top_panel.dart';
25
26
class ExchangePage extends BasePage {
27
@override
28
String get title => S.current.exchange;
29
30
@override
28
- bool get isModalBackButton => true;
31
+ Color get backgroundColor => PaletteDark.walletCardSubAddressField;
32
30
- final Image arrowBottomPurple =
31
- Image.asset('assets/images/arrow_bottom_purple_icon.png', height: 8);
33
+ final Image arrowBottom =
34
+ Image.asset('assets/images/arrow_bottom_purple_icon.png', color: Colors.white, height: 6);
35
36
@override
37
Widget middle(BuildContext context) {
@@ -38,31 +41,34 @@ class ExchangePage extends BasePage {
41
onPressed: () => _presentProviderPicker(context),
42
highlightColor: Colors.transparent,
43
splashColor: Colors.transparent,
41
- child: Column(
42
- crossAxisAlignment: CrossAxisAlignment.center,
43
- mainAxisAlignment: MainAxisAlignment.center,
44
+ child: Row(
45
+ mainAxisSize: MainAxisSize.min,
46
+ crossAxisAlignment: CrossAxisAlignment.start,
47
children: <Widget>[
45
- Row(
46
- mainAxisAlignment: MainAxisAlignment.center,
47
- crossAxisAlignment: CrossAxisAlignment.center,
48
- children: [
49
- Text(S.of(context).exchange,
50
- style: TextStyle(
51
- fontSize: 16.0,
52
- fontWeight: FontWeight.w400,
53
- color: Theme.of(context).primaryTextTheme.title.color)),
54
- SizedBox(width: 5),
55
- arrowBottomPurple
56
- ]),
57
- Observer(
58
- builder: (_) => Text('${exchangeStore.provider.title}',
48
+ Column(
49
+ crossAxisAlignment: CrossAxisAlignment.center,
50
+ mainAxisSize: MainAxisSize.min,
51
+ children: <Widget>[
52
+ Text(S.of(context).exchange,
53
style: TextStyle(
60
- fontSize: 10.0,
54
+ fontSize: 16.0,
55
fontWeight: FontWeight.w400,
62
- color:
63
- Theme.of(context).primaryTextTheme.headline.color)))
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
],
65
- ),
71
+ )
72
);
73
}
74
@@ -72,14 +78,16 @@ class ExchangePage extends BasePage {
78
79
return ButtonTheme(
80
minWidth: double.minPositive,
81
+ highlightColor: Colors.transparent,
82
+ splashColor: Colors.transparent,
83
child: FlatButton(
84
padding: EdgeInsets.all(0),
85
child: Text(
86
S.of(context).clear,
87
style: TextStyle(
80
- color: Theme.of(context).accentTextTheme.caption.color,
88
+ color: PaletteDark.walletCardText,
89
fontWeight: FontWeight.w500,
82
- fontSize: 16),
90
+ fontSize: 14),
91
),
92
onPressed: () => exchangeStore.reset()),
93
);
@@ -117,10 +125,12 @@ class ExchangeFormState extends State<ExchangeForm> {
125
126
final Image arrowBottomPurple = Image.asset(
127
'assets/images/arrow_bottom_purple_icon.png',
128
+ color: Colors.white,
129
height: 8,
130
);
131
final Image arrowBottomCakeGreen = Image.asset(
132
'assets/images/arrow_bottom_cake_green.png',
133
+ color: Colors.white,
134
height: 8,
135
);
136
@@ -141,156 +151,309 @@ class ExchangeFormState extends State<ExchangeForm> {
151
WidgetsBinding.instance.addPostFrameCallback(
152
(_) => _setReactions(context, exchangeStore, walletStore));
153
144
- return Form(
145
- key: _formKey,
146
- child: ScrollableWithBottomSection(
147
- contentPadding: EdgeInsets.only(left: 20, right: 20),
148
- content: SingleChildScrollView(
149
- child: Column(
150
- mainAxisAlignment: MainAxisAlignment.spaceAround,
154
+ return Container(
155
+ color: PaletteDark.historyPanel,
156
+ child: Form(
157
+ key: _formKey,
158
+ child: ScrollableWithBottomSection(
159
+ contentPadding: EdgeInsets.only(bottom: 24),
160
+ content: Column(
161
children: <Widget>[
162
+ TopPanel(
163
+ color: PaletteDark.menuList,
164
+ edgeInsets: EdgeInsets.only(bottom: 24),
165
+ widget: Column(
166
+ children: <Widget>[
167
+ TopPanel(
168
+ color: PaletteDark.walletCardSubAddressField,
169
+ widget: Observer(
170
+ builder: (_) => ExchangeCard(
171
+ key: depositKey,
172
+ title: S.of(context).you_will_send,
173
+ initialCurrency: exchangeStore.depositCurrency,
174
+ initialWalletName: depositWalletName,
175
+ initialAddress:
176
+ exchangeStore.depositCurrency == walletStore.type
177
+ ? walletStore.address
178
+ : null,
179
+ initialIsAmountEditable: true,
180
+ initialIsAddressEditable: true,
181
+ isAmountEstimated: false,
182
+ currencies: CryptoCurrency.all,
183
+ onCurrencySelected: (currency) =>
184
+ exchangeStore.changeDepositCurrency(currency: currency),
185
+ imageArrow: arrowBottomPurple,
186
+ currencyButtonColor: PaletteDark.walletCardSubAddressField,
187
+ currencyValueValidator: (value) {
188
+ exchangeStore.validateCryptoCurrency(value);
189
+ return exchangeStore.errorMessage;
190
+ },
191
+ addressTextFieldValidator: (value) {
192
+ exchangeStore.validateAddress(value,
193
+ cryptoCurrency: exchangeStore.depositCurrency);
194
+ return exchangeStore.errorMessage;
195
+ },
196
+ ),
197
+ )
198
+ ),
199
+ Padding(
200
+ padding: EdgeInsets.only(top: 32, left: 24, right: 24),
201
+ child: Observer(
202
+ builder: (_) => ExchangeCard(
203
+ key: receiveKey,
204
+ title: S.of(context).you_will_get,
205
+ initialCurrency: exchangeStore.receiveCurrency,
206
+ initialWalletName: receiveWalletName,
207
+ initialAddress:
208
+ exchangeStore.receiveCurrency == walletStore.type
209
+ ? walletStore.address
210
+ : null,
211
+ initialIsAmountEditable: false,
212
+ initialIsAddressEditable: true,
213
+ isAmountEstimated: true,
214
+ currencies: CryptoCurrency.all,
215
+ onCurrencySelected: (currency) => exchangeStore
216
+ .changeReceiveCurrency(currency: currency),
217
+ imageArrow: arrowBottomCakeGreen,
218
+ currencyButtonColor: PaletteDark.menuList,
219
+ currencyValueValidator: (value) {
220
+ exchangeStore.validateCryptoCurrency(value);
221
+ return exchangeStore.errorMessage;
222
+ },
223
+ addressTextFieldValidator: (value) {
224
+ exchangeStore.validateAddress(value,
225
+ cryptoCurrency: exchangeStore.receiveCurrency);
226
+ return exchangeStore.errorMessage;
227
+ },
228
+ )),
229
+ )
230
+ ],
231
+ )
232
+ ),
233
Padding(
153
- padding: EdgeInsets.only(top: 10, bottom: 20),
154
- child: Text(
155
- S.of(context).you_will_send,
156
- style: TextStyle(
157
- fontWeight: FontWeight.bold,
158
- fontSize: 18,
159
- height: 1.1,
160
- color: Theme.of(context).primaryTextTheme.title.color),
234
+ padding: EdgeInsets.only(
235
+ top: 32,
236
+ left: 24,
237
+ bottom: 24
238
+ ),
239
+ child: Row(
240
+ mainAxisAlignment: MainAxisAlignment.start,
241
+ children: <Widget>[
242
+ Text(
243
+ S.of(context).send_templates,
244
+ style: TextStyle(
245
+ fontSize: 18,
246
+ fontWeight: FontWeight.w600,
247
+ color: PaletteDark.walletCardText
248
+ ),
249
+ )
250
+ ],
251
),
252
),
163
- ExchangeCard(
164
- key: depositKey,
165
- initialCurrency: exchangeStore.depositCurrency,
166
- initialWalletName: depositWalletName,
167
- initialAddress:
168
- exchangeStore.depositCurrency == walletStore.type
169
- ? walletStore.address
170
- : null,
171
- initialIsAmountEditable: true,
172
- initialIsAddressEditable: true,
173
- isAmountEstimated: false,
174
- currencies: CryptoCurrency.all,
175
- onCurrencySelected: (currency) =>
176
- exchangeStore.changeDepositCurrency(currency: currency),
177
- imageArrow: arrowBottomPurple,
178
- currencyValueValidator: (value) {
179
- exchangeStore.validateCryptoCurrency(value);
180
- return exchangeStore.errorMessage;
181
- },
182
- addressTextFieldValidator: (value) {
183
- exchangeStore.validateAddress(value,
184
- cryptoCurrency: exchangeStore.depositCurrency);
185
- return exchangeStore.errorMessage;
186
- },
187
- ),
188
- SizedBox(height: 35),
189
- Padding(
190
- padding: EdgeInsets.only(bottom: 20),
253
+ Container(
254
+ height: 40,
255
+ width: double.infinity,
256
+ padding: EdgeInsets.only(left: 24),
257
+ child: Observer(
258
+ builder: (_) {
259
+
260
+ return ListView.builder(
261
+ scrollDirection: Axis.horizontal,
262
+ itemCount: 1,
263
+ itemBuilder: (context, index) {
264
+
265
+ if (index == 0) {
266
+ return GestureDetector(
267
+ onTap: () {},
268
+ child: Container(
269
+ padding: EdgeInsets.only(right: 10),
270
+ child: DottedBorder(
271
+ borderType: BorderType.RRect,
272
+ dashPattern: [8, 4],
273
+ color: PaletteDark.menuList,
274
+ strokeWidth: 2,
275
+ radius: Radius.circular(20),
276
+ child: Container(
277
+ height: 40,
278
+ width: 75,
279
+ padding: EdgeInsets.only(left: 10, right: 10),
280
+ alignment: Alignment.center,
281
+ decoration: BoxDecoration(
282
+ borderRadius: BorderRadius.all(Radius.circular(20)),
283
+ color: Colors.transparent,
284
+ ),
285
+ child: Text(
286
+ S.of(context).send_new,
287
+ style: TextStyle(
288
+ fontSize: 14,
289
+ fontWeight: FontWeight.w600,
290
+ color: PaletteDark.walletCardText
291
+ ),
292
+ ),
293
+ )
294
+ ),
295
+ ),
296
+ );
297
+ }
298
+
299
+ index -= 1;
300
+
301
+ return Container();
302
+ }
303
+ );
304
+ }
305
+ ),
306
+ )
307
+ ],
308
+ ),
309
+
310
+ /*SingleChildScrollView(
311
+ child: Column(
312
+ mainAxisAlignment: MainAxisAlignment.spaceAround,
313
+ children: <Widget>[
314
+ Padding(
315
+ padding: EdgeInsets.only(top: 10, bottom: 20),
316
child: Text(
192
- S.of(context).you_will_get,
317
+ S.of(context).you_will_send,
318
style: TextStyle(
319
fontWeight: FontWeight.bold,
320
fontSize: 18,
321
height: 1.1,
197
- color:
198
- Theme.of(context).primaryTextTheme.title.color),
199
- )),
200
- Observer(
201
- builder: (_) => ExchangeCard(
202
- key: receiveKey,
203
- initialCurrency: exchangeStore.receiveCurrency,
204
- initialWalletName: receiveWalletName,
205
- initialAddress:
206
- exchangeStore.receiveCurrency == walletStore.type
207
- ? walletStore.address
208
- : null,
209
- initialIsAmountEditable: false,
210
- initialIsAddressEditable: true,
211
- isAmountEstimated: true,
212
- currencies: CryptoCurrency.all,
213
- onCurrencySelected: (currency) => exchangeStore
214
- .changeReceiveCurrency(currency: currency),
215
- imageArrow: arrowBottomCakeGreen,
216
- currencyValueValidator: (value) {
217
- exchangeStore.validateCryptoCurrency(value);
218
- return exchangeStore.errorMessage;
219
- },
220
- addressTextFieldValidator: (value) {
221
- exchangeStore.validateAddress(value,
222
- cryptoCurrency: exchangeStore.receiveCurrency);
223
- return exchangeStore.errorMessage;
224
- },
225
- )),
226
- ],
227
- ),
228
- ),
229
- bottomSectionPadding: EdgeInsets.only(top: 35, left: 20, right: 20),
230
- bottomSection: Column(children: <Widget>[
231
- Padding(
232
- padding: EdgeInsets.only(bottom: 15),
233
- child: Observer(builder: (_) {
234
- final description =
235
- exchangeStore.provider is XMRTOExchangeProvider
236
- ? S.of(context).amount_is_guaranteed
237
- : S.of(context).amount_is_estimate;
238
- return Center(
239
- child: Text(
240
- description,
241
- style: TextStyle(color: Palette.blueGrey, fontSize: 12),
322
+ color: Theme.of(context).primaryTextTheme.title.color),
323
+ ),
324
+ ),
325
+ ExchangeCard(
326
+ key: depositKey,
327
+ initialCurrency: exchangeStore.depositCurrency,
328
+ initialWalletName: depositWalletName,
329
+ initialAddress:
330
+ exchangeStore.depositCurrency == walletStore.type
331
+ ? walletStore.address
332
+ : null,
333
+ initialIsAmountEditable: true,
334
+ initialIsAddressEditable: true,
335
+ isAmountEstimated: false,
336
+ currencies: CryptoCurrency.all,
337
+ /*onCurrencySelected: (currency) =>
338
+ exchangeStore.changeDepositCurrency(currency: currency),*/
339
+ imageArrow: arrowBottomPurple,
340
+ currencyValueValidator: (value) {
341
+ exchangeStore.validateCryptoCurrency(value);
342
+ return exchangeStore.errorMessage;
343
+ },
344
+ addressTextFieldValidator: (value) {
345
+ exchangeStore.validateAddress(value,
346
+ cryptoCurrency: exchangeStore.depositCurrency);
347
+ return exchangeStore.errorMessage;
348
+ },
349
+ ),
350
+ SizedBox(height: 35),
351
+ Padding(
352
+ padding: EdgeInsets.only(bottom: 20),
353
+ child: Text(
354
+ S.of(context).you_will_get,
355
+ style: TextStyle(
356
+ fontWeight: FontWeight.bold,
357
+ fontSize: 18,
358
+ height: 1.1,
359
+ color:
360
+ Theme.of(context).primaryTextTheme.title.color),
361
+ )),
362
+ Observer(
363
+ builder: (_) => ExchangeCard(
364
+ key: receiveKey,
365
+ initialCurrency: exchangeStore.receiveCurrency,
366
+ initialWalletName: receiveWalletName,
367
+ initialAddress:
368
+ exchangeStore.receiveCurrency == walletStore.type
369
+ ? walletStore.address
370
+ : null,
371
+ initialIsAmountEditable: false,
372
+ initialIsAddressEditable: true,
373
+ isAmountEstimated: true,
374
+ currencies: CryptoCurrency.all,
375
+ /*onCurrencySelected: (currency) => exchangeStore
376
+ .changeReceiveCurrency(currency: currency),*/
377
+ imageArrow: arrowBottomCakeGreen,
378
+ currencyValueValidator: (value) {
379
+ exchangeStore.validateCryptoCurrency(value);
380
+ return exchangeStore.errorMessage;
381
+ },
382
+ addressTextFieldValidator: (value) {
383
+ exchangeStore.validateAddress(value,
384
+ cryptoCurrency: exchangeStore.receiveCurrency);
385
+ return exchangeStore.errorMessage;
386
+ },
387
+ )),
388
+ ],
389
+ ),
390
+ ),*/
391
+ bottomSectionPadding: EdgeInsets.only(left: 24, right: 24, bottom: 24),
392
+ bottomSection: Column(children: <Widget>[
393
+ Padding(
394
+ padding: EdgeInsets.only(bottom: 15),
395
+ child: Observer(builder: (_) {
396
+ final description =
397
+ exchangeStore.provider is XMRTOExchangeProvider
398
+ ? S.of(context).amount_is_guaranteed
399
+ : S.of(context).amount_is_estimate;
400
+ return Center(
401
+ child: Text(
402
+ description,
403
+ style: TextStyle(
404
+ color: PaletteDark.walletCardText,
405
+ fontSize: 12
406
+ ),
407
+ ),
408
+ );
409
+ }),
410
+ ),
411
+ Observer(
412
+ builder: (_) => LoadingPrimaryButton(
413
+ text: S.of(context).exchange,
414
+ onPressed: () {
415
+ if (_formKey.currentState.validate()) {
416
+ exchangeStore.createTrade();
417
+ }
418
+ },
419
+ color: Colors.blue,
420
+ textColor: Colors.white,
421
+ isLoading: exchangeStore.tradeState is TradeIsCreating,
422
+ )),
423
+ /*Observer(builder: (_) {
424
+ final title = exchangeStore.provider.description.title;
425
+ var imageSrc = '';
426
+
427
+ switch (exchangeStore.provider.description) {
428
+ case ExchangeProviderDescription.xmrto:
429
+ imageSrc = 'assets/images/xmr_btc.png';
430
+ break;
431
+ case ExchangeProviderDescription.changeNow:
432
+ imageSrc = 'assets/images/change_now.png';
433
+ break;
434
+ case ExchangeProviderDescription.morphToken:
435
+ imageSrc = 'assets/images/morph_icon.png';
436
+ break;
437
+ }
438
+
439
+ return Padding(
440
+ padding: EdgeInsets.only(top: 20, bottom: 20),
441
+ child: Row(
442
+ mainAxisAlignment: MainAxisAlignment.center,
443
+ children: <Widget>[
444
+ Image.asset(imageSrc),
445
+ SizedBox(width: 10),
446
+ Text(
447
+ S.of(context).powered_by(title),
448
+ style: TextStyle(fontSize: 14, color: Palette.powered),
449
+ )
450
+ ],
451
),
452
);
244
- }),
245
- ),
246
- Observer(
247
- builder: (_) => LoadingPrimaryButton(
248
- text: S.of(context).exchange,
249
- onPressed: () {
250
- if (_formKey.currentState.validate()) {
251
- exchangeStore.createTrade();
252
- }
253
- },
254
- color: Theme.of(context)
255
- .primaryTextTheme
256
- .button
257
- .backgroundColor,
258
- textColor: Theme.of(context).primaryTextTheme.button.color,
259
- isLoading: exchangeStore.tradeState is TradeIsCreating,
260
- )),
261
- Observer(builder: (_) {
262
- final title = exchangeStore.provider.description.title;
263
- var imageSrc = '';
264
-
265
- switch (exchangeStore.provider.description) {
266
- case ExchangeProviderDescription.xmrto:
267
- imageSrc = 'assets/images/xmr_btc.png';
268
- break;
269
- case ExchangeProviderDescription.changeNow:
270
- imageSrc = 'assets/images/change_now.png';
271
- break;
272
- case ExchangeProviderDescription.morphToken:
273
- imageSrc = 'assets/images/morph_icon.png';
274
- break;
275
- }
276
-
277
- return Padding(
278
- padding: EdgeInsets.only(top: 20, bottom: 20),
279
- child: Row(
280
- mainAxisAlignment: MainAxisAlignment.center,
281
- children: <Widget>[
282
- Image.asset(imageSrc),
283
- SizedBox(width: 10),
284
- Text(
285
- S.of(context).powered_by(title),
286
- style: TextStyle(fontSize: 14, color: Palette.powered),
287
- )
288
- ],
289
- ),
290
- );
291
- })
292
- ]),
293
- ));
453
+ })*/
454
+ ]),
455
+ )),
456
+ );
457
}
458
459
void _setReactions(
lib/src/screens/exchange/widgets/exchange_card.dart
+116
-25
@@ -5,10 +5,12 @@ 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';
7
import 'package:cake_wallet/src/widgets/address_text_field.dart';
8
+import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
9
10
class ExchangeCard extends StatefulWidget {
11
ExchangeCard(
12
{Key key,
13
+ this.title = '',
14
this.initialCurrency,
15
this.initialAddress,
16
this.initialWalletName,
@@ -18,12 +20,14 @@ class ExchangeCard extends StatefulWidget {
20
this.currencies,
21
this.onCurrencySelected,
22
this.imageArrow,
23
+ this.currencyButtonColor = Colors.transparent,
24
this.currencyValueValidator,
25
this.addressTextFieldValidator})
26
: super(key: key);
27
28
final List<CryptoCurrency> currencies;
29
final Function(CryptoCurrency) onCurrencySelected;
30
+ final String title;
31
final CryptoCurrency initialCurrency;
32
final String initialWalletName;
33
final String initialAddress;
@@ -31,6 +35,7 @@ class ExchangeCard extends StatefulWidget {
35
final bool initialIsAddressEditable;
36
final bool isAmountEstimated;
37
final Image imageArrow;
38
+ final Color currencyButtonColor;
39
final FormFieldValidator<String> currencyValueValidator;
40
final FormFieldValidator<String> addressTextFieldValidator;
41
@@ -42,6 +47,7 @@ class ExchangeCardState extends State<ExchangeCard> {
47
final addressController = TextEditingController();
48
final amountController = TextEditingController();
49
50
+ String _title;
51
String _min;
52
String _max;
53
CryptoCurrency _selectedCurrency;
@@ -52,6 +58,7 @@ class ExchangeCardState extends State<ExchangeCard> {
58
59
@override
60
void initState() {
61
+ _title = widget.title;
62
_isAmountEditable = widget.initialIsAmountEditable;
63
_isAddressEditable = widget.initialIsAddressEditable;
64
_walletName = widget.initialWalletName;
@@ -103,33 +110,117 @@ class ExchangeCardState extends State<ExchangeCard> {
110
@override
111
Widget build(BuildContext context) {
112
return Container(
106
- padding: EdgeInsets.fromLTRB(22, 15, 22, 30),
113
width: double.infinity,
108
- decoration: BoxDecoration(
109
- color: Theme.of(context).cardColor,
110
- borderRadius: BorderRadius.all(Radius.circular(12))),
111
- child: Column(children: <Widget>[
112
- _isAmountEstimated != null && _isAmountEstimated
113
- ? Row(mainAxisAlignment: MainAxisAlignment.end, children: <Widget>[
114
- SizedBox(
115
- height: 30,
116
- child: Container(
117
- padding: EdgeInsets.fromLTRB(10, 5, 10, 5),
118
- decoration: BoxDecoration(
119
- color: Palette.lightGrey,
120
- borderRadius: BorderRadius.circular(10.0)),
121
- child: Text(
122
- S.of(context).estimated,
123
- style: TextStyle(
124
- fontSize: 14,
125
- color: Palette.wildDarkBlue,
126
- fontWeight: FontWeight.bold),
127
- ),
114
+ color: Colors.transparent,
115
+ child: Column(
116
+ children: <Widget>[
117
+ Row(
118
+ mainAxisAlignment: MainAxisAlignment.start,
119
+ children: <Widget>[
120
+ Text(
121
+ _title,
122
+ style: TextStyle(
123
+ fontSize: 18,
124
+ fontWeight: FontWeight.w600,
125
+ color: PaletteDark.walletCardText
126
+ ),
127
+ )
128
+ ],
129
+ ),
130
+ Padding(
131
+ padding: EdgeInsets.only(top: 10),
132
+ child: Stack(
133
+ children: <Widget>[
134
+ BaseTextFormField(
135
+ controller: amountController,
136
+ enabled: _isAmountEditable,
137
+ textAlign: TextAlign.left,
138
+ keyboardType: TextInputType.numberWithOptions(
139
+ signed: false, decimal: true),
140
+ inputFormatters: [
141
+ BlacklistingTextInputFormatter(
142
+ RegExp('[\\-|\\ |\\,]'))
143
+ ],
144
+ hintText: '0.0000',
145
+ borderColor: PaletteDark.borderCardColor,
146
+ validator: widget.currencyValueValidator
147
+ ),
148
+ Positioned(
149
+ bottom: 8,
150
+ right: 0,
151
+ child: Container(
152
+ height: 32,
153
+ padding: EdgeInsets.only(left: 10),
154
+ color: widget.currencyButtonColor,
155
+ child: InkWell(
156
+ onTap: () => _presentPicker(context),
157
+ child: Row(
158
+ mainAxisAlignment: MainAxisAlignment.spaceBetween,
159
+ mainAxisSize: MainAxisSize.min,
160
+ children: <Widget>[
161
+ Text(
162
+ _selectedCurrency.toString(),
163
+ style: TextStyle(
164
+ fontWeight: FontWeight.w600,
165
+ fontSize: 16,
166
+ color: Colors.white)),
167
+ Padding(
168
+ padding: EdgeInsets.only(left: 5),
169
+ child: widget.imageArrow,
170
+ )
171
+ ]),
172
),
173
),
130
- ])
131
- : Container(),
132
- Container(
174
+ )
175
+ ],
176
+ )
177
+ ),
178
+ Padding(
179
+ padding: EdgeInsets.only(top: 5),
180
+ child: Row(
181
+ mainAxisAlignment: MainAxisAlignment.start,
182
+ children: <Widget>[
183
+ _min != null
184
+ ? Text(
185
+ S.of(context).min_value(
186
+ _min, _selectedCurrency.toString()),
187
+ style: TextStyle(
188
+ fontSize: 10,
189
+ height: 1.2,
190
+ color: PaletteDark.walletCardText),
191
+ )
192
+ : Offstage(),
193
+ _min != null ? SizedBox(width: 10) : Offstage(),
194
+ _max != null
195
+ ? Text(
196
+ S.of(context).max_value(
197
+ _max, _selectedCurrency.toString()),
198
+ style: TextStyle(
199
+ fontSize: 10,
200
+ height: 1.2,
201
+ color: PaletteDark.walletCardText))
202
+ : Offstage(),
203
+ ]),
204
+ ),
205
+ Padding(
206
+ padding: EdgeInsets.only(top: 10),
207
+ child: AddressTextField(
208
+ controller: addressController,
209
+ isActive: _isAddressEditable,
210
+ options: _isAddressEditable
211
+ ? _walletName != null
212
+ ? []
213
+ : [
214
+ AddressTextFieldOption.qrCode,
215
+ AddressTextFieldOption.addressBook,
216
+ ]
217
+ : [],
218
+ isBorderExist: false,
219
+ validator: widget.addressTextFieldValidator,
220
+ ),
221
+ )
222
+
223
+ /*Container(
224
child: Row(
225
crossAxisAlignment: CrossAxisAlignment.center,
226
children: <Widget>[
@@ -254,7 +345,7 @@ class ExchangeCardState extends State<ExchangeCard> {
345
]
346
: [],
347
validator: widget.addressTextFieldValidator,
257
- )
348
+ )*/
349
]),
350
);
351
}
lib/src/widgets/address_text_field.dart
+10
-4
@@ -19,6 +19,7 @@ class AddressTextField extends StatelessWidget {
19
],
20
this.onURIScanned,
21
this.focusNode,
22
+ this.isBorderExist = true,
23
this.validator});
24
25
static const prefixIconWidth = 34.0;
@@ -31,6 +32,7 @@ class AddressTextField extends StatelessWidget {
32
final Function(Uri) onURIScanned;
33
final List<AddressTextFieldOption> options;
34
final FormFieldValidator<String> validator;
35
+ final bool isBorderExist;
36
FocusNode focusNode;
37
38
@override
@@ -114,13 +116,17 @@ class AddressTextField extends StatelessWidget {
116
color: PaletteDark.walletCardText
117
),
118
hintText: placeholder ?? S.current.widgets_address,
117
- focusedBorder: UnderlineInputBorder(
119
+ focusedBorder: isBorderExist
120
+ ? UnderlineInputBorder(
121
borderSide: BorderSide(
122
color: PaletteDark.walletCardSubAddressField,
120
- width: 1.0)),
121
- enabledBorder: UnderlineInputBorder(
123
+ width: 1.0))
124
+ : InputBorder.none,
125
+ enabledBorder: isBorderExist
126
+ ? UnderlineInputBorder(
127
borderSide:
123
- BorderSide(color: PaletteDark.walletCardSubAddressField, width: 1.0)),
128
+ BorderSide(color: PaletteDark.walletCardSubAddressField, width: 1.0))
129
+ : InputBorder.none,
130
),
131
validator: validator,
132
);
lib/src/widgets/base_text_form_field.dart
+9
@@ -15,6 +15,9 @@ class BaseTextFormField extends StatelessWidget {
15
this.textColor = Colors.white,
16
this.hintColor = PaletteDark.walletCardText,
17
this.borderColor = PaletteDark.menuList,
18
+ this.prefix,
19
+ this.suffix,
20
+ this.enabled = true,
21
this.validator
22
});
23
@@ -29,6 +32,9 @@ class BaseTextFormField extends StatelessWidget {
32
final Color textColor;
33
final Color hintColor;
34
final Color borderColor;
35
+ final Widget prefix;
36
+ final Widget suffix;
37
+ final bool enabled;
38
final FormFieldValidator<String> validator;
39
40
@override
@@ -41,11 +47,14 @@ class BaseTextFormField extends StatelessWidget {
47
autovalidate: autovalidate,
48
maxLines: maxLines,
49
inputFormatters: inputFormatters,
50
+ enabled: enabled,
51
style: TextStyle(
52
fontSize: 16.0,
53
color: textColor
54
),
55
decoration: InputDecoration(
56
+ prefix: prefix,
57
+ suffix: suffix,
58
hintStyle: TextStyle(
59
color: hintColor,
60
fontSize: 16
lib/src/widgets/top_panel.dart
+21
-5
@@ -1,24 +1,40 @@
1
import 'package:flutter/material.dart';
2
3
-class TopPanel extends StatelessWidget {
4
- TopPanel({@required this.color, @required this.widget});
3
+class TopPanel extends StatefulWidget {
4
+ TopPanel({
5
+ @required this.color,
6
+ @required this.widget,
7
+ this.edgeInsets = const EdgeInsets.all(24)
8
+ });
9
10
final Color color;
11
final Widget widget;
12
+ final EdgeInsets edgeInsets;
13
+
14
+ @override
15
+ TopPanelState createState() => TopPanelState(color, widget, edgeInsets);
16
+}
17
+
18
+class TopPanelState extends State<TopPanel> {
19
+ TopPanelState(this._color, this._widget, this._edgeInsets);
20
+
21
+ final Color _color;
22
+ final Widget _widget;
23
+ final EdgeInsets _edgeInsets;
24
25
@override
26
Widget build(BuildContext context) {
27
return Container(
28
width: double.infinity,
13
- padding: EdgeInsets.all(24),
29
+ padding: _edgeInsets,
30
decoration: BoxDecoration(
31
borderRadius: BorderRadius.only(
32
bottomLeft: Radius.circular(24),
33
bottomRight: Radius.circular(24)
34
),
19
- color: color
35
+ color: _color
36
),
21
- child: widget,
37
+ child: _widget,
38
);
39
}
40
}
\ No newline at end of file