opt: horizontal settings page

Signed-off-by: bggRGjQaUbCoE <githubaccount56556@proton.me>
This commit is contained in:
bggRGjQaUbCoE
2025-01-20 18:40:29 +08:00
parent 2d0ace04ba
commit 39ce3631e7
10 changed files with 308 additions and 154 deletions

View File

@@ -16,7 +16,9 @@ import '../../http/init.dart';
import '../../utils/cache_manage.dart';
class AboutPage extends StatefulWidget {
const AboutPage({super.key});
const AboutPage({super.key, this.showAppBar});
final bool? showAppBar;
@override
State<AboutPage> createState() => _AboutPageState();
@@ -50,7 +52,7 @@ class _AboutPageState extends State<AboutPage> {
TextStyle subTitleStyle =
TextStyle(fontSize: 13, color: Theme.of(context).colorScheme.outline);
return Scaffold(
appBar: AppBar(title: Text('关于')),
appBar: widget.showAppBar == false ? null : AppBar(title: Text('关于')),
body: ListView(
children: [
GestureDetector(
@@ -455,7 +457,8 @@ Commit Hash: ${BuildConfig.commitHash}''',
},
);
},
)
),
SizedBox(height: MediaQuery.paddingOf(context).bottom + 80),
],
),
);

View File

@@ -2,14 +2,19 @@ import 'package:PiliPlus/pages/setting/widgets/model.dart';
import 'package:flutter/material.dart';
class ExtraSetting extends StatelessWidget {
const ExtraSetting({super.key});
const ExtraSetting({super.key, this.showAppBar});
final bool? showAppBar;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('其它设置')),
appBar: showAppBar == false ? null : AppBar(title: Text('其它设置')),
body: ListView(
children: extraSettings.map((item) => item.widget).toList(),
children: [
...extraSettings.map((item) => item.widget),
SizedBox(height: MediaQuery.paddingOf(context).bottom + 80),
],
),
);
}

View File

@@ -3,7 +3,9 @@ import 'package:flutter/material.dart';
import 'package:PiliPlus/services/service_locator.dart';
class PlaySetting extends StatefulWidget {
const PlaySetting({super.key});
const PlaySetting({super.key, this.showAppBar});
final bool? showAppBar;
@override
State<PlaySetting> createState() => _PlaySettingState();
@@ -21,9 +23,12 @@ class _PlaySettingState extends State<PlaySetting> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('播放器设置')),
appBar: widget.showAppBar == false ? null : AppBar(title: Text('播放器设置')),
body: ListView(
children: playSettings.map((item) => item.widget).toList(),
children: [
...playSettings.map((item) => item.widget),
SizedBox(height: MediaQuery.paddingOf(context).bottom + 80),
],
),
);
}

View File

@@ -2,14 +2,19 @@ import 'package:PiliPlus/pages/setting/widgets/model.dart';
import 'package:flutter/material.dart';
class PrivacySetting extends StatelessWidget {
const PrivacySetting({super.key});
const PrivacySetting({super.key, this.showAppBar});
final bool? showAppBar;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('隐私设置')),
appBar: showAppBar == false ? null : AppBar(title: Text('隐私设置')),
body: ListView(
children: privacySettings.map((item) => item.widget).toList(),
children: [
...privacySettings.map((item) => item.widget),
SizedBox(height: MediaQuery.paddingOf(context).bottom + 80),
],
),
);
}

View File

@@ -2,12 +2,14 @@ import 'package:PiliPlus/pages/setting/widgets/model.dart';
import 'package:flutter/material.dart';
class RecommendSetting extends StatelessWidget {
const RecommendSetting({super.key});
const RecommendSetting({super.key, this.showAppBar});
final bool? showAppBar;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('推荐流设置')),
appBar: showAppBar == false ? null : AppBar(title: Text('推荐流设置')),
body: ListView(
children: [
...recommendSettings.map((item) => item.widget),
@@ -24,7 +26,8 @@ class RecommendSetting extends StatelessWidget {
color:
Theme.of(context).colorScheme.outline.withOpacity(0.7)),
),
)
),
SizedBox(height: MediaQuery.paddingOf(context).bottom + 80),
],
),
);

View File

@@ -1,7 +1,9 @@
import 'package:PiliPlus/common/widgets/http_error.dart';
import 'package:PiliPlus/pages/setting/widgets/model.dart';
import 'package:PiliPlus/utils/grid.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:waterfall_flow/waterfall_flow.dart';
class SettingsSearchPage extends StatefulWidget {
const SettingsSearchPage({super.key});
@@ -78,8 +80,18 @@ class _SettingsSearchPageState extends State<SettingsSearchPage> {
? CustomScrollView(
slivers: [HttpError()],
)
: ListView(
children: _list.map((item) => item.widget).toList(),
: CustomScrollView(
slivers: [
SliverWaterfallFlow.extent(
maxCrossAxisExtent: Grid.smallCardWidth * 2,
children: [
..._list.map((item) => item.widget),
SizedBox(
height: MediaQuery.paddingOf(context).bottom + 80,
),
],
),
],
),
),
);

View File

@@ -2,14 +2,19 @@ import 'package:PiliPlus/pages/setting/widgets/model.dart';
import 'package:flutter/material.dart';
class StyleSetting extends StatelessWidget {
const StyleSetting({super.key});
const StyleSetting({super.key, this.showAppBar});
final bool? showAppBar;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('外观设置')),
appBar: showAppBar == false ? null : AppBar(title: Text('外观设置')),
body: ListView(
children: styleSettings.map((item) => item.widget).toList(),
children: [
...styleSettings.map((item) => item.widget),
SizedBox(height: MediaQuery.paddingOf(context).bottom + 80),
],
),
);
}

View File

@@ -2,14 +2,19 @@ import 'package:PiliPlus/pages/setting/widgets/model.dart';
import 'package:flutter/material.dart';
class VideoSetting extends StatelessWidget {
const VideoSetting({super.key});
const VideoSetting({super.key, this.showAppBar});
final bool? showAppBar;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('音视频设置')),
appBar: showAppBar == false ? null : AppBar(title: Text('音视频设置')),
body: ListView(
children: videoSettings.map((item) => item.widget).toList(),
children: [
...videoSettings.map((item) => item.widget),
SizedBox(height: MediaQuery.paddingOf(context).bottom + 80),
],
),
);
}

View File

@@ -1,4 +1,11 @@
import 'package:PiliPlus/pages/about/index.dart';
import 'package:PiliPlus/pages/main/controller.dart';
import 'package:PiliPlus/pages/setting/extra_setting.dart';
import 'package:PiliPlus/pages/setting/play_setting.dart';
import 'package:PiliPlus/pages/setting/privacy_setting.dart';
import 'package:PiliPlus/pages/setting/recommend_setting.dart';
import 'package:PiliPlus/pages/setting/style_setting.dart';
import 'package:PiliPlus/pages/setting/video_setting.dart';
import 'package:PiliPlus/utils/extension.dart';
import 'package:PiliPlus/utils/login.dart';
import 'package:PiliPlus/utils/storage.dart';
@@ -8,145 +15,248 @@ import 'package:get/get.dart';
import '../../http/init.dart';
class SettingPage extends StatelessWidget {
class _SettingsModel {
final String name;
final String title;
final String? subtitle;
final IconData icon;
const _SettingsModel({
required this.name,
required this.title,
this.subtitle,
required this.icon,
});
}
class SettingPage extends StatefulWidget {
const SettingPage({super.key});
@override
State<SettingPage> createState() => _SettingPageState();
}
class _SettingPageState extends State<SettingPage> {
late String _type = 'privacySetting';
final RxBool _isLogin = GStorage.isLogin.obs;
TextStyle get _titleStyle => Theme.of(context).textTheme.titleMedium!;
TextStyle get _subTitleStyle => Theme.of(context)
.textTheme
.labelMedium!
.copyWith(color: Theme.of(context).colorScheme.outline);
bool get _isPortrait => context.orientation == Orientation.portrait;
final List<_SettingsModel> _items = [
_SettingsModel(
name: 'privacySetting',
title: '隐私设置',
subtitle: '黑名单、无痕模式',
icon: Icons.privacy_tip_outlined,
),
_SettingsModel(
name: 'recommendSetting',
title: '推荐流设置',
subtitle: '推荐来源web/app、刷新保留内容、过滤器',
icon: Icons.explore_outlined,
),
_SettingsModel(
name: 'videoSetting',
title: '音视频设置',
subtitle: '画质、音质、解码、缓冲、音频输出等',
icon: Icons.video_settings_outlined,
),
_SettingsModel(
name: 'playSetting',
title: '播放器设置',
subtitle: '双击/长按、全屏、后台播放、弹幕、字幕、底部进度条等',
icon: Icons.touch_app_outlined,
),
_SettingsModel(
name: 'styleSetting',
title: '外观设置',
subtitle: '横屏适配(平板)、侧栏、列宽、首页、动态红点、主题、字号、图片、帧率等',
icon: Icons.style_outlined,
),
_SettingsModel(
name: 'extraSetting',
title: '其它设置',
subtitle: '震动、搜索、收藏、ai、评论、动态、代理、更新检查等',
icon: Icons.extension_outlined,
),
_SettingsModel(
name: 'about',
title: '关于',
icon: Icons.info_outline,
),
];
@override
Widget build(BuildContext context) {
RxBool isLogin = GStorage.isLogin.obs;
final TextStyle titleStyle = Theme.of(context).textTheme.titleMedium!;
final TextStyle subTitleStyle = Theme.of(context)
.textTheme
.labelMedium!
.copyWith(color: Theme.of(context).colorScheme.outline);
return Scaffold(
appBar: AppBar(title: Text('设置')),
body: ListView(
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: InkWell(
onTap: () => Get.toNamed('/settingsSearch'),
appBar: AppBar(
title: _isPortrait
? const Text('设置')
: Text(switch (_type) {
'privacySetting' => '隐私设置',
'recommendSetting' => '推荐流设置',
'videoSetting' => '音视频设置',
'playSetting' => '播放器设置',
'styleSetting' => '外观设置',
'extraSetting' => '其它设置',
'about' => '关于',
_ => '设置',
}),
),
body: _isPortrait
? _buildList
: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(flex: 40, child: _buildList),
VerticalDivider(
width: 1,
color: Theme.of(context).colorScheme.outline.withOpacity(0.1),
),
Expanded(
flex: 60,
child: switch (_type) {
'privacySetting' => PrivacySetting(showAppBar: false),
'recommendSetting' => RecommendSetting(showAppBar: false),
'videoSetting' => VideoSetting(showAppBar: false),
'playSetting' => PlaySetting(showAppBar: false),
'styleSetting' => StyleSetting(showAppBar: false),
'extraSetting' => ExtraSetting(showAppBar: false),
'about' => AboutPage(showAppBar: false),
_ => const SizedBox.shrink(),
},
)
],
),
);
}
void _toPage(String name) {
if (_isPortrait) {
Get.toNamed('/$name');
} else {
_type = name;
setState(() {});
}
}
Color? _getTileColor(String name) {
if (_isPortrait) {
return null;
} else {
return name == _type
? Theme.of(context).colorScheme.onInverseSurface
: null;
}
}
Widget get _buildList {
return ListView(
children: [
_buildSearchItem,
..._items.sublist(0, _items.length - 1).map(
(item) => ListTile(
tileColor: _getTileColor(item.name),
onTap: () => _toPage(item.name),
leading: Icon(item.icon),
title: Text(item.title, style: _titleStyle),
subtitle: item.subtitle == null
? null
: Text(item.subtitle!, style: _subTitleStyle),
),
),
_buildLoginItem,
ListTile(
tileColor: _getTileColor(_items.last.name),
onTap: () => _toPage(_items.last.name),
leading: Icon(_items.last.icon),
title: Text(_items.last.title, style: _titleStyle),
),
SizedBox(height: MediaQuery.paddingOf(context).bottom + 80),
],
);
}
Widget get _buildLoginItem => Obx(
() => _isLogin.value.not
? const SizedBox.shrink()
: ListTile(
leading: const Icon(Icons.logout_outlined),
onTap: () {
showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: const Text('提示'),
content: const Text('确认要退出登录吗'),
actions: [
TextButton(
onPressed: Get.back,
child: Text(
'点错了',
style: TextStyle(
color: Theme.of(context).colorScheme.outline,
),
),
),
TextButton(
onPressed: () async {
// 清空cookie
await Request.cookieManager.cookieJar.deleteAll();
await CookieManager().deleteAllCookies();
Request.dio.options.headers['cookie'] = '';
// 清空本地存储的用户标识
GStorage.userInfo.put('userInfoCache', null);
GStorage.localCache.put(LocalCacheKey.accessKey,
{'mid': -1, 'value': '', 'refresh': ''});
_isLogin.value = false;
if (Get.isRegistered<MainController>()) {
MainController mainController =
Get.find<MainController>();
mainController.isLogin.value = false;
}
await LoginUtils.onLogout();
Get.back();
},
child: const Text('确认'),
)
],
);
},
);
},
title: Text('退出登录', style: _titleStyle),
),
);
Widget get _buildSearchItem => Padding(
padding: const EdgeInsets.only(left: 16, right: 16, bottom: 5),
child: InkWell(
onTap: () => Get.toNamed('/settingsSearch'),
borderRadius: BorderRadius.circular(50),
child: Ink(
padding: const EdgeInsets.symmetric(vertical: 6),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(50),
child: Ink(
padding: const EdgeInsets.symmetric(vertical: 6),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(50),
color: Theme.of(context).colorScheme.onInverseSurface,
),
child: Center(
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
size: MediaQuery.textScalerOf(context).scale(18),
Icons.search,
),
const Text(' 搜索'),
],
color: Theme.of(context).colorScheme.onInverseSurface,
),
child: Center(
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
size: MediaQuery.textScalerOf(context).scale(18),
Icons.search,
),
),
const Text(' 搜索'),
],
),
),
),
ListTile(
onTap: () => Get.toNamed('/privacySetting'),
leading: const Icon(Icons.privacy_tip_outlined),
title: Text('隐私设置', style: titleStyle),
subtitle: Text('黑名单、无痕模式', style: subTitleStyle),
),
ListTile(
onTap: () => Get.toNamed('/recommendSetting'),
leading: const Icon(Icons.explore_outlined),
title: Text('推荐流设置', style: titleStyle),
subtitle: Text('推荐来源web/app、刷新保留内容、过滤器', style: subTitleStyle),
),
ListTile(
onTap: () => Get.toNamed('/videoSetting'),
leading: const Icon(Icons.video_settings_outlined),
title: Text('音视频设置', style: titleStyle),
subtitle: Text('画质、音质、解码、缓冲、音频输出等', style: subTitleStyle),
),
ListTile(
onTap: () => Get.toNamed('/playSetting'),
leading: const Icon(Icons.touch_app_outlined),
title: Text('播放器设置', style: titleStyle),
subtitle: Text('双击/长按、全屏、后台播放、弹幕、字幕、底部进度条等', style: subTitleStyle),
),
ListTile(
onTap: () => Get.toNamed('/styleSetting'),
leading: const Icon(Icons.style_outlined),
title: Text('外观设置', style: titleStyle),
subtitle: Text('横屏适配(平板)、侧栏、列宽、首页、动态红点、主题、字号、图片、帧率等',
style: subTitleStyle),
),
ListTile(
onTap: () => Get.toNamed('/extraSetting'),
leading: const Icon(Icons.extension_outlined),
title: Text('其它设置', style: titleStyle),
subtitle: Text('震动、搜索、收藏、ai、评论、动态、代理、更新检查等', style: subTitleStyle),
),
Obx(
() => isLogin.value.not
? const SizedBox.shrink()
: ListTile(
leading: const Icon(Icons.logout_outlined),
onTap: () {
showDialog(
context: context,
builder: (context) {
return AlertDialog(
title: const Text('提示'),
content: const Text('确认要退出登录吗'),
actions: [
TextButton(
onPressed: Get.back,
child: Text(
'点错了',
style: TextStyle(
color:
Theme.of(context).colorScheme.outline,
),
),
),
TextButton(
onPressed: () async {
// 清空cookie
await Request.cookieManager.cookieJar
.deleteAll();
await CookieManager().deleteAllCookies();
Request.dio.options.headers['cookie'] = '';
// 清空本地存储的用户标识
GStorage.userInfo.put('userInfoCache', null);
GStorage.localCache.put(
LocalCacheKey.accessKey,
{'mid': -1, 'value': '', 'refresh': ''});
isLogin.value = false;
if (Get.isRegistered<MainController>()) {
MainController mainController =
Get.find<MainController>();
mainController.isLogin.value = false;
}
await LoginUtils.onLogout();
Get.back();
},
child: const Text('确认'),
)
],
);
},
);
},
title: Text('退出登录', style: titleStyle),
),
),
ListTile(
leading: const Icon(Icons.info_outline),
onTap: () => Get.toNamed('/about'),
title: Text('关于', style: titleStyle),
),
],
),
);
}
),
);
}

View File

@@ -1710,6 +1710,7 @@ List<SettingsModel> get extraSettings => [
divisions: 8,
precise: 2,
value: GStorage.refreshDragPercentage,
suffix: 'x',
);
},
);