dart
import 'package:flutter/material.dart';
class MyCustomIndicator extends Decoration {
final double indWidth;
final double indHeight;
final double radius;
MyCustomIndicator({this.indWidth = 70.0, this.indHeight = 12.0, this.radius = 5});
@override
BoxPainter createBoxPainter([VoidCallback onChanged]) {
return _CustomBoxPainter(this, onChanged, indWidth, indHeight, radius);
}
}
class _CustomBoxPainter extends BoxPainter {
final MyCustomIndicator decoration;
final double indWidth;
final double indHeight;
final double radius;
_CustomBoxPainter(this.decoration, VoidCallback onChanged, this.indWidth, this.indHeight, this.radius)
: super(onChanged);
@override
void paint(Canvas canvas, Offset offset, ImageConfiguration configuration) {
final size = configuration.size;
final newOffset = Offset(offset.dx + (size.width - indWidth) / 2, size.height - indHeight);
final Rect rect = newOffset & Size(indWidth, indHeight);
final Paint paint = Paint();
paint.color = Colors.yellow;
paint.style = PaintingStyle.fill;
canvas.drawRRect(
RRect.fromRectAndRadius(rect, Radius.circular(radius)), // 圆角半径
paint,
);
}
}
使用
dart
TabBar(
isScrollable: false,
labelPadding: EdgeInsets.symmetric(horizontal: 0),
indicator: MyCustomIndicator(),
labelColor: Color(0xff333333),
labelStyle: TextStyle(
fontSize: 30.sp,
fontWeight: FontWeight.w600,
),
unselectedLabelColor: JadeColors.grey,
unselectedLabelStyle: TextStyle(
fontSize: 30.sp,
),
indicatorSize: TabBarIndicatorSize.label,
controller: _tabController,
tabs: _tabs
.map((value) => Container(padding: EdgeInsets.symmetric(horizontal: 20.w),child: Text(value))).toList(),
onTap: (index) {},
)