mirrors/pilipala
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

opt: AppBar渐变背景

Browse Source
This commit is contained in:
guozhigq
2024-07-06 23:43:50 +08:00
parent 739e1d9ada
commit dac0898729
8 changed files with 162 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
lib/pages/dynamics/view.dart
View File

@ -3,6 +3,7 @@ import 'dart:async';
import 'package:custom_sliding_segmented_control/custom_sliding_segmented_control.dart';
import 'package:easy_debounce/easy_throttle.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:hive/hive.dart';
import 'package:pilipala/common/skeleton/dynamic_card.dart';
@ -77,10 +78,14 @@ class _DynamicsPageState extends State<DynamicsPage>
Widget build(BuildContext context) {
super.build(context);
return Scaffold(
backgroundColor: Colors.transparent,
appBar: AppBar(
elevation: 0,
scrolledUnderElevation: 0,
titleSpacing: 0,
backgroundColor: Colors.transparent,
systemOverlayStyle: Theme.of(context).brightness == Brightness.dark
? SystemUiOverlayStyle.light
: SystemUiOverlayStyle.dark,
title: SizedBox(
height: 34,
child: Stack(

149
lib/pages/home/view.dart
View File

@ -46,104 +46,66 @@ class _HomePageState extends State<HomePage>
@override
Widget build(BuildContext context) {
super.build(context);
Brightness currentBrightness = MediaQuery.of(context).platformBrightness;
// 设置状态栏图标的亮度
if (_homeController.enableGradientBg) {
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
statusBarIconBrightness: currentBrightness == Brightness.light
? Brightness.dark
: Brightness.light,
));
}
return Scaffold(
extendBody: true,
extendBodyBehindAppBar: true,
appBar: _homeController.enableGradientBg
? null
: AppBar(toolbarHeight: 0, elevation: 0),
body: Stack(
backgroundColor: Colors.transparent,
appBar: AppBar(
toolbarHeight: 0,
elevation: 0,
backgroundColor: Colors.transparent,
systemOverlayStyle: Theme.of(context).brightness == Brightness.dark
? SystemUiOverlayStyle.light
: SystemUiOverlayStyle.dark,
),
body: Column(
children: [
// gradient background
if (_homeController.enableGradientBg) ...[
Align(
alignment: Alignment.topLeft,
child: Opacity(
opacity: 0.6,
child: Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
Theme.of(context)
.colorScheme
.primary
.withOpacity(0.4),
Theme.of(context)
.colorScheme
.surface
.withOpacity(0.5),
Theme.of(context).colorScheme.surface
],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: const [0.1, 0.3, 0.5]),
CustomAppBar(
stream: _homeController.hideSearchBar
? stream
: StreamController<bool>.broadcast().stream,
ctr: _homeController,
callback: showUserBottomSheet,
),
if (_homeController.tabs.length > 1) ...[
if (_homeController.enableGradientBg) ...[
const CustomTabs(),
] else ...[
Container(
width: double.infinity,
height: 42,
padding: const EdgeInsets.only(top: 4),
child: Align(
alignment: Alignment.center,
child: TabBar(
controller: _homeController.tabController,
tabs: [
for (var i in _homeController.tabs) Tab(text: i['label'])
],
isScrollable: true,
dividerColor: Colors.transparent,
enableFeedback: true,
splashBorderRadius: BorderRadius.circular(10),
tabAlignment: TabAlignment.center,
onTap: (value) {
feedBack();
if (_homeController.initialIndex.value == value) {
_homeController.tabsCtrList[value]().animateToTop();
}
_homeController.initialIndex.value = value;
},
),
),
),
),
],
Column(
children: [
CustomAppBar(
stream: _homeController.hideSearchBar
? stream
: StreamController<bool>.broadcast().stream,
ctr: _homeController,
callback: showUserBottomSheet,
),
if (_homeController.tabs.length > 1) ...[
if (_homeController.enableGradientBg) ...[
const CustomTabs(),
] else ...[
const SizedBox(height: 4),
SizedBox(
width: double.infinity,
height: 42,
child: Align(
alignment: Alignment.center,
child: TabBar(
controller: _homeController.tabController,
tabs: [
for (var i in _homeController.tabs)
Tab(text: i['label'])
],
isScrollable: true,
dividerColor: Colors.transparent,
enableFeedback: true,
splashBorderRadius: BorderRadius.circular(10),
tabAlignment: TabAlignment.center,
onTap: (value) {
feedBack();
if (_homeController.initialIndex.value == value) {
_homeController.tabsCtrList[value]().animateToTop();
}
_homeController.initialIndex.value = value;
},
),
),
),
],
] else ...[
const SizedBox(height: 6),
],
Expanded(
child: TabBarView(
controller: _homeController.tabController,
children: _homeController.tabsPageList,
),
),
],
] else ...[
const SizedBox(height: 6),
],
Expanded(
child: TabBarView(
controller: _homeController.tabController,
children: _homeController.tabsPageList,
),
),
],
),
@ -280,7 +242,10 @@ class DefaultUser extends StatelessWidget {
style: ButtonStyle(
padding: MaterialStateProperty.all(EdgeInsets.zero),
backgroundColor: MaterialStateProperty.resolveWith((states) {
return Theme.of(context).colorScheme.onInverseSurface;
return Theme.of(context)
.colorScheme
.onSecondaryContainer
.withOpacity(0.05);
}),
),
onPressed: () => callback?.call(),
@ -317,7 +282,7 @@ class _CustomTabsState extends State<CustomTabs> {
Widget build(BuildContext context) {
return Container(
height: 44,
margin: const EdgeInsets.only(top: 4),
margin: const EdgeInsets.only(top: 8),
child: Obx(
() => ListView.separated(
padding: const EdgeInsets.symmetric(horizontal: 14.0),

3
lib/pages/main/controller.dart
View File

@ -26,6 +26,7 @@ class MainController extends GetxController {
Box userInfoCache = GStrorage.userInfo;
RxBool userLogin = false.obs;
late Rx<DynamicBadgeMode> dynamicBadgeType = DynamicBadgeMode.number.obs;
late bool enableGradientBg;
@override
void onInit() {
@ -44,6 +45,8 @@ class MainController extends GetxController {
if (dynamicBadgeType.value != DynamicBadgeMode.hidden) {
getUnreadDynamic();
}
enableGradientBg =
setting.get(SettingBoxKey.enableGradientBg, defaultValue: true);
}
void onBackPressed(BuildContext context) {

49
lib/pages/main/view.dart
View File

@ -117,14 +117,47 @@ class _MainAppState extends State<MainApp> with SingleTickerProviderStateMixin {
},
child: Scaffold(
extendBody: true,
body: PageView(
physics: const NeverScrollableScrollPhysics(),
controller: _mainController.pageController,
onPageChanged: (index) {
_mainController.selectedIndex = index;
setState(() {});
},
children: _mainController.pages,
body: Stack(
children: [
if (_mainController.enableGradientBg)
Align(
alignment: Alignment.topLeft,
child: Opacity(
opacity: 0.6,
child: Container(
width: MediaQuery.of(context).size.width,
// height: MediaQuery.of(context).size.height,
height: MediaQuery.of(context).padding.top + 400,
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
Theme.of(context)
.colorScheme
.primary
.withOpacity(0.6),
Theme.of(context)
.colorScheme
.surface
.withOpacity(0.3),
Theme.of(context).colorScheme.surface
],
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: const [0.1, 0.8, 1]),
),
),
),
),
PageView(
physics: const NeverScrollableScrollPhysics(),
controller: _mainController.pageController,
onPageChanged: (index) {
_mainController.selectedIndex = index;
setState(() {});
},
children: _mainController.pages,
),
],
),
bottomNavigationBar: _mainController.navigationBars.length > 1
? StreamBuilder(

13
lib/pages/media/view.dart
View File

@ -1,11 +1,11 @@
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:pilipala/common/widgets/network_img_layer.dart';
import 'package:pilipala/models/user/fav_folder.dart';
import 'package:pilipala/pages/media/index.dart';
import 'package:pilipala/utils/main_stream.dart';
import 'package:pilipala/utils/utils.dart';
class MediaPage extends StatefulWidget {
@ -46,7 +46,16 @@ class _MediaPageState extends State<MediaPage>
super.build(context);
Color primary = Theme.of(context).colorScheme.primary;
return Scaffold(
appBar: AppBar(toolbarHeight: 30),
backgroundColor: Colors.transparent,
appBar: AppBar(
elevation: 0,
scrolledUnderElevation: 0,
toolbarHeight: 30,
backgroundColor: Colors.transparent,
systemOverlayStyle: Theme.of(context).brightness == Brightness.dark
? SystemUiOverlayStyle.light
: SystemUiOverlayStyle.dark,
),
body: SingleChildScrollView(
controller: mediaController.scrollController,
child: Column(

3
lib/pages/rank/controller.dart
View File

@ -17,13 +17,10 @@ class RankController extends GetxController with GetTickerProviderStateMixin {
Box setting = GStrorage.setting;
late final StreamController<bool> searchBarStream =
StreamController<bool>.broadcast();
late bool enableGradientBg;
@override
void onInit() {
super.onInit();
enableGradientBg =
setting.get(SettingBoxKey.enableGradientBg, defaultValue: true);
// 进行tabs配置
setTabConfig();
}

124
lib/pages/rank/view.dart
View File

@ -31,94 +31,56 @@ class _RankPageState extends State<RankPage>
@override
Widget build(BuildContext context) {
super.build(context);
Brightness currentBrightness = MediaQuery.of(context).platformBrightness;
// 设置状态栏图标的亮度
if (_rankController.enableGradientBg) {
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
statusBarIconBrightness: currentBrightness == Brightness.light
? Brightness.dark
: Brightness.light,
));
}
return Scaffold(
extendBody: true,
extendBodyBehindAppBar: false,
appBar: _rankController.enableGradientBg
? null
: AppBar(toolbarHeight: 0, elevation: 0),
body: Stack(
extendBodyBehindAppBar: true,
backgroundColor: Colors.transparent,
appBar: AppBar(
toolbarHeight: 0,
elevation: 0,
backgroundColor: Colors.transparent,
systemOverlayStyle: Theme.of(context).brightness == Brightness.dark
? SystemUiOverlayStyle.light
: SystemUiOverlayStyle.dark,
),
body: Column(
children: [
// gradient background
if (_rankController.enableGradientBg) ...[
Align(
alignment: Alignment.topLeft,
child: Opacity(
opacity: 0.6,
child: Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
Theme.of(context)
.colorScheme
.primary
.withOpacity(0.9),
Theme.of(context)
.colorScheme
.primary
.withOpacity(0.5),
Theme.of(context).colorScheme.surface
],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
stops: const [0, 0.0034, 0.34]),
),
const CustomAppBar(),
if (_rankController.tabs.length > 1) ...[
const SizedBox(height: 4),
SizedBox(
width: double.infinity,
height: 42,
child: Align(
alignment: Alignment.center,
child: TabBar(
controller: _rankController.tabController,
tabs: [
for (var i in _rankController.tabs) Tab(text: i['label'])
],
isScrollable: true,
dividerColor: Colors.transparent,
enableFeedback: true,
splashBorderRadius: BorderRadius.circular(10),
tabAlignment: TabAlignment.center,
onTap: (value) {
feedBack();
if (_rankController.initialIndex.value == value) {
_rankController.tabsCtrList[value].animateToTop();
}
_rankController.initialIndex.value = value;
},
),
),
),
] else ...[
const SizedBox(height: 6),
],
Column(
children: [
const CustomAppBar(),
if (_rankController.tabs.length > 1) ...[
const SizedBox(height: 4),
SizedBox(
width: double.infinity,
height: 42,
child: Align(
alignment: Alignment.center,
child: TabBar(
controller: _rankController.tabController,
tabs: [
for (var i in _rankController.tabs)
Tab(text: i['label'])
],
isScrollable: true,
dividerColor: Colors.transparent,
enableFeedback: true,
splashBorderRadius: BorderRadius.circular(10),
tabAlignment: TabAlignment.center,
onTap: (value) {
feedBack();
if (_rankController.initialIndex.value == value) {
_rankController.tabsCtrList[value].animateToTop();
}
_rankController.initialIndex.value = value;
},
),
),
),
] else ...[
const SizedBox(height: 6),
],
Expanded(
child: TabBarView(
controller: _rankController.tabController,
children: _rankController.tabsPageList,
),
),
],
Expanded(
child: TabBarView(
controller: _rankController.tabController,
children: _rankController.tabsPageList,
),
),
],
),

1
lib/pages/video/detail/view.dart
View File

@ -4,6 +4,7 @@ import 'dart:ui';
import 'package:extended_nested_scroll_view/extended_nested_scroll_view.dart';
import 'package:floating/floating.dart';
import 'package:flutter/services.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:flutter_svg/svg.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';