AiKeyboard2025/lib/widget/tabbar/custom_tab_indicator.dart

import 'dart:ui';

import 'package:flutter/material.dart';

/// 自定义Tab的指示器
class CustomTabIndicator extends Decoration {
  const CustomTabIndicator({
    // 指示器的宽度
    this.width = 20,
    // 指示器的形状，默认为圆角
    this.strokeCap = StrokeCap.round,
    // 指示器的高度和纯颜色，渐变色优先于这里的纯颜色
    this.borderSide = const BorderSide(width: 2.0, color: Colors.white),
    // 指示器距离Tab的外边距
    this.insets = EdgeInsets.zero,
    // 渐变色
    this.gradient,
  });

  final BorderSide borderSide;
  final EdgeInsetsGeometry insets;

  /// 新增属性：控制器宽度
  final double width;

  /// 新增属性：控制器边角形状
  final StrokeCap strokeCap;

  /// 新增属性：渐变色
  final Gradient? gradient;

  @override
  Decoration? lerpFrom(Decoration? a, double t) {
    if (a is CustomTabIndicator) {
      return CustomTabIndicator(
        borderSide: BorderSide.lerp(a.borderSide, borderSide, t),
        insets: EdgeInsetsGeometry.lerp(a.insets, insets, t)!,
        width: lerpDouble(a.width, width, t)!,
        // 渐变插值
        gradient: Gradient.lerp(a.gradient, gradient, t),
      );
    }
    return super.lerpFrom(a, t);
  }

  @override
  Decoration? lerpTo(Decoration? b, double t) {
    if (b is CustomTabIndicator) {
      return CustomTabIndicator(
        borderSide: BorderSide.lerp(borderSide, b.borderSide, t),
        insets: EdgeInsetsGeometry.lerp(insets, b.insets, t)!,
        width: lerpDouble(width, b.width, t)!,
        // 渐变插值
        gradient: Gradient.lerp(gradient, b.gradient, t),
      );
    }
    return super.lerpTo(b, t);
  }

  @override
  BoxPainter createBoxPainter([VoidCallback? onChanged]) {
    return _UnderlinePainter(this, onChanged);
  }

  /// 决定控制器宽度的方法
  Rect _indicatorRectFor(Rect rect, TextDirection textDirection) {
    final Rect indicator = insets.resolve(textDirection).deflateRect(rect);
    double cw = (indicator.left + indicator.right) / 2;

    // 指示器居中
    return Rect.fromLTWH(
      cw - width / 2,
      indicator.bottom - borderSide.width,
      width,
      borderSide.width,
    );
  }

  @override
  Path getClipPath(Rect rect, TextDirection textDirection) {
    return Path()..addRect(_indicatorRectFor(rect, textDirection));
  }
}

class _UnderlinePainter extends BoxPainter {
  _UnderlinePainter(this.decoration, VoidCallback? onChanged)
    : super(onChanged);

  final CustomTabIndicator decoration;

  @override
  void paint(Canvas canvas, Offset offset, ImageConfiguration configuration) {
    final Rect rect = offset & configuration.size!;
    final TextDirection textDirection = configuration.textDirection!;
    final Rect indicator = decoration
        ._indicatorRectFor(rect, textDirection)
        .deflate(decoration.borderSide.width / 2.0);

    final Paint paint =
        Paint()
          ..strokeCap = decoration.strokeCap
          ..strokeWidth = decoration.borderSide.width;

    // 优先使用渐变色
    if (decoration.gradient != null) {
      final gradient = decoration.gradient!;
      paint.shader = gradient.createShader(
        Rect.fromPoints(indicator.bottomLeft, indicator.bottomRight),
      );
    } else {
      // 使用纯色
      paint.color = decoration.borderSide.color;
    }

    canvas.drawLine(indicator.bottomLeft, indicator.bottomRight, paint);
  }
}