CWA-203 | applied new design to standart_list_row, transaction_details_page and trade_details_page

Oleksandr Sobol committed Apr 27, 2020 at 13:23 UTC e832a85e376abc4c2231f1be86cae97c934dbd9b
3 files changed +89 -34
lib/src/screens/trade_details/trade_details_page.dart
+24 -10
@@ -9,13 +9,15 @@ import 'package:cake_wallet/src/stores/settings/settings_store.dart';
9 import 'package:cake_wallet/src/screens/base_page.dart';
10 import 'package:cake_wallet/src/screens/transaction_details/standart_list_item.dart';
11 import 'package:cake_wallet/src/screens/transaction_details/standart_list_row.dart';
12 +import 'package:cake_wallet/palette.dart';
13
14 class TradeDetailsPage extends BasePage {
15 +
16 @override
15 - String get title => S.current.trade_details_title;
17 + Color get backgroundColor => PaletteDark.historyPanel;
18
19 @override
18 - bool get isModalBackButton => true;
20 + String get title => S.current.trade_details_title;
21
22 @override
23 Widget body(BuildContext context) {
@@ -26,7 +28,8 @@ class TradeDetailsPage extends BasePage {
28 formatDefault: "dd.MM.yyyy, HH:mm");
29
30 return Container(
29 - padding: EdgeInsets.only(top: 10.0, bottom: 10.0, left: 20, right: 15),
31 + color: PaletteDark.historyPanel,
32 + padding: EdgeInsets.only(top: 20, bottom: 20),
33 child: Observer(builder: (_) {
34 final trade = exchangeStore.trade;
35 final items = [
@@ -58,15 +61,22 @@ class TradeDetailsPage extends BasePage {
61 }
62
63 return ListView.separated(
61 - separatorBuilder: (_, __) => Divider(
62 - color: Theme.of(context).dividerTheme.color,
63 - height: 1.0,
64 - ),
65 - padding:
66 - EdgeInsets.only(left: 25, top: 10, right: 25, bottom: 15),
64 + separatorBuilder: (_, __) => Container(
65 + height: 1,
66 + padding: EdgeInsets.only(left: 24),
67 + color: PaletteDark.menuList,
68 + child: Container(
69 + height: 1,
70 + color: PaletteDark.walletCardTopEndSync,
71 + ),
72 + ),
73 itemCount: items.length,
74 itemBuilder: (BuildContext context, int index) {
75 final item = items[index];
76 +
77 + final isDrawTop = index == 0 ? true : false;
78 + final isDrawBottom = index == items.length - 1 ? true : false;
79 +
80 return GestureDetector(
81 onTap: () {
82 Clipboard.setData(ClipboardData(text: '${item.value}'));
@@ -80,7 +90,11 @@ class TradeDetailsPage extends BasePage {
90 );
91 },
92 child: StandartListRow(
83 - title: '${item.title}', value: '${item.value}'));
93 + title: '${item.title}',
94 + value: '${item.value}',
95 + isDrawTop: isDrawTop,
96 + isDrawBottom: isDrawBottom,
97 + ));
98 });
99 }));
100 }
lib/src/screens/transaction_details/standart_list_row.dart
+45 -17
@@ -2,29 +2,57 @@ import 'package:flutter/material.dart';
2 import 'package:cake_wallet/palette.dart';
3
4 class StandartListRow extends StatelessWidget {
5 - StandartListRow({this.title, this.value});
5 + StandartListRow({this.title, this.value, this.isDrawTop, this.isDrawBottom});
6
7 final String title;
8 final String value;
9 + final bool isDrawTop;
10 + final bool isDrawBottom;
11
12 @override
13 Widget build(BuildContext context) {
12 - return Padding(
13 - padding: const EdgeInsets.only(top: 10, bottom: 10),
14 - child: Column(
15 - crossAxisAlignment: CrossAxisAlignment.start,
16 - children: <Widget>[
17 - Text(title,
18 - style: TextStyle(
19 - fontSize: 14,
20 - color: Theme.of(context).primaryTextTheme.overline.color),
21 - textAlign: TextAlign.left),
22 - Padding(
23 - padding: const EdgeInsets.only(top: 5),
24 - child: Text(value,
25 - style: TextStyle(fontSize: 14, color: Palette.wildDarkBlue)),
26 - )
27 - ]),
14 + return Column(
15 + children: <Widget>[
16 + isDrawTop
17 + ? Container(
18 + width: double.infinity,
19 + height: 1,
20 + color: PaletteDark.walletCardTopEndSync,
21 + )
22 + : Offstage(),
23 + Container(
24 + width: double.infinity,
25 + color: PaletteDark.menuList,
26 + child: Padding(
27 + padding: const EdgeInsets.only(left: 24, top: 16, bottom: 16, right: 24),
28 + child: Column(
29 + crossAxisAlignment: CrossAxisAlignment.start,
30 + children: <Widget>[
31 + Text(title,
32 + style: TextStyle(
33 + fontSize: 14,
34 + fontWeight: FontWeight.w600,
35 + color: PaletteDark.walletCardText),
36 + textAlign: TextAlign.left),
37 + Padding(
38 + padding: const EdgeInsets.only(top: 12),
39 + child: Text(value,
40 + style: TextStyle(
41 + fontSize: 16,
42 + fontWeight: FontWeight.w600,
43 + color: Colors.white)),
44 + )
45 + ]),
46 + ),
47 + ),
48 + isDrawBottom
49 + ? Container(
50 + width: double.infinity,
51 + height: 1,
52 + color: PaletteDark.walletCardTopEndSync,
53 + )
54 + : Offstage(),
55 + ],
56 );
57 }
58 }
lib/src/screens/transaction_details/transaction_details_page.dart
+20 -7
@@ -8,6 +8,7 @@ import 'package:cake_wallet/src/stores/settings/settings_store.dart';
8 import 'package:cake_wallet/src/screens/transaction_details/standart_list_item.dart';
9 import 'package:cake_wallet/src/screens/transaction_details/standart_list_row.dart';
10 import 'package:cake_wallet/src/screens/base_page.dart';
11 +import 'package:cake_wallet/palette.dart';
12
13 class TransactionDetailsPage extends BasePage {
14 TransactionDetailsPage({this.transactionInfo});
@@ -15,7 +16,7 @@ class TransactionDetailsPage extends BasePage {
16 final TransactionInfo transactionInfo;
17
18 @override
18 - bool get isModalBackButton => true;
19 + Color get backgroundColor => PaletteDark.historyPanel;
20
21 @override
22 String get title => S.current.transaction_details_title;
@@ -77,17 +78,25 @@ class TransactionDetailsFormState extends State<TransactionDetailsForm> {
78 @override
79 Widget build(BuildContext context) {
80 return Container(
80 - padding: EdgeInsets.only(left: 20, right: 15, top: 10, bottom: 10),
81 + color: PaletteDark.historyPanel,
82 + padding: EdgeInsets.only(top: 20, bottom: 20),
83 child: ListView.separated(
84 separatorBuilder: (context, index) => Container(
83 - height: 1,
84 - color: Theme.of(context).dividerTheme.color,
85 - ),
86 - padding: EdgeInsets.only(left: 25, top: 10, right: 25, bottom: 15),
85 + height: 1,
86 + padding: EdgeInsets.only(left: 24),
87 + color: PaletteDark.menuList,
88 + child: Container(
89 + height: 1,
90 + color: PaletteDark.walletCardTopEndSync,
91 + ),
92 + ),
93 itemCount: _items.length,
94 itemBuilder: (context, index) {
95 final item = _items[index];
96
97 + final isDrawTop = index == 0 ? true : false;
98 + final isDrawBottom = index == _items.length - 1 ? true : false;
99 +
100 return GestureDetector(
101 onTap: () {
102 Clipboard.setData(ClipboardData(text: item.value));
@@ -101,7 +110,11 @@ class TransactionDetailsFormState extends State<TransactionDetailsForm> {
110 );
111 },
112 child:
104 - StandartListRow(title: '${item.title}:', value: item.value),
113 + StandartListRow(
114 + title: '${item.title}:',
115 + value: item.value,
116 + isDrawTop: isDrawTop,
117 + isDrawBottom: isDrawBottom),
118 );
119 }),
120 );