💄 Better scrolling

This commit is contained in:
LittleSheep 2024-05-29 20:13:53 +08:00
parent d4cbabeb31
commit 5f06fc4f9d
6 changed files with 130 additions and 186 deletions

View File

@ -75,19 +75,14 @@ class _ContactScreenState extends State<ContactScreen> {
); );
} }
return SafeArea( return RefreshIndicator(
child: NestedScrollView( onRefresh: () => getChannels(),
headerSliverBuilder: (context, innerBoxIsScrolled) { child: CustomScrollView(
return [ slivers: [
SliverOverlapAbsorber( SliverAppBar(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(
context),
sliver: SliverAppBar(
title: Text('contact'.tr), title: Text('contact'.tr),
centerTitle: false, centerTitle: false,
titleSpacing: titleSpacing: SolianTheme.isLargeScreen(context) ? null : 24,
SolianTheme.isLargeScreen(context) ? null : 24,
forceElevated: innerBoxIsScrolled,
actions: [ actions: [
const NotificationButton(), const NotificationButton(),
PopupMenuButton( PopupMenuButton(
@ -138,32 +133,19 @@ class _ContactScreenState extends State<ContactScreen> {
), ),
], ],
), ),
),
];
},
body: MediaQuery.removePadding(
removeTop: true,
context: context,
child: Column(
children: [
if (_isBusy) if (_isBusy)
const LinearProgressIndicator().animate().scaleX(), SliverToBoxAdapter(
Expanded( child: const LinearProgressIndicator().animate().scaleX(),
child: RefreshIndicator( ),
onRefresh: () => getChannels(), SliverList.builder(
child: ListView.builder(
itemCount: _channels.length, itemCount: _channels.length,
itemBuilder: (context, index) { itemBuilder: (context, index) {
final element = _channels[index]; final element = _channels[index];
return buildItem(element); return buildItem(element);
}, },
), ),
),
),
], ],
), ),
),
),
); );
}, },
), ),

View File

@ -44,22 +44,25 @@ class _PostDetailScreenState extends State<PostDetailScreen> {
); );
} }
return ListView( return CustomScrollView(
children: [ slivers: [
PostItem( SliverToBoxAdapter(
child: PostItem(
item: item!, item: item!,
isClickable: true, isClickable: true,
isShowReply: false, isShowReply: false,
), ),
const Divider(thickness: 0.3, height: 0.3), ),
Text( const SliverToBoxAdapter(
child: Divider(thickness: 0.3, height: 0.3),
),
SliverToBoxAdapter(
child: Text(
'postReplies'.tr, 'postReplies'.tr,
style: Theme.of(context).textTheme.headlineSmall, style: Theme.of(context).textTheme.headlineSmall,
).paddingOnly(left: 24, right: 24, top: 16), ).paddingOnly(left: 24, right: 24, top: 16),
PostReplyList(
item: item!,
shrinkWrap: true,
), ),
PostReplyList(item: item!),
], ],
); );
}, },

View File

@ -66,27 +66,20 @@ class _RealmListScreenState extends State<RealmListScreen> {
); );
} }
return SafeArea( return RefreshIndicator(
child: NestedScrollView( onRefresh: () => getRealms(),
headerSliverBuilder: (context, innerBoxIsScrolled) { child: CustomScrollView(
return [ slivers: [
SliverOverlapAbsorber( SliverAppBar(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(
context),
sliver: SliverAppBar(
title: Text('realm'.tr), title: Text('realm'.tr),
centerTitle: false, centerTitle: false,
titleSpacing: titleSpacing: SolianTheme.isLargeScreen(context) ? null : 24,
SolianTheme.isLargeScreen(context) ? null : 24,
forceElevated: innerBoxIsScrolled,
actions: [ actions: [
const NotificationButton(), const NotificationButton(),
IconButton( IconButton(
icon: const Icon(Icons.add_circle), icon: const Icon(Icons.add_circle),
onPressed: () { onPressed: () {
AppRouter.instance AppRouter.instance.pushNamed('realmOrganizing').then(
.pushNamed('realmOrganizing')
.then(
(value) { (value) {
if (value != null) getRealms(); if (value != null) getRealms();
}, },
@ -98,32 +91,19 @@ class _RealmListScreenState extends State<RealmListScreen> {
), ),
], ],
), ),
),
];
},
body: MediaQuery.removePadding(
removeTop: true,
context: context,
child: Column(
children: [
if (_isBusy) if (_isBusy)
const LinearProgressIndicator().animate().scaleX(), SliverToBoxAdapter(
Expanded( child: const LinearProgressIndicator().animate().scaleX(),
child: RefreshIndicator( ),
onRefresh: () => getRealms(), SliverList.builder(
child: ListView.builder(
itemCount: _realms.length, itemCount: _realms.length,
itemBuilder: (context, index) { itemBuilder: (context, index) {
final element = _realms[index]; final element = _realms[index];
return buildRealm(element); return buildRealm(element);
}, },
), )
),
),
], ],
), ),
),
),
); );
}, },
), ),

View File

@ -72,21 +72,15 @@ class _SocialScreenState extends State<SocialScreen> {
}), }),
body: Material( body: Material(
color: Theme.of(context).colorScheme.surface, color: Theme.of(context).colorScheme.surface,
child: SafeArea( child: RefreshIndicator(
child: NestedScrollView( onRefresh: () => Future.sync(() => _pagingController.refresh()),
headerSliverBuilder: (context, innerBoxIsScrolled) { child: CustomScrollView(
return [ slivers: [
SliverOverlapAbsorber( SliverAppBar(
handle:
NestedScrollView.sliverOverlapAbsorberHandleFor(context),
sliver: SliverAppBar(
title: Text('social'.tr), title: Text('social'.tr),
centerTitle: false, centerTitle: false,
floating: true, floating: true,
snap: true, titleSpacing: SolianTheme.isLargeScreen(context) ? null : 24,
titleSpacing:
SolianTheme.isLargeScreen(context) ? null : 24,
forceElevated: innerBoxIsScrolled,
actions: [ actions: [
const NotificationButton(), const NotificationButton(),
SizedBox( SizedBox(
@ -94,17 +88,8 @@ class _SocialScreenState extends State<SocialScreen> {
), ),
], ],
), ),
), PostListWidget(controller: _pagingController),
]; ],
},
body: MediaQuery.removePadding(
removeTop: true,
context: context,
child: RefreshIndicator(
onRefresh: () => Future.sync(() => _pagingController.refresh()),
child: PostListWidget(controller: _pagingController),
),
),
), ),
), ),
), ),

View File

@ -7,7 +7,6 @@ import 'package:solian/widgets/posts/post_action.dart';
import 'package:solian/widgets/posts/post_item.dart'; import 'package:solian/widgets/posts/post_item.dart';
class PostListWidget extends StatelessWidget { class PostListWidget extends StatelessWidget {
final bool shrinkWrap;
final bool isShowEmbed; final bool isShowEmbed;
final bool isClickable; final bool isClickable;
final bool isNestedClickable; final bool isNestedClickable;
@ -16,7 +15,6 @@ class PostListWidget extends StatelessWidget {
const PostListWidget({ const PostListWidget({
super.key, super.key,
required this.controller, required this.controller,
this.shrinkWrap = false,
this.isShowEmbed = true, this.isShowEmbed = true,
this.isClickable = true, this.isClickable = true,
this.isNestedClickable = true, this.isNestedClickable = true,
@ -24,8 +22,7 @@ class PostListWidget extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return PagedListView<int, Post>.separated( return PagedSliverList<int, Post>.separated(
shrinkWrap: shrinkWrap,
pagingController: controller, pagingController: controller,
builderDelegate: PagedChildBuilderDelegate<Post>( builderDelegate: PagedChildBuilderDelegate<Post>(
itemBuilder: (context, item, index) { itemBuilder: (context, item, index) {

View File

@ -8,12 +8,10 @@ import 'package:solian/widgets/posts/post_list.dart';
class PostReplyList extends StatefulWidget { class PostReplyList extends StatefulWidget {
final Post item; final Post item;
final bool shrinkWrap;
const PostReplyList({ const PostReplyList({
super.key, super.key,
required this.item, required this.item,
this.shrinkWrap = false,
}); });
@override @override
@ -55,7 +53,6 @@ class _PostReplyListState extends State<PostReplyList> {
Widget build(BuildContext context) { Widget build(BuildContext context) {
return PostListWidget( return PostListWidget(
isShowEmbed: false, isShowEmbed: false,
shrinkWrap: widget.shrinkWrap,
controller: _pagingController, controller: _pagingController,
); );
} }
@ -76,8 +73,8 @@ class PostReplyListPopup extends StatelessWidget {
style: Theme.of(context).textTheme.headlineSmall, style: Theme.of(context).textTheme.headlineSmall,
).paddingOnly(left: 24, right: 24, top: 32, bottom: 16), ).paddingOnly(left: 24, right: 24, top: 32, bottom: 16),
Expanded( Expanded(
child: PostReplyList( child: CustomScrollView(
item: item, slivers: [PostReplyList(item: item)],
), ),
), ),
], ],