feat: 顶栏收起
This commit is contained in:
guozhigq
@ -1,5 +1,7 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:pilipala/http/index.dart';
|
||||
import 'package:pilipala/pages/bangumi/index.dart';
|
||||
import 'package:pilipala/pages/hot/index.dart';
|
||||
import 'package:pilipala/pages/live/index.dart';
|
||||
import 'package:pilipala/pages/rcmd/index.dart';
|
||||
@ -31,6 +33,14 @@ class HomeController extends GetxController with GetTickerProviderStateMixin {
|
||||
'label': '热门',
|
||||
'type': 'hot'
|
||||
},
|
||||
{
|
||||
'icon': const Icon(
|
||||
Icons.play_circle_outlined,
|
||||
size: 15,
|
||||
),
|
||||
'label': '番剧',
|
||||
'type': 'bangumi'
|
||||
},
|
||||
];
|
||||
int initialIndex = 1;
|
||||
late TabController tabController;
|
||||
@ -38,7 +48,9 @@ class HomeController extends GetxController with GetTickerProviderStateMixin {
|
||||
Get.find<LiveController>,
|
||||
Get.find<RcmdController>,
|
||||
Get.find<HotController>,
|
||||
Get.find<BangumiController>,
|
||||
];
|
||||
RxString defaultSearch = '输入关键词搜索'.obs;
|
||||
|
||||
@override
|
||||
void onInit() {
|
||||
@ -48,6 +60,7 @@ class HomeController extends GetxController with GetTickerProviderStateMixin {
|
||||
length: tabs.length,
|
||||
vsync: this,
|
||||
);
|
||||
searchDefault();
|
||||
}
|
||||
|
||||
void onRefresh() {
|
||||
@ -61,4 +74,11 @@ class HomeController extends GetxController with GetTickerProviderStateMixin {
|
||||
var ctr = ctrList[index];
|
||||
ctr().animateToTop();
|
||||
}
|
||||
|
||||
void searchDefault() async {
|
||||
var res = await Request().get(Api.searchDefault);
|
||||
if (res.data['code'] == 0) {
|
||||
defaultSearch.value = res.data['data']['name'];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,10 +1,16 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:get/get.dart';
|
||||
import 'package:hive/hive.dart';
|
||||
import 'package:pilipala/common/widgets/network_img_layer.dart';
|
||||
import 'package:pilipala/pages/bangumi/index.dart';
|
||||
import 'package:pilipala/pages/hot/index.dart';
|
||||
import 'package:pilipala/pages/live/index.dart';
|
||||
import 'package:pilipala/pages/main/index.dart';
|
||||
import 'package:pilipala/pages/mine/index.dart';
|
||||
import 'package:pilipala/pages/rcmd/index.dart';
|
||||
import 'package:pilipala/utils/feed_back.dart';
|
||||
import 'package:pilipala/utils/storage.dart';
|
||||
import './controller.dart';
|
||||
|
||||
class HomePage extends StatefulWidget {
|
||||
@ -18,7 +24,7 @@ class _HomePageState extends State<HomePage>
|
||||
with AutomaticKeepAliveClientMixin, TickerProviderStateMixin {
|
||||
final HomeController _homeController = Get.put(HomeController());
|
||||
List videoList = [];
|
||||
// late TabController? _tabController;
|
||||
Stream<bool> stream = Get.find<MainController>().bottomBarStream.stream;
|
||||
|
||||
@override
|
||||
bool get wantKeepAlive => true;
|
||||
@ -27,103 +33,231 @@ class _HomePageState extends State<HomePage>
|
||||
Widget build(BuildContext context) {
|
||||
super.build(context);
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
titleSpacing: 0,
|
||||
title: Padding(
|
||||
padding: const EdgeInsets.only(left: 12, right: 12, bottom: 0),
|
||||
child: Stack(
|
||||
children: [
|
||||
const Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Padding(
|
||||
padding: EdgeInsets.only(left: 8),
|
||||
child: Text(
|
||||
'PLPL',
|
||||
style: TextStyle(
|
||||
height: 2.8,
|
||||
fontSize: 17,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 1,
|
||||
fontFamily: 'Jura-Bold',
|
||||
extendBody: true,
|
||||
extendBodyBehindAppBar: true,
|
||||
appBar: AppBar(toolbarHeight: 0, elevation: 0),
|
||||
body: Column(
|
||||
children: [
|
||||
CustomAppBar(stream: stream, ctr: _homeController),
|
||||
Container(
|
||||
padding: const EdgeInsets.only(left: 12, right: 12, bottom: 4),
|
||||
child: Stack(
|
||||
children: [
|
||||
Align(
|
||||
alignment: Alignment.center,
|
||||
child: Theme(
|
||||
data: ThemeData(
|
||||
splashColor: Colors.transparent, // 点击时的水波纹颜色设置为透明
|
||||
highlightColor: Colors.transparent, // 点击时的背景高亮颜色设置为透明
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Align(
|
||||
alignment: Alignment.center,
|
||||
child: Theme(
|
||||
data: ThemeData(
|
||||
splashColor: Colors.transparent, // 点击时的水波纹颜色设置为透明
|
||||
highlightColor: Colors.transparent, // 点击时的背景高亮颜色设置为透明
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(top: 4),
|
||||
child: TabBar(
|
||||
controller: _homeController.tabController,
|
||||
tabs: [
|
||||
for (var i in _homeController.tabs)
|
||||
// Tab(text: i['label'])
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 0, vertical: 11),
|
||||
child: Row(
|
||||
children: [
|
||||
i['icon'],
|
||||
const SizedBox(width: 4),
|
||||
Text(i['label'])
|
||||
],
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(top: 2),
|
||||
child: TabBar(
|
||||
controller: _homeController.tabController,
|
||||
tabs: [
|
||||
for (var i in _homeController.tabs)
|
||||
// Tab(text: i['label'])
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 0, vertical: 11),
|
||||
child: Row(
|
||||
children: [
|
||||
i['icon'],
|
||||
const SizedBox(width: 4),
|
||||
Text(i['label'])
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
isScrollable: true,
|
||||
indicatorWeight: 0,
|
||||
indicatorPadding: const EdgeInsets.symmetric(
|
||||
horizontal: 4, vertical: 5),
|
||||
indicator: BoxDecoration(
|
||||
color: Theme.of(context)
|
||||
.colorScheme
|
||||
.primaryContainer
|
||||
.withOpacity(0.8),
|
||||
borderRadius:
|
||||
const BorderRadius.all(Radius.circular(20)),
|
||||
],
|
||||
isScrollable: true,
|
||||
indicatorWeight: 0,
|
||||
indicatorPadding: const EdgeInsets.symmetric(
|
||||
horizontal: 4, vertical: 5),
|
||||
indicator: BoxDecoration(
|
||||
color: Theme.of(context)
|
||||
.colorScheme
|
||||
.primaryContainer
|
||||
.withOpacity(0.8),
|
||||
borderRadius:
|
||||
const BorderRadius.all(Radius.circular(20)),
|
||||
),
|
||||
indicatorSize: TabBarIndicatorSize.tab,
|
||||
labelColor: Theme.of(context).colorScheme.primary,
|
||||
labelStyle: const TextStyle(fontSize: 13),
|
||||
dividerColor: Colors.transparent,
|
||||
unselectedLabelColor:
|
||||
Theme.of(context).colorScheme.outline,
|
||||
onTap: (value) =>
|
||||
{feedBack(), _homeController.initialIndex = value},
|
||||
),
|
||||
indicatorSize: TabBarIndicatorSize.tab,
|
||||
labelColor: Theme.of(context).colorScheme.primary,
|
||||
labelStyle: const TextStyle(fontSize: 13),
|
||||
dividerColor: Colors.transparent,
|
||||
unselectedLabelColor:
|
||||
Theme.of(context).colorScheme.outline,
|
||||
onTap: (value) =>
|
||||
{feedBack(), _homeController.initialIndex = value},
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
Align(
|
||||
alignment: Alignment.centerRight,
|
||||
child: Hero(
|
||||
tag: 'searchTag',
|
||||
child: IconButton(
|
||||
onPressed: () {
|
||||
feedBack();
|
||||
Get.toNamed('/search');
|
||||
},
|
||||
icon: const Icon(CupertinoIcons.search, size: 21),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: TabBarView(
|
||||
controller: _homeController.tabController,
|
||||
children: const [
|
||||
LivePage(),
|
||||
RcmdPage(),
|
||||
HotPage(),
|
||||
BangumiPage(),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
body: TabBarView(
|
||||
controller: _homeController.tabController,
|
||||
children: const [
|
||||
LivePage(),
|
||||
RcmdPage(),
|
||||
HotPage(),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class CustomAppBar extends StatelessWidget implements PreferredSizeWidget {
|
||||
final double height;
|
||||
final Stream<bool>? stream;
|
||||
final ctr;
|
||||
|
||||
const CustomAppBar({
|
||||
super.key,
|
||||
this.height = kToolbarHeight,
|
||||
this.stream,
|
||||
this.ctr,
|
||||
});
|
||||
|
||||
@override
|
||||
Size get preferredSize => Size.fromHeight(height);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
Box user = GStrorage.user;
|
||||
|
||||
return StreamBuilder(
|
||||
stream: stream,
|
||||
initialData: true,
|
||||
builder: (context, AsyncSnapshot snapshot) {
|
||||
return ClipRect(
|
||||
clipBehavior: Clip.hardEdge,
|
||||
child: AnimatedOpacity(
|
||||
opacity: snapshot.data ? 1 : 0,
|
||||
duration: const Duration(milliseconds: 300),
|
||||
child: AnimatedContainer(
|
||||
curve: Curves.linear,
|
||||
duration: const Duration(milliseconds: 300),
|
||||
height: snapshot.data ? 94 : MediaQuery.of(context).padding.top,
|
||||
child: Container(
|
||||
padding: EdgeInsets.only(
|
||||
left: 12,
|
||||
right: 12,
|
||||
bottom: 4,
|
||||
top: MediaQuery.of(context).padding.top,
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Text(
|
||||
'PLPL',
|
||||
style: TextStyle(
|
||||
height: 2.8,
|
||||
fontSize: 17,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontFamily: 'Jura-Bold',
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: Hero(
|
||||
tag: 'searchWrap',
|
||||
child: GestureDetector(
|
||||
onTap: () {
|
||||
Get.toNamed('/search', parameters: {
|
||||
'hintText': ctr.defaultSearch.value
|
||||
});
|
||||
},
|
||||
child: Container(
|
||||
width: 250,
|
||||
height: 45,
|
||||
clipBehavior: Clip.hardEdge,
|
||||
padding: const EdgeInsets.only(left: 12, right: 22),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius:
|
||||
const BorderRadius.all(Radius.circular(25)),
|
||||
color: Theme.of(context)
|
||||
.colorScheme
|
||||
.onInverseSurface,
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.search_outlined,
|
||||
size: 23,
|
||||
color: Theme.of(context).colorScheme.outline,
|
||||
),
|
||||
const SizedBox(width: 7),
|
||||
Expanded(
|
||||
child: Obx(
|
||||
() => Text(
|
||||
ctr.defaultSearch.value,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: TextStyle(
|
||||
color: Theme.of(context)
|
||||
.colorScheme
|
||||
.outline),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
if (user.get(UserBoxKey.userLogin) ?? false) ...[
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
feedBack();
|
||||
showModalBottomSheet(
|
||||
context: context,
|
||||
builder: (_) => const SizedBox(
|
||||
height: 450,
|
||||
child: MinePage(),
|
||||
),
|
||||
clipBehavior: Clip.hardEdge,
|
||||
isScrollControlled: true,
|
||||
);
|
||||
},
|
||||
child: NetworkImgLayer(
|
||||
type: 'avatar',
|
||||
width: 34,
|
||||
height: 34,
|
||||
src: user.get(UserBoxKey.userFace),
|
||||
),
|
||||
)
|
||||
] else ...[
|
||||
IconButton(
|
||||
onPressed: () {
|
||||
feedBack();
|
||||
showModalBottomSheet(
|
||||
context: context,
|
||||
builder: (_) => const SizedBox(
|
||||
height: 450,
|
||||
child: MinePage(),
|
||||
),
|
||||
clipBehavior: Clip.hardEdge,
|
||||
isScrollControlled: true,
|
||||
);
|
||||
},
|
||||
icon: const Icon(CupertinoIcons.person, size: 22),
|
||||
)
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user