flutter_appfx/lib/components/imageButton.dart

import 'package:faqim_mobile/components/clickUtil.dart';
import 'package:flutter/material.dart';


class ImageButton extends StatelessWidget {
  final Size buttonSize;
  final String image;
  final Size imageSize;
  final Color bgColor;
  final double borderRadius;
  final Color borderColor;
  final double borderWidth;
  final VoidCallback? onTap;

  ImageButton({
    required this.buttonSize,
    required this.image,
    Size? imageSize,
    this.bgColor = Colors.white,
    this.borderRadius = 5,
    Color? borderColor,
    this.borderWidth = 1,
    this.onTap,
  })
    : imageSize = imageSize ?? buttonSize,
      borderColor = borderColor ?? bgColor
  ;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        // 防止快速连击重复触发。
        if (ClickUtil.isFastClick()) {
          return;
        }
        onTap?.call();
      },
      child: Opacity(
        opacity: onTap == null ? 0.5 : 1.0,
        child: Container(
          width: buttonSize.width,
          height: buttonSize.height,
          decoration: BoxDecoration(
            color: bgColor,
            shape: BoxShape.rectangle,
            borderRadius: BorderRadius.all(Radius.circular(borderRadius)),
            border: Border.all(color: borderColor),
          ),
          child: Center(
            child: Image.asset(
              image,
              width: imageSize.width,
              height: imageSize.height,
            ),
          ),
        ),
      ),
    );
  }
}


class ImageColumnTextButton extends StatelessWidget {
  final Size buttonSize;
  final String image;
  final Size imageSize;
  final String text;
  final TextStyle? textStyle;
  final double space;
  final Color bgColor;
  final double borderRadius;
  final Color borderColor;
  final double borderWidth;
  final VoidCallback? onTap;

  ImageColumnTextButton({
    required this.buttonSize,
    required this.image,
    Size? imageSize,
    required this.text,
    this.textStyle,
    this.space = 4,
    this.bgColor = Colors.white,
    this.borderRadius = 5,
    Color? borderColor,
    this.borderWidth = 1,
    this.onTap,
  })
      : imageSize = imageSize ?? buttonSize,
        borderColor = borderColor ?? bgColor
  ;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Opacity(
        opacity: onTap == null ? 0.5 : 1.0,
        child: Container(
          width: buttonSize.width,
          height: buttonSize.height,
          decoration: BoxDecoration(
            color: bgColor,
            shape: BoxShape.rectangle,
            borderRadius: BorderRadius.all(Radius.circular(borderRadius)),
            border: Border.all(color: borderColor),
          ),
          child: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Image.asset(
                  image,
                  width: imageSize.width,
                  height: imageSize.height,
                ),
                SizedBox(height: space),
                Text(
                  text,
                  style: textStyle,
                  textAlign: TextAlign.center,
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}


class ImageRowTextButton extends StatelessWidget {
  final Size buttonSize;
  final String image;
  final Size imageSize;
  final String text;
  final TextStyle? textStyle;
  final double space;
  final Color bgColor;
  final double borderRadius;
  final Color borderColor;
  final double borderWidth;
  final VoidCallback? onTap;

  ImageRowTextButton({
    required this.buttonSize,
    required this.image,
    Size? imageSize,
    required this.text,
    this.textStyle,
    this.space = 2,
    this.bgColor = Colors.white,
    this.borderRadius = 5,
    Color? borderColor,
    this.borderWidth = 1,
    this.onTap,
  })
      : imageSize = imageSize ?? buttonSize,
        borderColor = borderColor ?? bgColor
  ;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Opacity(
        opacity: onTap == null ? 0.5 : 1.0,
        child: Container(
          width: buttonSize.width,
          height: buttonSize.height,
          decoration: BoxDecoration(
            color: bgColor,
            shape: BoxShape.rectangle,
            borderRadius: BorderRadius.all(Radius.circular(borderRadius)),
            border: Border.all(color: borderColor),
          ),
          child: Center(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Image.asset(
                  image,
                  width: imageSize.width,
                  height: imageSize.height,
                ),
                SizedBox(width: space),
                Text(
                  text,
                  style: textStyle,
                  textAlign: TextAlign.left,
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}