Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 50e501b

Browse files
author
wz
committed
todo how to fix gridview overflow
1 parent 5f77e3a commit 50e501b

7 files changed

Lines changed: 205 additions & 10 deletions

File tree

‎lib/dao/home_dao.dart‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,13 @@ import 'package:dio/dio.dart';
22
import 'package:new_fl/models/video_model.dart';
33

44
class HomeDao {
5-
static get() async {
5+
static Future<HomeModel> get() async {
66
var reponse = await Dio().get(
77
'http://api.bilibili.com/x/web-interface/archive/related',
88
queryParameters: {'aid': 7});
99

1010
var homeModel = HomeModel.fromJson(reponse.data);
1111
print('homedao= ${reponse.data}');
12+
return homeModel;
1213
}
1314
}

‎lib/pages/home_category_page.dart‎

Lines changed: 42 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
11
import 'package:flutter/material.dart';
2+
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
3+
import 'package:new_fl/dao/home_dao.dart';
4+
import 'package:new_fl/models/video_model.dart';
5+
import 'package:new_fl/widget/video_card.dart';
26

37
class HomeCategoryPageRoute extends StatefulWidget {
48
const HomeCategoryPageRoute({Key? key}) : super(key: key);
@@ -8,10 +12,45 @@ class HomeCategoryPageRoute extends StatefulWidget {
812
}
913

1014
class _HomeCategoryPageRouteState extends State<HomeCategoryPageRoute> {
15+
List<VideoModel> _videos = [];
16+
@override
17+
void initState() {
18+
super.initState();
19+
20+
_loadData();
21+
}
22+
23+
Future<void> _loadData() async {
24+
var homeModel = await HomeDao.get();
25+
setState(() {
26+
_videos = homeModel.data;
27+
});
28+
}
29+
1130
@override
1231
Widget build(BuildContext context) {
13-
return Center(
14-
child: Text('AAAAA'),
15-
);
32+
return MediaQuery.removePadding(
33+
removeTop: true,
34+
context: context,
35+
child: GridView.builder(
36+
gridDelegate:
37+
SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
38+
itemCount: _videos.length,
39+
itemBuilder: (context, idx) {
40+
return VideoCard(model: _videos[idx]);
41+
})
42+
// StaggeredGridView.countBuilder(
43+
// physics: const AlwaysScrollableScrollPhysics(),
44+
// padding: const EdgeInsets.only(top: 10, left: 10, right: 10),
45+
// crossAxisCount: 2,
46+
// itemCount: _videos.length,
47+
// itemBuilder: (BuildContext context, int index) {
48+
// return VideoCard(model: _videos[index]);
49+
// },
50+
// staggeredTileBuilder: (int index) {
51+
// return const StaggeredTile.fit(1);
52+
// }
53+
// )
54+
);
1655
}
1756
}

‎lib/pages/home_page.dart‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@ class _HomePageRouteState extends State<HomePageRoute> {
1919
void initState() {
2020
super.initState();
2121

22-
HomeDao.get();
2322
// _tabController = TabController(length: _tabs.length, vsync: this);
2423
}
2524

@@ -41,10 +40,6 @@ class _HomePageRouteState extends State<HomePageRoute> {
4140
children:
4241
_tabs.map((e) => const HomeCategoryPageRoute()).toList()),
4342
),
44-
Image.asset(
45-
'images/avatar.png',
46-
width: 50,
47-
)
4843
],
4944
),
5045
),

‎lib/util/format_util.dart‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
String time2String(int seconds) {
2+
int m = (seconds / 60).truncate();
3+
int s = seconds - m * 60;
4+
if (s < 10) {
5+
return '$m:0$s';
6+
}
7+
return '$m:$s';
8+
}
9+
10+
///数字转万
11+
String countFormat(int count) {
12+
String views = "";
13+
if (count > 9999) {
14+
views = "${(count / 10000).toStringAsFixed(2)}万";
15+
} else {
16+
views = count.toString();
17+
}
18+
return views;
19+
}

‎lib/widget/video_card.dart‎

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:new_fl/models/video_model.dart';
3+
import 'package:new_fl/util/format_util.dart';
4+
5+
class VideoCard extends StatelessWidget {
6+
const VideoCard({Key? key, required this.model}) : super(key: key);
7+
8+
final VideoModel model;
9+
10+
@override
11+
Widget build(BuildContext context) {
12+
return InkWell(
13+
onTap: () {
14+
print(' tap video ${model.shortLink}');
15+
},
16+
child: SizedBox(
17+
height: 300,
18+
child: Card(
19+
margin: EdgeInsets.only(left: 4, right: 4, bottom: 8),
20+
child: ClipRRect(
21+
borderRadius: BorderRadius.circular(5),
22+
child: Column(
23+
crossAxisAlignment: CrossAxisAlignment.start,
24+
children: [_itemImage(), Flexible(child: _infoTxt())],
25+
),
26+
)),
27+
),
28+
);
29+
}
30+
31+
Widget _itemImage() {
32+
return Stack(
33+
children: [
34+
Image.network(
35+
model.pic,
36+
height: 120,
37+
),
38+
Positioned(
39+
left: 0,
40+
right: 0,
41+
bottom: 0,
42+
child: Container(
43+
padding: EdgeInsets.only(left: 8, right: 8, bottom: 3, top: 5),
44+
decoration: BoxDecoration(
45+
gradient: LinearGradient(
46+
colors: [Colors.black54, Colors.transparent],
47+
begin: Alignment.bottomCenter,
48+
end: Alignment.topCenter)),
49+
child: Row(
50+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
51+
children: [
52+
_iconTxt(Icons.ondemand_video, model.stat?.view ?? 0),
53+
_iconTxt(Icons.favorite_border, model.stat?.favorite ?? 0),
54+
_iconTxt(null, model.duration),
55+
],
56+
),
57+
),
58+
)
59+
],
60+
);
61+
}
62+
63+
Widget _iconTxt(IconData? iconData, int count) {
64+
var str = '';
65+
if (iconData != null) {
66+
str = countFormat(count);
67+
} else {
68+
str = time2String(model.duration);
69+
}
70+
return Row(
71+
children: [
72+
if (iconData != null)
73+
Icon(
74+
iconData,
75+
color: Colors.white,
76+
size: 12,
77+
),
78+
Padding(
79+
padding: EdgeInsets.only(left: 3),
80+
child: Text(str,
81+
style: TextStyle(color: Colors.white, fontSize: 10),
82+
overflow: TextOverflow.ellipsis),
83+
)
84+
],
85+
);
86+
}
87+
88+
Widget _infoTxt() {
89+
return Expanded(
90+
child: Container(
91+
padding: EdgeInsets.only(top: 5, left: 8, right: 8, bottom: 5),
92+
child: Column(
93+
crossAxisAlignment: CrossAxisAlignment.start,
94+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
95+
children: [
96+
Text(
97+
model.title,
98+
maxLines: 2,
99+
overflow: TextOverflow.ellipsis,
100+
style: TextStyle(fontSize: 12, color: Colors.black87),
101+
),
102+
// _owner()
103+
],
104+
),
105+
));
106+
}
107+
108+
Widget _owner() {
109+
var owner = model.owner;
110+
return Row(
111+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
112+
children: [
113+
Row(
114+
children: [
115+
ClipOval(
116+
child: Image.network(
117+
model.owner?.face ?? '',
118+
height: 24,
119+
width: 24,
120+
),
121+
),
122+
Padding(
123+
padding: EdgeInsets.only(left: 8),
124+
child: Text(model.owner?.name ?? '',
125+
style: TextStyle(fontSize: 11, color: Colors.black87)),
126+
)
127+
],
128+
),
129+
Icon(Icons.more_vert_sharp, size: 15, color: Colors.grey)
130+
],
131+
);
132+
}
133+
}

‎pubspec.lock‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,13 @@ packages:
7676
url: "https://pub.dartlang.org"
7777
source: hosted
7878
version: "1.0.4"
79+
flutter_staggered_grid_view:
80+
dependency: "direct main"
81+
description:
82+
name: flutter_staggered_grid_view
83+
url: "https://pub.dartlang.org"
84+
source: hosted
85+
version: "0.4.1"
7986
flutter_statusbar_manager:
8087
dependency: "direct main"
8188
description:
@@ -186,4 +193,4 @@ packages:
186193
version: "2.1.0"
187194
sdks:
188195
dart: ">=2.12.0 <3.0.0"
189-
flutter: ">=1.12.0"
196+
flutter: ">=1.24.0-6.0.pre"

‎pubspec.yaml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ dependencies:
3333

3434
flutter_statusbar_manager: ^2.0.0
3535
dio: ^4.0.1
36+
flutter_staggered_grid_view: ^0.4.1
3637

3738

3839
# The following adds the Cupertino Icons font to your application.

0 commit comments

Comments
 (0)