fis_lib_ui/lib/usual/tab_button.dart

import 'package:fis_theme/theme.dart';
import 'package:fis_ui/index.dart';
import 'package:fis_ui/interface/active_widget.dart';
import 'package:fis_ui/interface/interactive_container.dart';
import 'package:flutter/material.dart';

class FTabButton extends FStatefulWidget implements FActiveWidget {
  FTabButton({
    Key? key,
    required this.businessParent,
    this.name,
    this.tabTitle,
    this.index,
    this.activeIndex,
    this.onCallbackTap,
    this.width = 100,
    this.disableShadow = false,
    this.padding = const EdgeInsets.symmetric(horizontal: 20, vertical: 8),
    this.margin = const EdgeInsets.only(right: 8),
  }) : super(key: key);
  final String? tabTitle;
  final int? index;
  late final int? activeIndex;
  final VoidCallback? onCallbackTap;
  final double width;
  final EdgeInsetsGeometry? padding;
  final EdgeInsetsGeometry? margin;
  final bool disableShadow;

  @override
  FState<FTabButton> createState() => _FTabButtonState();

  @override
  final FInteractiveContainer businessParent;

  @override
  final String? name;
}

class _FTabButtonState extends FState<FTabButton> {
  get isActive => widget.activeIndex == widget.index;

  @override
  FWidget build(BuildContext context) {
    final borderRadius = const Radius.circular(10);
    final textColorActive = Colors.white;
    return FContainer(
      height: 36,
      alignment: Alignment.center,
      margin: widget.margin,
      decoration: widget.disableShadow
          ? null
          : BoxDecoration(
              boxShadow: isActive
                  ? [
                      BoxShadow(
                        color: Colors.black.withOpacity(0.2),
                        blurRadius: 10,
                        spreadRadius: 1,
                        offset: const Offset(5, 5),
                      )
                    ]
                  : []),
      child: FGestureDetector(
        businessParent: widget.businessParent,
        name: widget.name ?? widget.tabTitle ?? '',
        onTap: widget.onCallbackTap,
        child: FContainer(
          child: FCenter(
            child: FText(
              widget.tabTitle ?? '',
              style: isActive
                  ? TextStyle(color: textColorActive)
                  : TextStyle(color: Colors.black87),
            ),
          ),
          width: widget.width,
          padding: widget.padding,
          decoration: BoxDecoration(
            color: isActive ? FTheme.ins.colorScheme.primary : Colors.white,
            borderRadius: BorderRadius.only(
              topLeft: borderRadius,
              topRight: borderRadius,
            ),
          ),
        ),
      ),
    );
  }
}