mirror of
https://github.com/bggRGjQaUbCoE/PiliPlus.git
synced 2026-05-30 23:58:13 +08:00
feat: vertical tabbar
Signed-off-by: dom <githubaccount56556@proton.me>
This commit is contained in:
2399
lib/common/widgets/flutter/vertical_tabs.dart
Normal file
2399
lib/common/widgets/flutter/vertical_tabs.dart
Normal file
File diff suppressed because it is too large
Load Diff
@@ -2,9 +2,7 @@ import 'dart:async';
|
|||||||
|
|
||||||
import 'package:PiliPlus/models/common/rank_type.dart';
|
import 'package:PiliPlus/models/common/rank_type.dart';
|
||||||
import 'package:PiliPlus/pages/common/common_controller.dart';
|
import 'package:PiliPlus/pages/common/common_controller.dart';
|
||||||
import 'package:PiliPlus/pages/main/controller.dart';
|
|
||||||
import 'package:PiliPlus/pages/rank/zone/controller.dart';
|
import 'package:PiliPlus/pages/rank/zone/controller.dart';
|
||||||
import 'package:flutter/foundation.dart' show clampDouble;
|
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:get/get.dart';
|
import 'package:get/get.dart';
|
||||||
|
|
||||||
@@ -21,27 +19,6 @@ class RankController extends GetxController
|
|||||||
@override
|
@override
|
||||||
ScrollController get scrollController => controller.scrollController;
|
ScrollController get scrollController => controller.scrollController;
|
||||||
|
|
||||||
final _mainCtr = Get.find<MainController>();
|
|
||||||
|
|
||||||
final tabScrollController = ScrollController();
|
|
||||||
|
|
||||||
void scrollToCurrentIndex(double tabHeight, int index) {
|
|
||||||
final position = tabScrollController.position;
|
|
||||||
final offset = clampDouble(
|
|
||||||
(tabHeight * (2 * index + 1) - position.viewportDimension) / 2.0 +
|
|
||||||
(_mainCtr.useBottomNav && (_mainCtr.showBottomBar?.value ?? true)
|
|
||||||
? 80.0
|
|
||||||
: 0.0),
|
|
||||||
position.minScrollExtent,
|
|
||||||
position.maxScrollExtent,
|
|
||||||
);
|
|
||||||
tabScrollController.animateTo(
|
|
||||||
offset,
|
|
||||||
duration: kTabScrollDuration,
|
|
||||||
curve: Curves.ease,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void onInit() {
|
void onInit() {
|
||||||
super.onInit();
|
super.onInit();
|
||||||
@@ -51,7 +28,6 @@ class RankController extends GetxController
|
|||||||
@override
|
@override
|
||||||
void onClose() {
|
void onClose() {
|
||||||
tabController.dispose();
|
tabController.dispose();
|
||||||
tabScrollController.dispose();
|
|
||||||
super.onClose();
|
super.onClose();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
import 'package:PiliPlus/common/widgets/flutter/vertical_tabs.dart';
|
||||||
import 'package:PiliPlus/models/common/rank_type.dart';
|
import 'package:PiliPlus/models/common/rank_type.dart';
|
||||||
import 'package:PiliPlus/pages/rank/controller.dart';
|
import 'package:PiliPlus/pages/rank/controller.dart';
|
||||||
import 'package:PiliPlus/pages/rank/zone/view.dart';
|
import 'package:PiliPlus/pages/rank/zone/view.dart';
|
||||||
@@ -43,76 +44,24 @@ class _RankPageState extends State<RankPage>
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@override
|
|
||||||
void didChangeDependencies() {
|
|
||||||
super.didChangeDependencies();
|
|
||||||
_tabHeight = MediaQuery.textScalerOf(context).scale(21) + 14;
|
|
||||||
}
|
|
||||||
|
|
||||||
late double _tabHeight;
|
|
||||||
|
|
||||||
Widget _buildTab(ThemeData theme) {
|
Widget _buildTab(ThemeData theme) {
|
||||||
return SizedBox(
|
return VerticalTabBar(
|
||||||
width: 64,
|
dividerWidth: 0,
|
||||||
child: Obx(() {
|
isScrollable: true,
|
||||||
final tabIndex = _rankController.tabIndex.value;
|
indicatorWeight: 3,
|
||||||
return ListView.builder(
|
indicatorSize: .tab,
|
||||||
controller: _rankController.tabScrollController,
|
controller: _rankController.tabController,
|
||||||
padding: .only(bottom: MediaQuery.paddingOf(context).bottom + 105),
|
padding: .only(bottom: MediaQuery.paddingOf(context).bottom + 105),
|
||||||
itemCount: RankType.values.length,
|
tabs: RankType.values.map((e) => VerticalTab(text: e.label)).toList(),
|
||||||
itemBuilder: (context, index) {
|
onTap: (index) {
|
||||||
final item = RankType.values[index];
|
if (!_rankController.tabController.indexIsChanging) {
|
||||||
final isCurr = index == tabIndex;
|
_rankController.animateToTop();
|
||||||
return SizedBox(
|
} else {
|
||||||
height: _tabHeight,
|
_rankController
|
||||||
child: Material(
|
..tabIndex.value = index
|
||||||
color: isCurr
|
..tabController.animateTo(index);
|
||||||
? theme.colorScheme.onInverseSurface
|
}
|
||||||
: theme.colorScheme.surface,
|
},
|
||||||
child: InkWell(
|
|
||||||
onTap: isCurr
|
|
||||||
? _rankController.animateToTop
|
|
||||||
: () => _rankController
|
|
||||||
..tabIndex.value = index
|
|
||||||
..tabController.animateTo(index)
|
|
||||||
..scrollToCurrentIndex(_tabHeight, index),
|
|
||||||
child: Row(
|
|
||||||
mainAxisSize: MainAxisSize.min,
|
|
||||||
children: [
|
|
||||||
if (isCurr)
|
|
||||||
Container(
|
|
||||||
width: 3,
|
|
||||||
height: double.infinity,
|
|
||||||
color: theme.colorScheme.primary,
|
|
||||||
)
|
|
||||||
else
|
|
||||||
const SizedBox(width: 3),
|
|
||||||
Expanded(
|
|
||||||
flex: 1,
|
|
||||||
child: Container(
|
|
||||||
alignment: Alignment.center,
|
|
||||||
padding: const .symmetric(vertical: 7),
|
|
||||||
child: Text(
|
|
||||||
item.label,
|
|
||||||
style: isCurr
|
|
||||||
? TextStyle(
|
|
||||||
fontSize: 15,
|
|
||||||
color: theme.colorScheme.primary,
|
|
||||||
)
|
|
||||||
: const TextStyle(fontSize: 15),
|
|
||||||
maxLines: 1,
|
|
||||||
overflow: TextOverflow.ellipsis,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
);
|
|
||||||
},
|
|
||||||
);
|
|
||||||
}),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user