feat: settings table view style

This commit is contained in:
Rongjian Zhang
2019-09-04 22:37:22 +08:00
parent f3b547668c
commit 7f9669eaea
2 changed files with 126 additions and 113 deletions

View File

@@ -23,73 +23,64 @@ class _SettingsScreenState extends State<SettingsScreen> {
bodyBuilder: () {
return Column(
children: <Widget>[
TableView(
title: 'ACCOUNTS',
items: [
TableViewItem(
text: 'Switch to another account',
screenBuilder: (_) => LoginScreen(),
),
],
),
TableView(
title: 'THEME',
items: [
TableViewItem(
text: 'material',
checked: themeProvider.theme == ThemeMap.material,
onTap: () {
if (themeProvider.theme != ThemeMap.material) {
themeProvider.setTheme(ThemeMap.material);
}
},
),
TableViewItem(
text: 'cupertino',
checked: themeProvider.theme == ThemeMap.cupertino,
onTap: () {
if (themeProvider.theme != ThemeMap.cupertino) {
themeProvider.setTheme(ThemeMap.cupertino);
}
},
),
],
),
TableView(
title: 'REVIEW',
items: [
TableViewItem(
text: 'Review',
onTap: () {
LaunchReview.launch(
androidAppId: 'io.github.pd4d10.gittouch',
iOSAppId: '1452042346',
);
},
)
],
),
TableView(
title: 'SOURCE CODE',
items: [
TableViewItem(
text: 'pd4d10/git-touch',
screenBuilder: (_) => RepoScreen('pd4d10', 'git-touch'),
)
],
),
TableView(
title: 'LICENSE',
items: [
TableViewItem(
text: 'MIT',
onTap: () {
launch(
'https://github.com/pd4d10/git-touch/blob/master/LICENSE');
},
)
],
)
TableViewSeperator(),
TableView(headerText: 'ACCOUNTS', items: [
TableViewItem(
text: 'Switch to another account',
screenBuilder: (_) => LoginScreen(),
),
]),
TableViewSeperator(),
TableView(headerText: 'THEME', items: [
TableViewItem(
text: 'material',
checked: themeProvider.theme == ThemeMap.material,
onTap: () {
if (themeProvider.theme != ThemeMap.material) {
themeProvider.setTheme(ThemeMap.material);
}
},
),
TableViewItem(
text: 'cupertino',
checked: themeProvider.theme == ThemeMap.cupertino,
onTap: () {
if (themeProvider.theme != ThemeMap.cupertino) {
themeProvider.setTheme(ThemeMap.cupertino);
}
},
),
]),
TableViewSeperator(),
TableView(headerText: 'REVIEW', items: [
TableViewItem(
text: 'Review',
onTap: () {
LaunchReview.launch(
androidAppId: 'io.github.pd4d10.gittouch',
iOSAppId: '1452042346',
);
},
)
]),
TableViewSeperator(),
TableView(headerText: 'SOURCE CODE', items: [
TableViewItem(
text: 'pd4d10/git-touch',
screenBuilder: (_) => RepoScreen('pd4d10', 'git-touch'),
)
]),
TableViewSeperator(),
TableView(headerText: 'LICENSE', items: [
TableViewItem(
text: 'MIT',
onTap: () {
launch(
'https://github.com/pd4d10/git-touch/blob/master/LICENSE');
},
)
]),
TableViewSeperator(),
],
);
},

View File

@@ -1,7 +1,19 @@
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:git_touch/utils/utils.dart';
import 'package:primer/primer.dart';
import 'link.dart';
class TableViewSeperator extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
height: 20,
color: PrimerColors.gray100,
);
}
}
class TableViewItem {
final String text;
final bool checked;
@@ -17,63 +29,73 @@ class TableViewItem {
}
class TableView extends StatelessWidget {
final String title;
final String headerText;
final List<TableViewItem> items;
TableView({this.title, this.items});
TableView({this.headerText, @required this.items});
static const _border = SizedBox(
height: 1,
child: const DecoratedBox(
decoration: const BoxDecoration(color: PrimerColors.gray200),
),
);
static const _seperator = SizedBox(
height: 1,
child: const DecoratedBox(
decoration: const BoxDecoration(color: PrimerColors.gray200),
),
);
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.only(top: 30),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
padding: EdgeInsets.only(left: 8),
child: Text(
title,
style: TextStyle(
color: Colors.black54,
fontSize: 15,
fontWeight: FontWeight.w500,
),
),
),
Container(
decoration: BoxDecoration(
border: Border(bottom: BorderSide(color: Colors.black12)),
),
padding: EdgeInsets.only(top: 4),
),
...items.map((item) {
List<Widget> children = [
Expanded(
child: Text(
item.text,
style: TextStyle(fontSize: 18, fontWeight: FontWeight.w300),
),
),
];
if (item.checked) {
children
.add(Icon(Icons.check, color: CupertinoColors.activeBlue));
}
return Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
...(headerText == null
? []
: [
Container(
color: PrimerColors.gray100,
padding: EdgeInsets.symmetric(horizontal: 12, vertical: 6),
child: Text(
headerText,
style: TextStyle(color: PrimerColors.gray600, fontSize: 13),
),
)
]),
_border,
...join(
_seperator,
items.map((item) {
return Link(
onTap: item.onTap,
screenBuilder: item.screenBuilder,
child: Container(
decoration: BoxDecoration(
border: Border(bottom: BorderSide(color: Colors.black12)),
),
padding: EdgeInsets.all(12),
child: Row(children: children),
height: 44,
child: Row(children: [
SizedBox(width: 12),
Expanded(
child: Text(
item.text,
style: TextStyle(fontSize: 18),
),
),
...(item.checked
? [
Icon(Icons.check,
color: CupertinoColors.activeBlue, size: 20)
]
: []),
SizedBox(width: 12),
]),
),
);
}).toList()
],
),
}).toList(),
),
_border,
],
);
}
}