Skip to content

Commit 9fc8751

Browse files
committed
add sliver_tools and flutter_sticky_header, like qq contact list
1 parent 1c1bf8e commit 9fc8751

File tree

12 files changed

+768
-1
lines changed

12 files changed

+768
-1
lines changed

lib/third_part.dart

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
33
import 'package:flutter_widget/third_part/image_test.dart';
44
import 'package:flutter_widget/third_part/riverpod/riverpod_widget.dart';
55
import 'package:flutter_widget/third_part/show_rich_text_html.dart';
6+
import 'package:flutter_widget/third_part/sticky_header/sticky_header_like_qq_list.dart';
67

78
class ThirdPart extends StatelessWidget {
89
@override
@@ -57,7 +58,17 @@ class ThirdPart extends StatelessWidget {
5758
child: Text("TestImage"),
5859
),
5960
Divider(height: 10,),
60-
61+
ElevatedButton(
62+
onPressed: () =>
63+
{
64+
Navigator.of(context).push(
65+
MaterialPageRoute(builder: (BuildContext context) {
66+
return StickyHeaderLikeQQList();
67+
}))
68+
},
69+
child: Text("StickyHeaderLikeQQList"),
70+
),
71+
Divider(height: 10,),
6172

6273
],
6374
),
Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:flutter_sticky_header/flutter_sticky_header.dart';
3+
4+
import 'sticky_header_common.dart';
5+
6+
class AnimatedHeaderExample extends StatelessWidget {
7+
const AnimatedHeaderExample({
8+
Key? key,
9+
}) : super(key: key);
10+
11+
@override
12+
Widget build(BuildContext context) {
13+
return StickyHeaderScaffold(
14+
title: 'Animated header Example',
15+
slivers: [
16+
_StickyHeaderList(index: 0),
17+
_StickyHeaderList(index: 1),
18+
_StickyHeaderList(index: 2),
19+
_StickyHeaderList(index: 3),
20+
],
21+
);
22+
}
23+
}
24+
25+
class _StickyHeaderList extends StatelessWidget {
26+
const _StickyHeaderList({
27+
Key? key,
28+
this.index,
29+
}) : super(key: key);
30+
31+
final int? index;
32+
33+
@override
34+
Widget build(BuildContext context) {
35+
return SliverStickyHeader.builder(
36+
builder: (context, state) => _AnimatedHeader(
37+
state: state,
38+
index: index,
39+
),
40+
sliver: SliverList(
41+
delegate: SliverChildBuilderDelegate(
42+
(context, i) => ListTile(
43+
leading: CircleAvatar(
44+
child: Text('$index'),
45+
),
46+
title: Text('List tile #$i'),
47+
),
48+
childCount: 6,
49+
),
50+
),
51+
);
52+
}
53+
}
54+
55+
class _AnimatedHeader extends StatelessWidget {
56+
const _AnimatedHeader({
57+
Key? key,
58+
this.state,
59+
this.index,
60+
}) : super(key: key);
61+
62+
final int? index;
63+
final SliverStickyHeaderState? state;
64+
65+
@override
66+
Widget build(BuildContext context) {
67+
return Header(
68+
index: index,
69+
color: Colors.lightBlue.withOpacity(1 - state!.scrollPercentage),
70+
);
71+
}
72+
}
Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:flutter_sticky_header/flutter_sticky_header.dart';
3+
4+
import 'sticky_header_common.dart';
5+
6+
class GridExample extends StatelessWidget {
7+
const GridExample({
8+
Key? key,
9+
}) : super(key: key);
10+
11+
@override
12+
Widget build(BuildContext context) {
13+
return StickyHeaderScaffold(
14+
title: 'Grid Example',
15+
slivers: [
16+
_StickyHeaderGrid(index: 0),
17+
_StickyHeaderGrid(index: 1),
18+
_StickyHeaderGrid(index: 2),
19+
_StickyHeaderGrid(index: 3),
20+
],
21+
);
22+
}
23+
}
24+
25+
class _StickyHeaderGrid extends StatelessWidget {
26+
const _StickyHeaderGrid({
27+
Key? key,
28+
this.index,
29+
}) : super(key: key);
30+
31+
final int? index;
32+
33+
@override
34+
Widget build(BuildContext context) {
35+
return SliverStickyHeader(
36+
header: Header(index: index),
37+
sliver: SliverGrid(
38+
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
39+
crossAxisCount: 3, crossAxisSpacing: 4.0, mainAxisSpacing: 4.0),
40+
delegate: SliverChildBuilderDelegate(
41+
(context, i) => GridTile(
42+
child: Card(
43+
child: Container(
44+
color: Colors.green,
45+
),
46+
),
47+
footer: Container(
48+
color: Colors.white.withOpacity(0.5),
49+
child: Padding(
50+
padding: const EdgeInsets.all(8.0),
51+
child: Text(
52+
'Grid tile #$i',
53+
style: const TextStyle(color: Colors.black),
54+
),
55+
),
56+
),
57+
),
58+
childCount: 9,
59+
),
60+
),
61+
);
62+
}
63+
}
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:flutter_sticky_header/flutter_sticky_header.dart';
3+
4+
import 'sticky_header_common.dart';
5+
6+
class ListExample extends StatelessWidget {
7+
const ListExample({
8+
Key? key,
9+
}) : super(key: key);
10+
11+
@override
12+
Widget build(BuildContext context) {
13+
return StickyHeaderScaffold(
14+
title: 'List Example',
15+
slivers: [
16+
_StickyHeaderList(index: 0),
17+
_StickyHeaderList(index: 1),
18+
_StickyHeaderList(index: 2),
19+
_StickyHeaderList(index: 3),
20+
],
21+
);
22+
}
23+
}
24+
25+
class _StickyHeaderList extends StatelessWidget {
26+
const _StickyHeaderList({
27+
Key? key,
28+
this.index,
29+
}) : super(key: key);
30+
31+
final int? index;
32+
33+
@override
34+
Widget build(BuildContext context) {
35+
return SliverStickyHeader(
36+
header: Header(index: index),
37+
sliver: SliverList(
38+
delegate: SliverChildBuilderDelegate(
39+
(context, i) => ListTile(
40+
onTap: () {
41+
print('tile $i');
42+
},
43+
leading: CircleAvatar(
44+
child: Text('$index'),
45+
),
46+
title: Text('List tile #$i'),
47+
),
48+
childCount: 6,
49+
),
50+
),
51+
);
52+
}
53+
}
Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
import 'package:flutter/material.dart';
2+
import 'package:flutter_sticky_header/flutter_sticky_header.dart';
3+
4+
import 'sticky_header_common.dart';
5+
6+
class MixSliversExample extends StatelessWidget {
7+
const MixSliversExample({
8+
Key? key,
9+
}) : super(key: key);
10+
11+
@override
12+
Widget build(BuildContext context) {
13+
return StickyHeaderScaffold(
14+
title: 'List Example',
15+
slivers: [
16+
SliverAppBar(
17+
backgroundColor: Colors.orange,
18+
title: Text('SliverAppBar'),
19+
automaticallyImplyLeading: false,
20+
pinned: true,
21+
),
22+
SliverToBoxAdapter(
23+
child: Container(
24+
height: 50,
25+
color: Colors.red,
26+
),
27+
),
28+
_StickyHeaderList(index: 0),
29+
_StickyHeaderList(index: 1),
30+
_StickyHeaderList(index: 2),
31+
_StickyHeaderList(index: 3),
32+
],
33+
);
34+
}
35+
}
36+
37+
class _StickyHeaderList extends StatelessWidget {
38+
const _StickyHeaderList({
39+
Key? key,
40+
this.index,
41+
}) : super(key: key);
42+
43+
final int? index;
44+
45+
@override
46+
Widget build(BuildContext context) {
47+
return SliverStickyHeader(
48+
header: Header(index: index),
49+
sliver: SliverList(
50+
delegate: SliverChildBuilderDelegate(
51+
(context, i) => ListTile(
52+
leading: CircleAvatar(
53+
child: Text('$index'),
54+
),
55+
title: Text('List tile #$i'),
56+
),
57+
childCount: 6,
58+
),
59+
),
60+
);
61+
}
62+
}

0 commit comments

Comments
 (0)