Add collapse button to the address book (#357)
* Added collapsible list to the Address Book * fix text style
Serhii committed
May 3, 2022 at 12:58 UTC
75da854121f213c4e292f95bd5e5151d2146b758
3 files changed
+138
-15
lib/src/screens/contact/contact_list_page.dart
+7
-5
@@ -12,7 +12,7 @@ import 'package:cw_core/crypto_currency.dart';
12
import 'package:cake_wallet/src/screens/base_page.dart';
13
import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart';
14
import 'package:cake_wallet/view_model/contact_list/contact_list_view_model.dart';
15
-import 'package:cake_wallet/src/widgets/standard_list.dart';
15
+import 'package:cake_wallet/src/widgets/collapsible_standart_list.dart';
16
17
class ContactListPage extends BasePage {
18
ContactListPage(this.contactListViewModel, {this.isEditable = true});
@@ -62,9 +62,12 @@ class ContactListPage extends BasePage {
62
padding: EdgeInsets.only(top: 20.0, bottom: 20.0),
63
child: Observer(
64
builder: (_) {
65
- return SectionStandardList(
65
+ return CollapsibleSectionList(
66
context: context,
67
sectionCount: 2,
68
+ themeColor: Theme.of(context).primaryTextTheme.title.color,
69
+ dividerThemeColor:
70
+ Theme.of(context).primaryTextTheme.caption.decorationColor,
71
sectionTitleBuilder: (_, int sectionIndex) {
72
var title = 'Contacts';
73
@@ -73,7 +76,7 @@ class ContactListPage extends BasePage {
76
}
77
78
return Container(
76
- padding: EdgeInsets.only(left: 24, bottom: 20),
79
+ padding: EdgeInsets.only(bottom: 10),
80
child: Text(title, style: TextStyle(fontSize: 36)));
81
},
82
itemCounter: (int sectionIndex) => sectionIndex == 0
@@ -144,11 +147,10 @@ class ContactListPage extends BasePage {
147
child: Container(
148
color: Colors.transparent,
149
padding:
147
- const EdgeInsets.only(left: 24, top: 16, bottom: 16, right: 24),
150
+ const EdgeInsets.only(top: 16, bottom: 16, right: 24),
151
child: Row(
152
mainAxisSize: MainAxisSize.min,
153
mainAxisAlignment: MainAxisAlignment.start,
151
- crossAxisAlignment: CrossAxisAlignment.center,
154
children: <Widget>[
155
image ?? Offstage(),
156
Expanded(
lib/src/widgets/collapsible_standart_list.dart
new
+92
@@ -0,0 +1,92 @@
1
+import 'package:cake_wallet/src/widgets/standard_list.dart';
2
+import 'package:flutter/material.dart';
3
+
4
+class CollapsibleSectionList extends SectionStandardList {
5
+ CollapsibleSectionList(
6
+ {bool hasTopSeparator,
7
+ BuildContext context,
8
+ int sectionCount,
9
+ int Function(int sectionIndex) itemCounter,
10
+ Widget Function(BuildContext context, int sectionIndex, int itemIndex)
11
+ itemBuilder,
12
+ Widget Function(BuildContext context, int sectionIndex)
13
+ sectionTitleBuilder,
14
+ Color themeColor,
15
+ Color dividerThemeColor})
16
+ : super(
17
+ hasTopSeparator: hasTopSeparator,
18
+ sectionCount: sectionCount,
19
+ itemCounter: itemCounter,
20
+ itemBuilder: itemBuilder,
21
+ sectionTitleBuilder: sectionTitleBuilder,
22
+ themeColor: themeColor,
23
+ dividerThemeColor: dividerThemeColor);
24
+
25
+ @override
26
+ List<Widget> transform(
27
+ bool hasTopSeparator,
28
+ BuildContext context,
29
+ int sectionCount,
30
+ int Function(int sectionIndex) itemCounter,
31
+ Widget Function(BuildContext context, int sectionIndex, int itemIndex)
32
+ itemBuilder,
33
+ Widget Function(BuildContext context, int sectionIndex)
34
+ sectionTitleBuilder,
35
+ themeColor,
36
+ dividerThemeColor) {
37
+ final items = <Widget>[];
38
+
39
+ for (var sectionIndex = 0; sectionIndex < sectionCount; sectionIndex++) {
40
+ final itemCount = itemCounter(sectionIndex);
41
+
42
+ items.add(Theme(
43
+ data: ThemeData(
44
+ textTheme: TextTheme(subtitle1: TextStyle(color: themeColor,fontFamily: 'Lato')),
45
+ backgroundColor: dividerThemeColor,
46
+ unselectedWidgetColor: themeColor,
47
+ accentColor: themeColor)
48
+ .copyWith(dividerColor: Colors.transparent),
49
+ child: Padding(
50
+ padding: const EdgeInsets.only(left: 24.0),
51
+ child: ListTileTheme(
52
+ contentPadding: EdgeInsets.only(right: 16,top:sectionIndex>0?26:0),
53
+ child: ExpansionTile(
54
+ title: sectionTitleBuilder == null
55
+ ? Container()
56
+ : Container(child: buildTitle(items, sectionIndex, context)),
57
+ initiallyExpanded: true,
58
+ children: buildSection(itemCount, items, sectionIndex, context),
59
+ ),
60
+ ),
61
+ ),
62
+ ));
63
+
64
+ }
65
+
66
+ items.add(StandardListSeparator(padding: EdgeInsets.only(left: 24)));
67
+ return items;
68
+ }
69
+
70
+ @override
71
+ Widget buildTitle(
72
+ List<Widget> items, int sectionIndex, BuildContext context) {
73
+ final title = sectionTitleBuilder(context, sectionIndex);
74
+ return title;
75
+ }
76
+
77
+ @override
78
+ List<Widget> buildSection(int itemCount, List<Widget> items, int sectionIndex,
79
+ BuildContext context) {
80
+ final List<Widget> section = [];
81
+
82
+ for (var itemIndex = 0; itemIndex < itemCount; itemIndex++) {
83
+ final item = itemBuilder(context, sectionIndex, itemIndex);
84
+
85
+ section.add(StandardListSeparator());
86
+
87
+ section.add(item);
88
+
89
+ }
90
+ return section;
91
+ }
92
+}
lib/src/widgets/standard_list.dart
+39
-10
@@ -120,9 +120,20 @@ class SectionStandardList extends StatelessWidget {
120
@required this.sectionCount,
121
this.sectionTitleBuilder,
122
this.hasTopSeparator = false,
123
+ this.themeColor,
124
+ this.dividerThemeColor,
125
BuildContext context})
124
- : totalRows = transform(hasTopSeparator, context, sectionCount,
125
- itemCounter, itemBuilder, sectionTitleBuilder);
126
+ : totalRows = [] {
127
+ totalRows.addAll(transform(
128
+ hasTopSeparator,
129
+ context,
130
+ sectionCount,
131
+ itemCounter,
132
+ itemBuilder,
133
+ sectionTitleBuilder,
134
+ themeColor,
135
+ dividerThemeColor));
136
+ }
137
138
final int sectionCount;
139
final bool hasTopSeparator;
@@ -132,8 +143,10 @@ class SectionStandardList extends StatelessWidget {
143
final Widget Function(BuildContext context, int sectionIndex)
144
sectionTitleBuilder;
145
final List<Widget> totalRows;
146
+ final Color themeColor;
147
+ final Color dividerThemeColor;
148
136
- static List<Widget> transform(
149
+ List<Widget> transform(
150
bool hasTopSeparator,
151
BuildContext context,
152
int sectionCount,
@@ -141,7 +154,9 @@ class SectionStandardList extends StatelessWidget {
154
Widget Function(BuildContext context, int sectionIndex, int itemIndex)
155
itemBuilder,
156
Widget Function(BuildContext context, int sectionIndex)
144
- sectionTitleBuilder) {
157
+ sectionTitleBuilder,
158
+ Color themeColor,
159
+ Color dividerThemeColor) {
160
final items = <Widget>[];
161
162
for (var sectionIndex = 0; sectionIndex < sectionCount; sectionIndex++) {
@@ -150,16 +165,12 @@ class SectionStandardList extends StatelessWidget {
165
}
166
167
if (sectionTitleBuilder != null) {
153
- items.add(sectionTitleBuilder(context, sectionIndex));
168
+ items.add(buildTitle(items, sectionIndex, context));
169
}
170
171
final itemCount = itemCounter(sectionIndex);
172
158
- for (var itemIndex = 0; itemIndex < itemCount; itemIndex++) {
159
- final item = itemBuilder(context, sectionIndex, itemIndex);
160
-
161
- items.add(item);
162
- }
173
+ items.addAll(buildSection(itemCount, items, sectionIndex, context));
174
175
items.add(sectionIndex + 1 != sectionCount
176
? SectionHeaderListRow()
@@ -169,6 +180,24 @@ class SectionStandardList extends StatelessWidget {
180
return items;
181
}
182
183
+ Widget buildTitle(
184
+ List<Widget> items, int sectionIndex, BuildContext context) {
185
+ final title = sectionTitleBuilder(context, sectionIndex);
186
+ return title;
187
+ }
188
+
189
+ List<Widget> buildSection(int itemCount, List<Widget> items, int sectionIndex,
190
+ BuildContext context) {
191
+ final List<Widget> section = [];
192
+
193
+ for (var itemIndex = 0; itemIndex < itemCount; itemIndex++) {
194
+ final item = itemBuilder(context, sectionIndex, itemIndex);
195
+
196
+ section.add(item);
197
+ }
198
+ return section;
199
+ }
200
+
201
@override
202
Widget build(BuildContext context) {
203
return ListView.separated(