|
|
@@ -1,3 +1,4 @@
|
|
|
+import 'package:collection/collection.dart';
|
|
|
import 'package:flutter/material.dart';
|
|
|
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
|
|
import 'package:keyboard/base/base_view.dart';
|
|
|
@@ -23,6 +24,7 @@ class IntimacyAnalyseScreenshotReplyView
|
|
|
Widget buildBody(BuildContext context) {
|
|
|
return Column(
|
|
|
children: [
|
|
|
+ SizedBox(height: 13.h),
|
|
|
// TabBar
|
|
|
_buildTabBar(),
|
|
|
// 内容
|
|
|
@@ -32,56 +34,64 @@ class IntimacyAnalyseScreenshotReplyView
|
|
|
}
|
|
|
|
|
|
/// TabBar
|
|
|
- TabBar _buildTabBar() {
|
|
|
- return TabBar(
|
|
|
- // 是否可以滚动
|
|
|
- isScrollable: true,
|
|
|
- // 去除底部的黑线
|
|
|
- dividerHeight: 0,
|
|
|
- // 去除左边的边距,让Tab居中
|
|
|
- tabAlignment: TabAlignment.start,
|
|
|
- // 指示器的颜色
|
|
|
- indicator: _buildGradientLineIndicator(),
|
|
|
- // 选中时的颜色
|
|
|
- labelStyle: TextStyle(
|
|
|
- fontSize: 17.sp,
|
|
|
- fontWeight: FontWeight.bold,
|
|
|
- color: ColorName.white,
|
|
|
+ Widget _buildTabBar() {
|
|
|
+ return Container(
|
|
|
+ padding: EdgeInsets.symmetric(vertical: 2.w, horizontal: 2.w),
|
|
|
+ decoration: BoxDecoration(
|
|
|
+ color: ColorName.white50,
|
|
|
+ borderRadius: BorderRadius.all(Radius.circular(18.r)),
|
|
|
),
|
|
|
- // 未选中时的颜色
|
|
|
- unselectedLabelStyle: TextStyle(
|
|
|
- fontSize: 17.sp,
|
|
|
- color: ColorName.white70,
|
|
|
- ),
|
|
|
- // 配置Tab数据
|
|
|
- tabs:
|
|
|
- controller.tabBarList.map((tab) {
|
|
|
- return Tab(text: tab);
|
|
|
- }).toList(),
|
|
|
- controller: controller.tabController,
|
|
|
- onTap: (index) {
|
|
|
- controller.handleTabChange(index);
|
|
|
- },
|
|
|
- );
|
|
|
- }
|
|
|
-
|
|
|
- // 自定义渐变指示器
|
|
|
- CustomTabIndicator _buildGradientLineIndicator() {
|
|
|
- return CustomTabIndicator(
|
|
|
- // 指示器的宽度
|
|
|
- width: 16.0,
|
|
|
- // 指示器的形状,圆角
|
|
|
- strokeCap: StrokeCap.round,
|
|
|
- // 设置渐变色
|
|
|
- gradient: LinearGradient(
|
|
|
- colors: [ColorName.colorBrand, ColorName.colorAuxiliary1],
|
|
|
- begin: Alignment.centerLeft,
|
|
|
- end: Alignment.centerRight,
|
|
|
+ child: TabBar(
|
|
|
+ // 是否可以滚动
|
|
|
+ isScrollable: false,
|
|
|
+ // Tab居中
|
|
|
+ tabAlignment: TabAlignment.center,
|
|
|
+ // 去除底部的黑线
|
|
|
+ dividerHeight: 0,
|
|
|
+ indicatorPadding: EdgeInsets.zero,
|
|
|
+ // 让Tab严格贴近背景,默认左右会有padding
|
|
|
+ indicatorSize: TabBarIndicatorSize.tab,
|
|
|
+ // 去除Tab默认的padding,否则Tab之间会有默认的间距
|
|
|
+ labelPadding: EdgeInsets.zero,
|
|
|
+ // 渐变指示器
|
|
|
+ indicator: BoxDecoration(
|
|
|
+ // 渐变背景
|
|
|
+ gradient: LinearGradient(
|
|
|
+ colors: [ColorName.bgPurpleTab1, ColorName.bgPurpleTab2],
|
|
|
+ begin: Alignment.centerLeft,
|
|
|
+ end: Alignment.centerRight,
|
|
|
+ ),
|
|
|
+ shape: BoxShape.rectangle,
|
|
|
+ borderRadius: BorderRadius.all(Radius.circular(47.r)),
|
|
|
+ ),
|
|
|
+ // 选中时的颜色
|
|
|
+ labelStyle: TextStyle(
|
|
|
+ fontSize: 12.sp,
|
|
|
+ fontWeight: FontWeight.w700,
|
|
|
+ color: ColorName.white,
|
|
|
+ ),
|
|
|
+ // 未选中时的颜色
|
|
|
+ unselectedLabelStyle: TextStyle(
|
|
|
+ fontSize: 12.sp,
|
|
|
+ color: ColorName.black60,
|
|
|
+ fontWeight: FontWeight.w400,
|
|
|
+ ),
|
|
|
+ // 配置Tab数据
|
|
|
+ tabs:
|
|
|
+ controller.tabBarList.mapIndexed((int index, tabName) {
|
|
|
+ return Tab(
|
|
|
+ height: 38.h,
|
|
|
+ child: SizedBox(
|
|
|
+ width: 127.w,
|
|
|
+ child: Center(child: Text(tabName)),
|
|
|
+ ),
|
|
|
+ );
|
|
|
+ }).toList(),
|
|
|
+ controller: controller.tabController,
|
|
|
+ onTap: (index) {
|
|
|
+ controller.handleTabChange(index);
|
|
|
+ },
|
|
|
),
|
|
|
- // 指示器距离Tab的外边距
|
|
|
- insets: EdgeInsets.only(top: 9),
|
|
|
- // 指示器的高度
|
|
|
- borderSide: BorderSide(width: 4),
|
|
|
);
|
|
|
}
|
|
|
|