XRadio<T> constructor

XRadio<T>({ Key? key, required T value, required T groupValue, required ValueChanged<T> onChanged, double width = 27, double height = 27, bool enable = true, bool toggleable = false, FocusNode? focusNode, bool autofocus = false, Color selectedColor = const Color(0xff2593fc), Color normalColor = const Color(0xffd9d9d9), bool hasSpace = true, double? border, Widget? child, Widget? selectedChild, Widget? hoverChild, Gradient? gradient, Duration duration = const Duration(milliseconds: 150), bool fill = true, XRadioCorner? corner, })

默认情况下，XRadio 有一套十分灵活的样式风格。 开发者无需自己配置 normal、selected、disableNormal、disableSelected 以及 hover。 XRadio 提供了丰富的配置选项，以帮助开发者快速完成视图的构建。 如果在应用中有独特的设计，可以使用 XRadio.custom 来完成特殊样式的构建。XRadio 将帮助开发者完成状态管理的构建。 一般参数 (General parameters)：

selectedColor 选中状态下的颜色 (Selected color)

normalColor 未选中状态下的颜色 (Unselected color)

hasSpace 内部填充和边缘是否有间距。 默认为 true。间距由 FSuper 提供黄金比例，开发者无需关心。 (Is there a gap between the inner padding and the edges. The default is true. The spacing is provided by FSuper the golden ratio, developers do not need to care.)

border 边框宽。默认由 FSuper 提供黄金比例，开发者无需关心。 (The border is wide. The default is true. The spacing is provided by FSuper the golden ratio, developers do not need to care.)

child 未选中状态下的装饰组件，处于最上层级。 (The decoration components in the unselected state are at the top level.)

selectedChild 选中状态下的装饰组件，处于最上层级。 (The decorative component in the selected state is at the top level.)

hoverChild 鼠标悬停时的装饰组件，处于最上层级。 (The decoration component when hovering the mouse is at the top level.)

gradient 该属性允许配置选中状态下的渐变效果，会覆盖 selectedColor 。 (This property allows to configure the gradient effect in the selected state, which will override selectedColor.)

duration 状态切换动画时长。默认 150ms。 (Duration of state switching animation. The default is 150ms.)

fill 选中时，是否允许内部填充。默认为 true。 (When selected, whether to allow internal filling. The default is true.)

corner 边角。默认 XRadio 为圆形。 (Corner. The default XRadio is round.)

Implementation

/// 一般参数 (General parameters)：
///
/// [selectedColor] 选中状态下的颜色 (Selected color)
///
/// [normalColor] 未选中状态下的颜色 (Unselected color)
///
/// [hasSpace] 内部填充和边缘是否有间距。
///   默认为 true。间距由 [FSuper] 提供黄金比例，开发者无需关心。
///   (Is there a gap between the inner padding and the edges.
///   The default is true. The spacing is provided by [FSuper] the golden ratio, developers do not need to care.)
///
/// [border] 边框宽。默认由 [FSuper] 提供黄金比例，开发者无需关心。
///   (The border is wide.
///   The default is true. The spacing is provided by [FSuper] the golden ratio, developers do not need to care.)
///
/// [child] 未选中状态下的装饰组件，处于最上层级。
///   (The decoration components in the unselected state are at the top level.)
///
/// [selectedChild] 选中状态下的装饰组件，处于最上层级。
///   (The decorative component in the selected state is at the top level.)
///
/// [hoverChild] 鼠标悬停时的装饰组件，处于最上层级。
///   (The decoration component when hovering the mouse is at the top level.)
///
/// [gradient] 该属性允许配置选中状态下的渐变效果，会覆盖 [selectedColor] 。
///   (This property allows to configure the gradient effect in the selected state, which will override [selectedColor].)
///
/// [duration] 状态切换动画时长。默认 150ms。 (Duration of state switching animation. The default is 150ms.)
///
/// [fill] 选中时，是否允许内部填充。默认为 true。
///   (When selected, whether to allow internal filling. The default is true.)
///
/// [corner] 边角。默认 [XRadio] 为圆形。 (Corner. The default [XRadio] is round.)
XRadio({
  Key? key,
  required this.value,
  required this.groupValue,
  required this.onChanged,
  this.width = 27,
  this.height = 27,
  this.enable = true,
  this.toggleable = false,
  this.focusNode,
  this.autofocus = false,
  Color selectedColor = const Color(0xff2593fc),
  Color normalColor = const Color(0xffd9d9d9),
  bool hasSpace = true,
  double? border,
  Widget? child,
  Widget? selectedChild,
  Widget? hoverChild,
  Gradient? gradient,
  Duration duration = const Duration(milliseconds: 150),
  bool fill = true,
  XRadioCorner? corner,
}) : super(key: key) {
  hoverChild ??= selectedChild;
  border = border ?? width * 0.075;
  BorderRadius borderRadius = corner == null
      ? BorderRadius.all(Radius.circular(width / 2.0))
      : BorderRadius.only(
          topLeft: Radius.circular(corner.leftTopCorner),
          topRight: Radius.circular(corner.rightTopCorner),
          bottomRight: Radius.circular(corner.rightBottomCorner),
          bottomLeft: Radius.circular(corner.leftBottomCorner),
        );
  selected = AnimatedContainer(
    duration: duration,
    decoration: BoxDecoration(
      border: Border.all(
          color: (hasSpace || !fill) ? selectedColor : Colors.transparent,
          width: (hasSpace || !fill) ? border : 0),
      borderRadius: borderRadius,
    ),
    child: Container(
      width: width,
      height: height,
      alignment: Alignment.center,
      child: AnimatedContainer(
        duration: duration,
        width: hasSpace ? width * 0.518 : width,
        height: hasSpace ? height * 0.518 : height,
        decoration: fill
            ? BoxDecoration(
                color: selectedColor,
                borderRadius: borderRadius,
                gradient: gradient,
              )
            : null,
      ),
    ),
  );
  selected = Stack(
    alignment: Alignment.center,
    children: [
      if (selected != null) selected!,
      selectedChild ?? Container(),
    ],
  );
  normal = AnimatedContainer(
    duration: duration,
    decoration: BoxDecoration(
      border: Border.all(color: normalColor, width: border),
      borderRadius: borderRadius,
    ),
    child: Container(
      width: width,
      height: height,
      alignment: Alignment.center,
      child: AnimatedContainer(
        duration: duration,
        width: 0,
        height: 0,
        decoration: fill
            ? BoxDecoration(
                color: normalColor,
                borderRadius: borderRadius,
              )
            : null,
      ),
    ),
  );
  normal = Stack(
    alignment: Alignment.center,
    children: [
      if (normal != null) normal!,
      child ?? Container(),
    ],
  );
  if (kIsWeb == true) {
    disableSelected = Container(
      foregroundDecoration: BoxDecoration(color: const Color(0xfff1f1f1).withOpacity(0.6)),
      child: selected,
    );
    disableNormal = Container(
      foregroundDecoration: BoxDecoration(color: const Color(0xfff1f1f1).withOpacity(0.6)),
      child: normal,
    );
  } else {
    disableSelected = ColorFiltered(
      colorFilter: ColorFilter.mode(const Color(0xfff1f1f1).withOpacity(0.6), BlendMode.srcATop),
      child: selected,
    );
    disableNormal = ColorFiltered(
      colorFilter: ColorFilter.mode(const Color(0xfff1f1f1).withOpacity(0.6), BlendMode.srcATop),
      child: normal,
    );
  }

  hover = AnimatedContainer(
    duration: duration,
    decoration: BoxDecoration(
      border: Border.all(color: selectedColor, width: border),
      borderRadius: borderRadius,
    ),
    child: Container(
      width: width,
      height: height,
      alignment: Alignment.center,
      child: AnimatedContainer(
        duration: duration,
        width: 0,
        height: 0,
        decoration: fill
            ? BoxDecoration(
                color: selectedColor,
                borderRadius: borderRadius,
                gradient: gradient,
              )
            : null,
      ),
    ),
  );
  hover = Stack(
    alignment: Alignment.center,
    children: [
      if (hover != null) hover!,
      hoverChild ?? Container(),
    ],
  );
}