mirror of
https://github.com/cake-tech/cake_wallet.git
synced 2025-01-10 21:04:53 +00:00
Add collapse button to the address book (#357)
* Added collapsible list to the Address Book * fix text style
This commit is contained in:
parent
ee4d16f29c
commit
75da854121
3 changed files with 138 additions and 15 deletions
|
@ -12,7 +12,7 @@ import 'package:cw_core/crypto_currency.dart';
|
||||||
import 'package:cake_wallet/src/screens/base_page.dart';
|
import 'package:cake_wallet/src/screens/base_page.dart';
|
||||||
import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart';
|
import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart';
|
||||||
import 'package:cake_wallet/view_model/contact_list/contact_list_view_model.dart';
|
import 'package:cake_wallet/view_model/contact_list/contact_list_view_model.dart';
|
||||||
import 'package:cake_wallet/src/widgets/standard_list.dart';
|
import 'package:cake_wallet/src/widgets/collapsible_standart_list.dart';
|
||||||
|
|
||||||
class ContactListPage extends BasePage {
|
class ContactListPage extends BasePage {
|
||||||
ContactListPage(this.contactListViewModel, {this.isEditable = true});
|
ContactListPage(this.contactListViewModel, {this.isEditable = true});
|
||||||
|
@ -62,9 +62,12 @@ class ContactListPage extends BasePage {
|
||||||
padding: EdgeInsets.only(top: 20.0, bottom: 20.0),
|
padding: EdgeInsets.only(top: 20.0, bottom: 20.0),
|
||||||
child: Observer(
|
child: Observer(
|
||||||
builder: (_) {
|
builder: (_) {
|
||||||
return SectionStandardList(
|
return CollapsibleSectionList(
|
||||||
context: context,
|
context: context,
|
||||||
sectionCount: 2,
|
sectionCount: 2,
|
||||||
|
themeColor: Theme.of(context).primaryTextTheme.title.color,
|
||||||
|
dividerThemeColor:
|
||||||
|
Theme.of(context).primaryTextTheme.caption.decorationColor,
|
||||||
sectionTitleBuilder: (_, int sectionIndex) {
|
sectionTitleBuilder: (_, int sectionIndex) {
|
||||||
var title = 'Contacts';
|
var title = 'Contacts';
|
||||||
|
|
||||||
|
@ -73,7 +76,7 @@ class ContactListPage extends BasePage {
|
||||||
}
|
}
|
||||||
|
|
||||||
return Container(
|
return Container(
|
||||||
padding: EdgeInsets.only(left: 24, bottom: 20),
|
padding: EdgeInsets.only(bottom: 10),
|
||||||
child: Text(title, style: TextStyle(fontSize: 36)));
|
child: Text(title, style: TextStyle(fontSize: 36)));
|
||||||
},
|
},
|
||||||
itemCounter: (int sectionIndex) => sectionIndex == 0
|
itemCounter: (int sectionIndex) => sectionIndex == 0
|
||||||
|
@ -144,11 +147,10 @@ class ContactListPage extends BasePage {
|
||||||
child: Container(
|
child: Container(
|
||||||
color: Colors.transparent,
|
color: Colors.transparent,
|
||||||
padding:
|
padding:
|
||||||
const EdgeInsets.only(left: 24, top: 16, bottom: 16, right: 24),
|
const EdgeInsets.only(top: 16, bottom: 16, right: 24),
|
||||||
child: Row(
|
child: Row(
|
||||||
mainAxisSize: MainAxisSize.min,
|
mainAxisSize: MainAxisSize.min,
|
||||||
mainAxisAlignment: MainAxisAlignment.start,
|
mainAxisAlignment: MainAxisAlignment.start,
|
||||||
crossAxisAlignment: CrossAxisAlignment.center,
|
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
image ?? Offstage(),
|
image ?? Offstage(),
|
||||||
Expanded(
|
Expanded(
|
||||||
|
|
92
lib/src/widgets/collapsible_standart_list.dart
Normal file
92
lib/src/widgets/collapsible_standart_list.dart
Normal file
|
@ -0,0 +1,92 @@
|
||||||
|
import 'package:cake_wallet/src/widgets/standard_list.dart';
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
class CollapsibleSectionList extends SectionStandardList {
|
||||||
|
CollapsibleSectionList(
|
||||||
|
{bool hasTopSeparator,
|
||||||
|
BuildContext context,
|
||||||
|
int sectionCount,
|
||||||
|
int Function(int sectionIndex) itemCounter,
|
||||||
|
Widget Function(BuildContext context, int sectionIndex, int itemIndex)
|
||||||
|
itemBuilder,
|
||||||
|
Widget Function(BuildContext context, int sectionIndex)
|
||||||
|
sectionTitleBuilder,
|
||||||
|
Color themeColor,
|
||||||
|
Color dividerThemeColor})
|
||||||
|
: super(
|
||||||
|
hasTopSeparator: hasTopSeparator,
|
||||||
|
sectionCount: sectionCount,
|
||||||
|
itemCounter: itemCounter,
|
||||||
|
itemBuilder: itemBuilder,
|
||||||
|
sectionTitleBuilder: sectionTitleBuilder,
|
||||||
|
themeColor: themeColor,
|
||||||
|
dividerThemeColor: dividerThemeColor);
|
||||||
|
|
||||||
|
@override
|
||||||
|
List<Widget> transform(
|
||||||
|
bool hasTopSeparator,
|
||||||
|
BuildContext context,
|
||||||
|
int sectionCount,
|
||||||
|
int Function(int sectionIndex) itemCounter,
|
||||||
|
Widget Function(BuildContext context, int sectionIndex, int itemIndex)
|
||||||
|
itemBuilder,
|
||||||
|
Widget Function(BuildContext context, int sectionIndex)
|
||||||
|
sectionTitleBuilder,
|
||||||
|
themeColor,
|
||||||
|
dividerThemeColor) {
|
||||||
|
final items = <Widget>[];
|
||||||
|
|
||||||
|
for (var sectionIndex = 0; sectionIndex < sectionCount; sectionIndex++) {
|
||||||
|
final itemCount = itemCounter(sectionIndex);
|
||||||
|
|
||||||
|
items.add(Theme(
|
||||||
|
data: ThemeData(
|
||||||
|
textTheme: TextTheme(subtitle1: TextStyle(color: themeColor,fontFamily: 'Lato')),
|
||||||
|
backgroundColor: dividerThemeColor,
|
||||||
|
unselectedWidgetColor: themeColor,
|
||||||
|
accentColor: themeColor)
|
||||||
|
.copyWith(dividerColor: Colors.transparent),
|
||||||
|
child: Padding(
|
||||||
|
padding: const EdgeInsets.only(left: 24.0),
|
||||||
|
child: ListTileTheme(
|
||||||
|
contentPadding: EdgeInsets.only(right: 16,top:sectionIndex>0?26:0),
|
||||||
|
child: ExpansionTile(
|
||||||
|
title: sectionTitleBuilder == null
|
||||||
|
? Container()
|
||||||
|
: Container(child: buildTitle(items, sectionIndex, context)),
|
||||||
|
initiallyExpanded: true,
|
||||||
|
children: buildSection(itemCount, items, sectionIndex, context),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
));
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
items.add(StandardListSeparator(padding: EdgeInsets.only(left: 24)));
|
||||||
|
return items;
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget buildTitle(
|
||||||
|
List<Widget> items, int sectionIndex, BuildContext context) {
|
||||||
|
final title = sectionTitleBuilder(context, sectionIndex);
|
||||||
|
return title;
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
List<Widget> buildSection(int itemCount, List<Widget> items, int sectionIndex,
|
||||||
|
BuildContext context) {
|
||||||
|
final List<Widget> section = [];
|
||||||
|
|
||||||
|
for (var itemIndex = 0; itemIndex < itemCount; itemIndex++) {
|
||||||
|
final item = itemBuilder(context, sectionIndex, itemIndex);
|
||||||
|
|
||||||
|
section.add(StandardListSeparator());
|
||||||
|
|
||||||
|
section.add(item);
|
||||||
|
|
||||||
|
}
|
||||||
|
return section;
|
||||||
|
}
|
||||||
|
}
|
|
@ -120,9 +120,20 @@ class SectionStandardList extends StatelessWidget {
|
||||||
@required this.sectionCount,
|
@required this.sectionCount,
|
||||||
this.sectionTitleBuilder,
|
this.sectionTitleBuilder,
|
||||||
this.hasTopSeparator = false,
|
this.hasTopSeparator = false,
|
||||||
|
this.themeColor,
|
||||||
|
this.dividerThemeColor,
|
||||||
BuildContext context})
|
BuildContext context})
|
||||||
: totalRows = transform(hasTopSeparator, context, sectionCount,
|
: totalRows = [] {
|
||||||
itemCounter, itemBuilder, sectionTitleBuilder);
|
totalRows.addAll(transform(
|
||||||
|
hasTopSeparator,
|
||||||
|
context,
|
||||||
|
sectionCount,
|
||||||
|
itemCounter,
|
||||||
|
itemBuilder,
|
||||||
|
sectionTitleBuilder,
|
||||||
|
themeColor,
|
||||||
|
dividerThemeColor));
|
||||||
|
}
|
||||||
|
|
||||||
final int sectionCount;
|
final int sectionCount;
|
||||||
final bool hasTopSeparator;
|
final bool hasTopSeparator;
|
||||||
|
@ -132,8 +143,10 @@ class SectionStandardList extends StatelessWidget {
|
||||||
final Widget Function(BuildContext context, int sectionIndex)
|
final Widget Function(BuildContext context, int sectionIndex)
|
||||||
sectionTitleBuilder;
|
sectionTitleBuilder;
|
||||||
final List<Widget> totalRows;
|
final List<Widget> totalRows;
|
||||||
|
final Color themeColor;
|
||||||
|
final Color dividerThemeColor;
|
||||||
|
|
||||||
static List<Widget> transform(
|
List<Widget> transform(
|
||||||
bool hasTopSeparator,
|
bool hasTopSeparator,
|
||||||
BuildContext context,
|
BuildContext context,
|
||||||
int sectionCount,
|
int sectionCount,
|
||||||
|
@ -141,7 +154,9 @@ class SectionStandardList extends StatelessWidget {
|
||||||
Widget Function(BuildContext context, int sectionIndex, int itemIndex)
|
Widget Function(BuildContext context, int sectionIndex, int itemIndex)
|
||||||
itemBuilder,
|
itemBuilder,
|
||||||
Widget Function(BuildContext context, int sectionIndex)
|
Widget Function(BuildContext context, int sectionIndex)
|
||||||
sectionTitleBuilder) {
|
sectionTitleBuilder,
|
||||||
|
Color themeColor,
|
||||||
|
Color dividerThemeColor) {
|
||||||
final items = <Widget>[];
|
final items = <Widget>[];
|
||||||
|
|
||||||
for (var sectionIndex = 0; sectionIndex < sectionCount; sectionIndex++) {
|
for (var sectionIndex = 0; sectionIndex < sectionCount; sectionIndex++) {
|
||||||
|
@ -150,16 +165,12 @@ class SectionStandardList extends StatelessWidget {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (sectionTitleBuilder != null) {
|
if (sectionTitleBuilder != null) {
|
||||||
items.add(sectionTitleBuilder(context, sectionIndex));
|
items.add(buildTitle(items, sectionIndex, context));
|
||||||
}
|
}
|
||||||
|
|
||||||
final itemCount = itemCounter(sectionIndex);
|
final itemCount = itemCounter(sectionIndex);
|
||||||
|
|
||||||
for (var itemIndex = 0; itemIndex < itemCount; itemIndex++) {
|
items.addAll(buildSection(itemCount, items, sectionIndex, context));
|
||||||
final item = itemBuilder(context, sectionIndex, itemIndex);
|
|
||||||
|
|
||||||
items.add(item);
|
|
||||||
}
|
|
||||||
|
|
||||||
items.add(sectionIndex + 1 != sectionCount
|
items.add(sectionIndex + 1 != sectionCount
|
||||||
? SectionHeaderListRow()
|
? SectionHeaderListRow()
|
||||||
|
@ -169,6 +180,24 @@ class SectionStandardList extends StatelessWidget {
|
||||||
return items;
|
return items;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Widget buildTitle(
|
||||||
|
List<Widget> items, int sectionIndex, BuildContext context) {
|
||||||
|
final title = sectionTitleBuilder(context, sectionIndex);
|
||||||
|
return title;
|
||||||
|
}
|
||||||
|
|
||||||
|
List<Widget> buildSection(int itemCount, List<Widget> items, int sectionIndex,
|
||||||
|
BuildContext context) {
|
||||||
|
final List<Widget> section = [];
|
||||||
|
|
||||||
|
for (var itemIndex = 0; itemIndex < itemCount; itemIndex++) {
|
||||||
|
final item = itemBuilder(context, sectionIndex, itemIndex);
|
||||||
|
|
||||||
|
section.add(item);
|
||||||
|
}
|
||||||
|
return section;
|
||||||
|
}
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return ListView.separated(
|
return ListView.separated(
|
||||||
|
|
Loading…
Reference in a new issue