Skip to content
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit 996d2aa

Browse files
nb312nb312
authoredDec 28, 2018
Merge pull request #3 from nb312/dev
comply the 12 page of group 5
2 parents 8d33f94 + 239d900 commit 996d2aa

File tree

7 files changed

+156
-6
lines changed

7 files changed

+156
-6
lines changed
 

‎images/feed/feed12_header.png

13.8 KB
Loading

‎images/feed/feed12_pic1.png

472 KB
Loading

‎images/feed/feed12_pic2.png

463 KB
Loading

‎images/feed/feed12_plus.png

5.85 KB
Loading

‎lib/page/feed/FeedPageTwelve.dart

Lines changed: 143 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,159 @@
44
/// Email: niebin312@gmail.com
55
///
66
import "package:flutter/material.dart";
7+
import 'feed_const.dart';
8+
import 'top_title.dart';
9+
import 'package:flutter_ui_nice/util/SizeUtil.dart';
10+
import 'package:flutter_ui_nice/const/color_const.dart';
711

812
class FeedPageTwelve extends StatefulWidget {
913
@override
1014
_FeedState createState() => _FeedState();
1115
}
1216

1317
class _FeedState extends State<FeedPageTwelve> {
18+
Widget _textBack(content, {size = TEXT_SMALL_2_SIZE, isBold = false}) => Text(
19+
content,
20+
style: TextStyle(
21+
fontSize: SizeUtil.getAxisBoth(size),
22+
fontWeight: isBold ? FontWeight.w700 : null),
23+
);
24+
25+
Widget _listItemName() => Container(
26+
alignment: AlignmentDirectional.bottomStart,
27+
child: Column(
28+
mainAxisAlignment: MainAxisAlignment.end,
29+
crossAxisAlignment: CrossAxisAlignment.start,
30+
children: <Widget>[
31+
_textBack("Hristo Hristov", size: TEXT_SMALL_3_SIZE, isBold: true),
32+
SizedBox(height: SizeUtil.getAxisY(13.0)),
33+
_textBack("4 hours ago", size: TEXT_NORMAL_SIZE),
34+
],
35+
),
36+
);
37+
38+
Widget _action(icon, value) => Column(
39+
mainAxisAlignment: MainAxisAlignment.start,
40+
crossAxisAlignment: CrossAxisAlignment.center,
41+
children: <Widget>[
42+
Icon(
43+
icon,
44+
size: SizeUtil.getAxisBoth(30.0),
45+
color: TEXT_BLACK,
46+
),
47+
SizedBox(height: SizeUtil.getAxisY(26.0)),
48+
_textBack(value)
49+
],
50+
);
51+
52+
Widget _listItemAction() => Container(
53+
child: Column(
54+
mainAxisAlignment: MainAxisAlignment.start,
55+
crossAxisAlignment: CrossAxisAlignment.center,
56+
children: <Widget>[
57+
_action(Icons.favorite_border, "233"),
58+
SizedBox(height: SizeUtil.getAxisY(56.0)),
59+
_action(Icons.chat, "35"),
60+
SizedBox(height: SizeUtil.getAxisY(56.0)),
61+
_action(Icons.share, "12"),
62+
SizedBox(height: SizeUtil.getAxisY(56.0)),
63+
_action(Icons.more_vert, ""),
64+
]),
65+
);
66+
67+
Widget _listItem(index) => Container(
68+
height: SizeUtil.getAxisY(740.0),
69+
decoration: BoxDecoration(
70+
gradient: index % 2 == 1
71+
? LinearGradient(
72+
colors: [Color(0x55FFFFFF), Colors.transparent])
73+
: null),
74+
padding: EdgeInsets.only(
75+
top: SizeUtil.getAxisY(40.0), bottom: SizeUtil.getAxisY(20.0)),
76+
child: Container(
77+
child: Stack(
78+
children: <Widget>[
79+
Container(
80+
height: SizeUtil.getAxisY(550.0),
81+
width: SizeUtil.getAxisX(613.0),
82+
child: Image.asset(
83+
index % 2 == 0 ? FeedImage.feed12_pic1 : FeedImage.feed12_pic2,
84+
fit: BoxFit.cover,
85+
height: SizeUtil.getAxisY(550.0),
86+
width: SizeUtil.getAxisX(613.0),
87+
),
88+
),
89+
Positioned(
90+
width: SizeUtil.getAxisBoth(CIRCLE_BUTTON_HEIGHT),
91+
height: SizeUtil.getAxisBoth(CIRCLE_BUTTON_HEIGHT),
92+
left: SizeUtil.getAxisX(24.0),
93+
bottom: SizeUtil.getAxisY(89.0),
94+
child: Image.asset(
95+
FeedImage.feed12_header,
96+
fit: BoxFit.cover,
97+
),
98+
),
99+
Positioned(
100+
left: SizeUtil.getAxisX(160.0),
101+
bottom: SizeUtil.getAxisY(10.0),
102+
child: _listItemName(),
103+
),
104+
Positioned(
105+
right: SizeUtil.getAxisX(40.0),
106+
top: SizeUtil.getAxisY(40.0),
107+
child: _listItemAction(),
108+
)
109+
],
110+
)),
111+
);
112+
113+
Widget _body() => ListView.builder(
114+
itemBuilder: (context, index) {
115+
return _listItem(index);
116+
},
117+
itemCount: 4,
118+
padding: EdgeInsets.only(top: 0.1),
119+
);
120+
14121
@override
15122
Widget build(BuildContext context) {
16123
return Scaffold(
17-
appBar: AppBar(
18-
title: Text("Feed Twelve"),
124+
body: Container(
125+
decoration: BoxDecoration(
126+
gradient: LinearGradient(
127+
colors: [YELLOW, GREEN],
128+
begin: Alignment.topLeft,
129+
end: Alignment.centerLeft)),
130+
child: Column(
131+
mainAxisAlignment: MainAxisAlignment.start,
132+
crossAxisAlignment: CrossAxisAlignment.start,
133+
children: <Widget>[
134+
TopTitleBar(),
135+
Expanded(
136+
child: Stack(
137+
children: <Widget>[
138+
_body(),
139+
Positioned(
140+
width: SizeUtil.width,
141+
bottom: SizeUtil.getAxisY(41.0),
142+
child: Row(
143+
mainAxisAlignment: MainAxisAlignment.center,
144+
crossAxisAlignment: CrossAxisAlignment.center,
145+
children: <Widget>[
146+
FloatingActionButton(
147+
onPressed: () {
148+
print("you have pressed the button");
149+
},
150+
child: Image.asset(FeedImage.feed12_plus),
151+
)
152+
],
153+
),
154+
)
155+
],
156+
),
157+
),
158+
],
19159
),
20-
body: Text("Feed page Twelve"),
21-
);
160+
));
22161
}
23162
}

‎lib/page/feed/feed_const.dart

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,4 +29,8 @@ class FeedImage {
2929
static const feed11_city1 = "$IMAGE_PATH/feed11-city1.png";
3030
static const feed11_city2 = "$IMAGE_PATH/feed11-city2.png";
3131
static const feed11_header = "$IMAGE_PATH/feed11-header.png";
32+
static const feed12_pic1 = "$IMAGE_PATH/feed12_pic1.png";
33+
static const feed12_pic2 = "$IMAGE_PATH/feed12_pic2.png";
34+
static const feed12_header = "$IMAGE_PATH/feed12_header.png";
35+
static const feed12_plus = "$IMAGE_PATH/feed12_plus.png";
3236
}

‎lib/page/feed/top_title.dart

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,13 @@ import 'package:flutter_ui_nice/const/color_const.dart';
99
import 'package:flutter_ui_nice/util/SizeUtil.dart';
1010

1111
class TopTitleBar extends StatelessWidget {
12+
TopTitleBar(
13+
{this.leftImage = FeedImage.more_circle,
14+
this.rightImage = FeedImage.search_circle});
15+
16+
final String leftImage;
17+
final String rightImage;
18+
1219
@override
1320
Widget build(BuildContext context) {
1421
return Container(
@@ -40,10 +47,10 @@ class TopTitleBar extends StatelessWidget {
4047
child: Row(
4148
mainAxisAlignment: MainAxisAlignment.spaceBetween,
4249
children: <Widget>[
43-
Image.asset(FeedImage.more_circle,
50+
Image.asset(leftImage,
4451
width: SizeUtil.getAxisY(CIRCLE_BUTTON_HEIGHT),
4552
height: SizeUtil.getAxisY(CIRCLE_BUTTON_HEIGHT)),
46-
Image.asset(FeedImage.search_circle,
53+
Image.asset(rightImage,
4754
width: SizeUtil.getAxisY(CIRCLE_BUTTON_HEIGHT),
4855
height: SizeUtil.getAxisY(CIRCLE_BUTTON_HEIGHT))
4956
]),

0 commit comments

Comments
 (0)
Please sign in to comment.