91 lines
3.0 KiB
Dart
Executable File
91 lines
3.0 KiB
Dart
Executable File
import 'package:flutter/material.dart';
|
||
|
||
// ------------------------------------------------------
|
||
// author：AllenSu
|
||
// date ：2021/4/18 11:23 AM
|
||
// usage ：自定义 UnderlineTabIndicator
|
||
// CSDN ：https://blog.csdn.net/qq_42351033
|
||
// ------------------------------------------------------
|
||
|
||
class CustomUnderlineTabIndicator extends Decoration { // 控制器的宽度
|
||
|
||
const CustomUnderlineTabIndicator({
|
||
this.borderSide = const BorderSide(width: 2, color: Colors.white),
|
||
this.insets = EdgeInsets.zero,
|
||
this.strokeCap: StrokeCap.square,
|
||
this.width: 20,
|
||
}) : assert(borderSide != null),
|
||
assert(insets != null);
|
||
final BorderSide? borderSide;
|
||
final EdgeInsetsGeometry? insets;
|
||
final StrokeCap? strokeCap; // 控制器的边角形状
|
||
final double? width;
|
||
|
||
@override
|
||
Decoration? lerpFrom(Decoration? a, double t) {
|
||
if (a is CustomUnderlineTabIndicator) {
|
||
return CustomUnderlineTabIndicator(
|
||
borderSide: BorderSide.lerp(a.borderSide!, borderSide!, t),
|
||
insets: EdgeInsetsGeometry.lerp(a.insets!, insets!, t),
|
||
);
|
||
}
|
||
return lerpFrom(a, t);
|
||
}
|
||
|
||
@override
|
||
Decoration? lerpTo(Decoration? b, double t) {
|
||
if (b is CustomUnderlineTabIndicator) {
|
||
return CustomUnderlineTabIndicator(
|
||
borderSide: BorderSide.lerp(borderSide!, b.borderSide!, t),
|
||
insets: EdgeInsetsGeometry.lerp(insets, b.insets, t),
|
||
);
|
||
}
|
||
return super.lerpTo(b, t);
|
||
}
|
||
|
||
@override
|
||
_UnderlinePainter createBoxPainter([VoidCallback? onChanged]) {
|
||
return _UnderlinePainter(this, onChanged!);
|
||
}
|
||
|
||
@override
|
||
Path getClipPath(Rect rect, TextDirection textDirection) {
|
||
return Path()..addRect(_indicatorRectFor(rect, textDirection));
|
||
}
|
||
|
||
Rect _indicatorRectFor(Rect? rect, TextDirection? textDirection) {
|
||
assert(rect != null);
|
||
assert(textDirection != null);
|
||
final Rect indicator = insets!.resolve(textDirection).deflateRect(rect!);
|
||
|
||
// 希望的宽度
|
||
double wantWidth = width!;
|
||
// 取中间坐标
|
||
double cw = (indicator.left + indicator.right) / 2;
|
||
// 这里是核心代码
|
||
return Rect.fromLTWH(cw - wantWidth / 2,
|
||
indicator.bottom - borderSide!.width, wantWidth, borderSide!.width);
|
||
}
|
||
}
|
||
|
||
class _UnderlinePainter extends BoxPainter {
|
||
_UnderlinePainter(this.decoration, VoidCallback onChanged)
|
||
: assert(decoration != null),
|
||
super(onChanged);
|
||
|
||
final CustomUnderlineTabIndicator? decoration;
|
||
|
||
@override
|
||
void paint(Canvas canvas, Offset offset, ImageConfiguration configuration) {
|
||
assert(configuration != null);
|
||
assert(configuration.size != null);
|
||
final Rect rect = offset & configuration.size!;
|
||
final TextDirection textDirection = configuration.textDirection!;
|
||
final Rect indicator = decoration!
|
||
._indicatorRectFor(rect, textDirection)
|
||
.deflate(decoration!.borderSide!.width / 2);
|
||
final Paint paint = decoration!.borderSide!.toPaint()
|
||
..strokeCap = decoration!.strokeCap!; // 这里修改控制器边角的形状
|
||
canvas.drawLine(indicator.bottomLeft, indicator.bottomRight, paint);
|
||
}
|
||
} |