feat: user screen style

This commit is contained in:
Rongjian Zhang 2019-02-04 18:32:39 +08:00
parent f1414057e0
commit 7a18277ac2
6 changed files with 147 additions and 101 deletions

View File

@ -0,0 +1,14 @@
import 'package:flutter/material.dart';
/// Repos of user
class ReposScreen extends StatefulWidget {
@override
_ReposScreenState createState() => _ReposScreenState();
}
class _ReposScreenState extends State<ReposScreen> {
@override
Widget build(BuildContext context) {
return Container();
}
}

View File

@ -5,8 +5,29 @@ import '../widgets/avatar.dart';
import '../widgets/link.dart';
import '../widgets/list_group.dart';
import '../widgets/repo_item.dart';
import '../screens/repos.dart';
import '../utils/utils.dart';
var repoChunk = '''
owner {
login
}
name
description
isPrivate
isFork
stargazers {
totalCount
}
forks {
totalCount
}
primaryLanguage {
color
name
}
''';
Future queryUser(String login) async {
var data = await query('''
{
@ -27,40 +48,12 @@ Future queryUser(String login) async {
repositories(first: 6, ownerAffiliations: OWNER, orderBy: {field: STARGAZERS, direction: DESC}) {
totalCount
nodes {
owner {
login
}
name
description
stargazers {
totalCount
}
forks {
totalCount
}
primaryLanguage {
color
name
}
$repoChunk
}
}
pinnedRepositories(first: 6) {
nodes {
owner {
login
}
name
description
stargazers {
totalCount
}
forks {
totalCount
}
primaryLanguage {
color
name
}
$repoChunk
}
}
}
@ -83,6 +76,42 @@ class UserScreen extends StatefulWidget {
class _UserScreenState extends State<UserScreen> {
Map<String, dynamic> payload = {};
Widget _buildEntry(int count, String text) {
return Expanded(
flex: 1,
child: Link(
child: Container(
padding: EdgeInsets.symmetric(vertical: 10),
child: Column(
children: <Widget>[
Text(count.toString()),
Text(text, style: TextStyle(fontSize: 13))
],
),
),
onTap: () {},
),
);
}
Widget _buildRepos() {
String title;
List items;
if (payload['pinnedRepositories']['nodes'].length == 0) {
title = 'Popular repositories';
items = payload['repositories']['nodes'];
} else {
title = 'Pinned repositories';
items = payload['pinnedRepositories']['nodes'];
}
return ListGroup(
title: Text(title),
items: items,
itemBuilder: (item) => RepoItem(item),
);
}
@override
Widget build(BuildContext context) {
return RefreshScaffold(
@ -113,7 +142,8 @@ class _UserScreenState extends State<UserScreen> {
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(payload['name'], style: TextStyle(height: 1.2)),
Text(payload['name'] ?? widget.login,
style: TextStyle(height: 1.2)),
Padding(padding: EdgeInsets.only(top: 10)),
Row(children: <Widget>[
Icon(
@ -135,59 +165,22 @@ class _UserScreenState extends State<UserScreen> {
),
),
Container(
padding: EdgeInsets.all(10),
// padding: EdgeInsets.all(10),
decoration: BoxDecoration(
border: Border(bottom: BorderSide(color: Colors.black12))),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Link(
child: Column(
children: <Widget>[
Text(payload['repositories']['totalCount'].toString()),
Text('Repos')
],
),
onTap: () {},
),
Link(
child: Column(
children: <Widget>[
Text(payload['starredRepositories']['totalCount']
.toString()),
Text('Stars')
],
),
onTap: () {},
),
Link(
child: Column(
children: <Widget>[
Text(payload['followers']['totalCount'].toString()),
Text('Followers'),
],
),
onTap: () {
// print(1);
},
),
Link(
child: Column(
children: <Widget>[
Text(payload['following']['totalCount'].toString()),
Text('Following')
],
),
onTap: () {},
),
_buildEntry(
payload['repositories']['totalCount'], 'Repositories'),
_buildEntry(
payload['starredRepositories']['totalCount'], 'Stars'),
_buildEntry(payload['followers']['totalCount'], 'Followers'),
_buildEntry(payload['following']['totalCount'], 'Following'),
],
),
),
ListGroup(
title: Text('Repos'),
items: payload['repositories']['nodes'],
itemBuilder: (item) => RepoItem(item),
)
_buildRepos(),
],
);
},

View File

@ -6,6 +6,13 @@ export 'github.dart';
export 'octicons.dart';
export 'timeago.dart';
Color convertColor(String cssHex) {
if (cssHex.startsWith('#')) {
cssHex = cssHex.substring(1);
}
return Color(int.parse('ff' + cssHex, radix: 16));
}
TextSpan createLinkSpan(BuildContext context, String text, Function handle) {
return TextSpan(
text: text,

View File

@ -27,7 +27,7 @@ class ListGroup<T> extends StatelessWidget {
children: <Widget>[
Container(
padding: EdgeInsets.all(4),
color: Colors.black12,
color: Color(0x10000000),
child: title,
),
Column(children: items.map(_buildItem).toList())

View File

@ -8,33 +8,66 @@ class RepoItem extends StatelessWidget {
RepoItem(this.item);
IconData _buildIconData() {
if (item['isPrivate']) {
return Octicons.lock;
}
if (item['isFork']) {
return Octicons.repo_forked;
}
return Octicons.repo;
}
@override
Widget build(BuildContext context) {
return Link(
onTap: () {},
child: Padding(
padding: EdgeInsets.all(10),
child: Column(
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(item['name'], style: TextStyle(fontWeight: FontWeight.w600)),
Padding(padding: EdgeInsets.only(top: 4)),
Text(item['description']),
Padding(padding: EdgeInsets.only(top: 4)),
DefaultTextStyle(
style: TextStyle(color: Colors.black54),
child: Row(
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Icon(Octicons.star, size: 16, color: Colors.black54),
Text(item['stargazers']['totalCount'].toString()),
Padding(padding: EdgeInsets.only(left: 8)),
Icon(Octicons.repo_forked, size: 16, color: Colors.black54),
Text(item['forks']['totalCount'].toString()),
Padding(padding: EdgeInsets.only(left: 8)),
Text(item['primaryLanguage']['name'])
Text(
item['name'],
style: TextStyle(fontWeight: FontWeight.w600, fontSize: 15),
),
Padding(padding: EdgeInsets.only(top: 6)),
Text(item['description']),
Padding(padding: EdgeInsets.only(top: 6)),
DefaultTextStyle(
style: TextStyle(color: Colors.black54, fontSize: 13),
child: Row(
children: <Widget>[
Icon(Octicons.star, size: 14, color: Colors.black54),
Text(item['stargazers']['totalCount'].toString()),
Padding(padding: EdgeInsets.only(left: 16)),
Icon(Octicons.repo_forked,
size: 14, color: Colors.black54),
Text(item['forks']['totalCount'].toString()),
Padding(padding: EdgeInsets.only(left: 16)),
Container(
width: 10,
height: 10,
decoration: new BoxDecoration(
color:
convertColor(item['primaryLanguage']['color']),
shape: BoxShape.circle,
),
),
Padding(padding: EdgeInsets.only(left: 4)),
Text(item['primaryLanguage']['name']),
],
),
)
],
),
)
),
Padding(padding: EdgeInsets.only(left: 4)),
Icon(_buildIconData(), size: 20, color: Colors.black54),
],
),
),

View File

@ -51,14 +51,13 @@ class TimelineItem extends StatelessWidget {
return TextSpan(
text: item['label']['name'],
style: TextStyle(
color: textColor,
// https://github.com/flutter/flutter/issues/20430
background: Paint()
..color = Color(int.parse('ff' + item['label']['color'], radix: 16))
// https://stackoverflow.com/a/52592679
// ..strokeWidth = 16.5
// ..style = PaintingStyle.stroke
),
color: textColor,
// https://github.com/flutter/flutter/issues/20430
background: Paint()..color = convertColor(item['label']['color']),
// https://stackoverflow.com/a/52592679
// ..strokeWidth = 16.5
// ..style = PaintingStyle.stroke
),
);
}