intimacy_analyse_page.dart 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
  1. import 'package:flutter/material.dart';
  2. import 'package:flutter_screenutil/flutter_screenutil.dart';
  3. import 'package:get/get.dart';
  4. import 'package:keyboard/base/base_page.dart';
  5. import 'package:keyboard/resource/string.gen.dart';
  6. import '../../resource/assets.gen.dart';
  7. import '../../resource/colors.gen.dart';
  8. import '../../router/app_pages.dart';
  9. import '../../widget/tabbar/custom_tab_indicator.dart';
  10. import 'intimacy_analyse_controller.dart';
  11. /// 亲密度报告页
  12. class IntimacyAnalysePage extends BasePage<IntimacyAnalyseController> {
  13. const IntimacyAnalysePage({super.key});
  14. @override
  15. bool immersive() {
  16. // 开启沉浸式
  17. return true;
  18. }
  19. @override
  20. backgroundColor() {
  21. return Colors.transparent;
  22. }
  23. static start() {
  24. Get.toNamed(RoutePath.intimacyAnalyse);
  25. }
  26. @override
  27. Widget buildBody(BuildContext context) {
  28. return Scaffold(
  29. backgroundColor: backgroundColor(),
  30. body: Container(
  31. decoration: BoxDecoration(
  32. image: DecorationImage(
  33. image: Assets.images.bgIntimacyAnalyse.provider(),
  34. fit: BoxFit.fill,
  35. ),
  36. ),
  37. child: Column(
  38. children: [_buildStatusBar(), _buildTopBar(), _buildContent()],
  39. ),
  40. ),
  41. );
  42. }
  43. /// 导航栏占位
  44. Widget _buildStatusBar() {
  45. return Container(
  46. height: MediaQuery.of(Get.context!).padding.top,
  47. color: backgroundColor(),
  48. );
  49. }
  50. /// 顶部栏
  51. Widget _buildTopBar() {
  52. return Container(
  53. height: kToolbarHeight,
  54. width: double.infinity,
  55. padding: EdgeInsets.symmetric(horizontal: 16.0),
  56. child: ConstrainedBox(
  57. constraints: BoxConstraints(minWidth: double.infinity),
  58. child: Stack(
  59. alignment: Alignment.center,
  60. children: [
  61. // 返回按钮
  62. Positioned(
  63. left: 16.0,
  64. child: GestureDetector(
  65. onTap: controller.clickBack,
  66. child: Assets.images.iconWhiteBackArrow.image(
  67. width: 24.w,
  68. height: 24.h,
  69. ),
  70. ),
  71. ),
  72. // TabBar
  73. Positioned(child: _buildTabBar()),
  74. ],
  75. ),
  76. ),
  77. );
  78. }
  79. /// 指示器
  80. TabBar _buildTabBar() {
  81. return TabBar(
  82. // 是否可以滚动
  83. isScrollable: true,
  84. // 去除底部的黑线
  85. dividerHeight: 0,
  86. // 去除左边的边距,让Tab居中
  87. tabAlignment: TabAlignment.start,
  88. // 指示器的颜色
  89. indicator: _buildGradientLineIndicator(),
  90. // 选中时的颜色
  91. labelStyle: TextStyle(
  92. fontSize: 17.sp,
  93. fontWeight: FontWeight.bold,
  94. color: ColorName.white,
  95. ),
  96. // 未选中时的颜色
  97. unselectedLabelStyle: TextStyle(
  98. fontSize: 17.sp,
  99. color: ColorName.white70,
  100. ),
  101. // 配置Tab数据
  102. tabs:
  103. controller.tabBarList.map((tab) {
  104. return Tab(text: tab);
  105. }).toList(),
  106. controller: controller.tabController,
  107. onTap: (index) {
  108. controller.handleTabChange(index);
  109. },
  110. );
  111. }
  112. // 自定义渐变指示器
  113. CustomTabIndicator _buildGradientLineIndicator() {
  114. return CustomTabIndicator(width: 16.0, strokeCap: StrokeCap.round);
  115. }
  116. /// PageView
  117. Widget _buildContent() {
  118. return Expanded(
  119. child: PageView(
  120. controller: controller.pageController,
  121. onPageChanged: (index) {
  122. controller.handlePageChange(index);
  123. },
  124. children: [
  125. Center(child: Text(StringName.intimacyAnalyseTabReport)),
  126. Center(child: Text(StringName.intimacyAnalyseTabScreenshotReply)),
  127. ],
  128. ),
  129. );
  130. }
  131. }