Skip to content

Commit f50a4b9

Browse files
nb312nb312
authored
Merge pull request #5 from nb312/dev
comply the page 13 of group 5
2 parents 8d07703 + 5895ee9 commit f50a4b9

14 files changed

+280
-10
lines changed

‎images/feed/feed13_header1.png

17.3 KB
Loading

‎images/feed/feed13_header2.png

13.7 KB
Loading

‎images/feed/feed13_header3.png

14.7 KB
Loading

‎images/feed/feed13_pic1.png

55 KB
Loading

‎images/feed/feed13_pic2.png

49 KB
Loading

‎images/feed/feed13_pic3.png

65.1 KB
Loading

‎images/feed/feed13_pic4.png

44.1 KB
Loading

‎lib/const/color_const.dart

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,11 @@ const DARK_COLOR = Color(0xFFBDBDBD);
1010
const BOTTOM_COLORS = [MAIN_COLOR, DARK_COLOR];
1111
const YELLOW = Color(0xfffbed96);
1212
const BLUE = Color(0xffabecd6);
13+
const BLUE_DEEP = Color(0xffA8CBFD);
14+
const BLUE_LIGHT = Color(0xffAED3EA);
1315
const PURPLE = Color(0xffccc3fc);
1416
const RED = Color(0xffF2A7B3);
1517
const GREEN = Color(0xffc7e5b4);
1618
const RED_LIGHT = Color(0xffFFC3A0);
1719
const TEXT_BLACK = Color(0xFF353535);
20+
const TEXT_BLACK_LIGHT = Color(0xFF34323D);

‎lib/page/feed/FeedPageEleven.dart

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,9 +29,14 @@ class _FeedState extends State<FeedPageEleven>
2929
});
3030
}
3131

32-
Widget _textBack(content, {size = TEXT_SMALL_2_SIZE, isBold = false}) => Text(
32+
Widget _textBack(content,
33+
{color = TEXT_BLACK_LIGHT,
34+
size = TEXT_SMALL_2_SIZE,
35+
isBold = false}) =>
36+
Text(
3337
content,
3438
style: TextStyle(
39+
color: color,
3540
fontSize: SizeUtil.getAxisBoth(size),
3641
fontWeight: isBold ? FontWeight.w700 : null),
3742
);

‎lib/page/feed/FeedPageTen.dart

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@ class _FeedState extends State<FeedPageTen> {
101101
"added 127 new photos to the Lorem Ipsum dolr sit amet.")
102102
],
103103
style: TextStyle(
104-
color: TEXT_BLACK,
104+
color: TEXT_BLACK_LIGHT,
105105
fontSize: SizeUtil.getAxisBoth(TEXT_NORMAL_SIZE),
106106
),
107107
),
@@ -114,7 +114,7 @@ class _FeedState extends State<FeedPageTen> {
114114
child: Text(
115115
"1 MINUTE",
116116
style: TextStyle(
117-
color: TEXT_BLACK,
117+
color: TEXT_BLACK_LIGHT,
118118
fontSize: SizeUtil.getAxisBoth(TEXT_SMALL_SIZE)),
119119
),
120120
);
@@ -138,7 +138,7 @@ class _FeedState extends State<FeedPageTen> {
138138
child: Text(
139139
"LOREM IPSUM",
140140
style: TextStyle(
141-
color: TEXT_BLACK,
141+
color: TEXT_BLACK_LIGHT,
142142
fontSize: SizeUtil.getAxisBoth(TEXT_LARGE_SIZE),
143143
fontWeight: FontWeight.w700),
144144
),
@@ -152,7 +152,7 @@ class _FeedState extends State<FeedPageTen> {
152152
child: Text(
153153
"Cras quis nulla com, aliquam lectus sed, blandit augue. Duis tincidunt urna non pretium",
154154
style: TextStyle(
155-
color: TEXT_BLACK,
155+
color: TEXT_BLACK_LIGHT,
156156
fontSize: SizeUtil.getAxisBoth(TEXT_NORMAL_SIZE),
157157
),
158158
),

‎lib/page/feed/FeedPageThirteen.dart

Lines changed: 229 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,246 @@
44
/// Email: niebin312@gmail.com
55
///
66
import "package:flutter/material.dart";
7+
import 'top_title.dart';
8+
import 'package:flutter_ui_nice/util/SizeUtil.dart';
9+
import 'package:flutter_ui_nice/util/GradientUtil.dart';
10+
import 'feed_const.dart';
11+
import 'package:flutter_ui_nice/const/color_const.dart';
12+
13+
const posts = [
14+
{
15+
"header": FeedImage.feed13_header1,
16+
"name": "Katherine Farmer",
17+
"time": "1 hour ago",
18+
"desc": "Decorate For Less With Art Posters",
19+
"like": "123",
20+
"chat": "67",
21+
"share": "12",
22+
"images": [
23+
FeedImage.feed13_pic1,
24+
FeedImage.feed13_pic2,
25+
FeedImage.feed13_pic3,
26+
FeedImage.feed13_pic4,
27+
]
28+
},
29+
{
30+
"header": FeedImage.feed13_header2,
31+
"name": "Tyler Guerrero",
32+
"time": "2 hour ago",
33+
"desc": "",
34+
"like": "123",
35+
"chat": "67",
36+
"share": "12",
37+
"images": [
38+
FeedImage.feed13_pic1,
39+
FeedImage.feed13_pic2,
40+
FeedImage.feed13_pic3,
41+
FeedImage.feed13_pic4,
42+
]
43+
},
44+
{
45+
"header": FeedImage.feed13_header3,
46+
"name": "Hettie Nguyen",
47+
"time": "3 hour ago",
48+
"desc": "Decorate For Less With Art Posters",
49+
"like": "123",
50+
"chat": "67",
51+
"share": "12",
52+
"images": [
53+
FeedImage.feed13_pic1,
54+
FeedImage.feed13_pic2,
55+
FeedImage.feed13_pic3,
56+
FeedImage.feed13_pic4,
57+
]
58+
},
59+
{
60+
"header": FeedImage.feed13_header1,
61+
"name": "Katherine Farmer",
62+
"time": "4 hour ago",
63+
"desc": "",
64+
"like": "123",
65+
"chat": "67",
66+
"share": "12",
67+
"images": [
68+
FeedImage.feed13_pic1,
69+
FeedImage.feed13_pic2,
70+
FeedImage.feed13_pic3,
71+
FeedImage.feed13_pic4,
72+
]
73+
}
74+
];
775

876
class FeedPageThirteen extends StatefulWidget {
977
@override
1078
_FeedState createState() => _FeedState();
1179
}
1280

1381
class _FeedState extends State<FeedPageThirteen> {
82+
Widget _textBack(content,
83+
{color = TEXT_BLACK_LIGHT,
84+
size = TEXT_SMALL_2_SIZE,
85+
isBold = false}) =>
86+
Text(
87+
content,
88+
style: TextStyle(
89+
color: color,
90+
fontSize: SizeUtil.getAxisBoth(size),
91+
fontWeight: isBold ? FontWeight.w700 : null),
92+
);
93+
94+
Widget _itemHeader(item) => Container(
95+
child: Row(
96+
mainAxisAlignment: MainAxisAlignment.start,
97+
crossAxisAlignment: CrossAxisAlignment.start,
98+
children: <Widget>[
99+
Image.asset(
100+
item["header"],
101+
height: SizeUtil.getAxisBoth(84.0),
102+
width: SizeUtil.getAxisBoth(84.0),
103+
),
104+
SizedBox(
105+
width: SizeUtil.getAxisX(51.0),
106+
),
107+
Column(
108+
mainAxisAlignment: MainAxisAlignment.start,
109+
crossAxisAlignment: CrossAxisAlignment.start,
110+
children: <Widget>[
111+
_textBack(item["name"], size: TEXT_SMALL_3_SIZE, isBold: true),
112+
SizedBox(
113+
height: SizeUtil.getAxisY(13.0),
114+
),
115+
_textBack(item["time"], size: TEXT_NORMAL_SIZE),
116+
],
117+
)
118+
],
119+
),
120+
);
121+
122+
//
123+
Widget _itemAction(item) => Row(
124+
mainAxisAlignment: MainAxisAlignment.start,
125+
crossAxisAlignment: CrossAxisAlignment.center,
126+
children: <Widget>[
127+
_actionChild(Icons.favorite_border, item["like"]),
128+
SizedBox(width: SizeUtil.getAxisX(75.0)),
129+
_actionChild(Icons.chat, item["chat"]),
130+
SizedBox(width: SizeUtil.getAxisX(75.0)),
131+
_actionChild(Icons.share, item["share"]),
132+
],
133+
);
134+
135+
Widget _actionChild(icon, value) => Row(
136+
children: <Widget>[
137+
Icon(
138+
icon,
139+
color: TEXT_BLACK_LIGHT,
140+
size: SizeUtil.getAxisBoth(30.0),
141+
),
142+
SizedBox(width: SizeUtil.getAxisX(20.0)),
143+
_textBack(value),
144+
],
145+
);
146+
147+
Widget _backCard(isEmpty) => Container(
148+
decoration: BoxDecoration(
149+
gradient: !isEmpty ? GradientUtil.red() : GradientUtil.blue(),
150+
borderRadius: BorderRadius.circular(
151+
SizeUtil.getAxisBoth(22.0),
152+
),
153+
boxShadow: [
154+
BoxShadow(color: Color(0x11000000), offset: Offset(0.1, 4.0))
155+
]),
156+
margin: EdgeInsets.only(
157+
left: SizeUtil.getAxisX(80.0), right: SizeUtil.getAxisX(40.0)),
158+
);
159+
160+
Widget _itemText(item) => Container(
161+
child: _textBack(item["desc"], size: TEXT_SMALL_3_SIZE),
162+
);
163+
164+
Widget _itemImages(item) => Container(
165+
alignment: AlignmentDirectional.center,
166+
constraints: BoxConstraints.expand(height: SizeUtil.getAxisY(170.0)),
167+
child: ListView.builder(
168+
itemBuilder: (context, index) {
169+
var img = item["images"][index];
170+
return Container(
171+
margin: EdgeInsets.only(
172+
left: SizeUtil.getAxisX(20.0),
173+
right: SizeUtil.getAxisX(20.0),
174+
),
175+
child: Image.asset(
176+
img,
177+
width: SizeUtil.getAxisBoth(170.0),
178+
height: SizeUtil.getAxisBoth(170.0),
179+
),
180+
);
181+
},
182+
itemCount: item["images"].length,
183+
scrollDirection: Axis.horizontal,
184+
),
185+
);
186+
187+
Widget _listItem(item) => Container(
188+
constraints: BoxConstraints.expand(
189+
height: SizeUtil.getAxisY(
190+
item["desc"].toString().isNotEmpty ? 350.0 : 469.0),
191+
),
192+
margin: EdgeInsets.only(top: SizeUtil.getAxisY(40.0)),
193+
child: Stack(
194+
children: <Widget>[
195+
_backCard(item["desc"].toString().isEmpty),
196+
Positioned(
197+
left: SizeUtil.getAxisX(25.0),
198+
top: SizeUtil.getAxisY(46.0),
199+
child: _itemHeader(item),
200+
),
201+
Positioned(
202+
left: SizeUtil.getAxisX(162.0),
203+
bottom: SizeUtil.getAxisY(45.0),
204+
child: _itemAction(item),
205+
),
206+
item["desc"].toString().isEmpty
207+
? Container(
208+
margin: EdgeInsets.only(top: SizeUtil.getAxisY(20.0)),
209+
alignment: AlignmentDirectional.center,
210+
child: _itemImages(item),
211+
)
212+
: Positioned(
213+
top: SizeUtil.getAxisY(156.0),
214+
left: SizeUtil.getAxisX(160.0),
215+
height: SizeUtil.getAxisY(70.0),
216+
child: _itemText(item),
217+
),
218+
],
219+
),
220+
);
221+
222+
Widget _body() => ListView.builder(
223+
itemBuilder: (context, index) {
224+
var item = posts[index % posts.length];
225+
return _listItem(item);
226+
},
227+
itemCount: posts.length,
228+
padding: EdgeInsets.only(top: 0.1),
229+
);
230+
14231
@override
15232
Widget build(BuildContext context) {
16233
return Scaffold(
17-
appBar: AppBar(
18-
title: Text("Feed Thirteen"),
234+
body: Container(
235+
decoration: BoxDecoration(gradient: GradientUtil.yellowGreen()),
236+
child: Column(
237+
children: <Widget>[
238+
TopTitleBar(
239+
rightImage: FeedImage.feed_add,
240+
),
241+
Expanded(
242+
child: _body(),
243+
)
244+
],
245+
),
19246
),
20-
body: Text("Feed page Thirteen"),
21247
);
22248
}
23249
}

‎lib/page/feed/FeedPageTwelve.dart

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,14 @@ class FeedPageTwelve extends StatefulWidget {
1515
}
1616

1717
class _FeedState extends State<FeedPageTwelve> {
18-
Widget _textBack(content, {size = TEXT_SMALL_2_SIZE, isBold = false}) => Text(
18+
Widget _textBack(content,
19+
{color = TEXT_BLACK_LIGHT,
20+
size = TEXT_SMALL_2_SIZE,
21+
isBold = false}) =>
22+
Text(
1923
content,
2024
style: TextStyle(
25+
color: color,
2126
fontSize: SizeUtil.getAxisBoth(size),
2227
fontWeight: isBold ? FontWeight.w700 : null),
2328
);
@@ -42,7 +47,7 @@ class _FeedState extends State<FeedPageTwelve> {
4247
Icon(
4348
icon,
4449
size: SizeUtil.getAxisBoth(30.0),
45-
color: TEXT_BLACK,
50+
color: TEXT_BLACK_LIGHT,
4651
),
4752
SizedBox(height: SizeUtil.getAxisY(26.0)),
4853
_textBack(value)

‎lib/page/feed/feed_const.dart

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,10 +34,21 @@ class FeedImage {
3434
static const feed12_pic2 = "$IMAGE_PATH/feed12_pic2.png";
3535
static const feed12_header = "$IMAGE_PATH/feed12_header.png";
3636
static const feed12_plus = "$IMAGE_PATH/feed12_plus.png";
37+
3738
//Images for Feed1
3839
static const feed1_avatar1 = "$IMAGE_PATH/feed1_avatar1.png";
3940
static const feed1_avatar2 = "$IMAGE_PATH/feed1_avatar2.png";
4041
static const landscape = "$IMAGE_PATH/landscape.png";
4142
static const menonglass = "$IMAGE_PATH/menonglass.png";
4243
static const night = "$IMAGE_PATH/night.png";
44+
45+
//feed 13
46+
static const feed13_header1 = "$IMAGE_PATH/feed13_header1.png";
47+
static const feed13_header2 = "$IMAGE_PATH/feed13_header2.png";
48+
static const feed13_header3 = "$IMAGE_PATH/feed13_header3.png";
49+
50+
static const feed13_pic1 = "$IMAGE_PATH/feed13_pic1.png";
51+
static const feed13_pic2 = "$IMAGE_PATH/feed13_pic2.png";
52+
static const feed13_pic3 = "$IMAGE_PATH/feed13_pic3.png";
53+
static const feed13_pic4 = "$IMAGE_PATH/feed13_pic4.png";
4354
}

‎lib/util/GradientUtil.dart

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
///
2+
/// Created by NieBin on 2018/12/28
3+
/// Github: https://github.com/nb312
4+
/// Email: niebin312@gmail.com
5+
///
6+
import "package:flutter/material.dart";
7+
import 'package:flutter_ui_nice/const/color_const.dart';
8+
9+
class GradientUtil {
10+
static LinearGradient _getLinearGradient(left, right) =>
11+
LinearGradient(colors: [left, right]);
12+
13+
static LinearGradient yellowGreen() => _getLinearGradient(YELLOW, GREEN);
14+
15+
static LinearGradient red() => _getLinearGradient(RED_LIGHT, RED);
16+
17+
static LinearGradient yellowBlue() => _getLinearGradient(YELLOW, BLUE);
18+
19+
static LinearGradient blue() => _getLinearGradient(BLUE_LIGHT, BLUE_DEEP);
20+
}

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy