[toc]

组件的使用-Button

为了统一，各视图分别使用如下组件

一、按钮Button

不用再写一堆嵌套地狱代码。（支持高亮效果，目前app按钮点击效果不佳，后续可能需要加，提前避免）

按钮的分类：

编号	类名	样式举例	备注
1	纯背景的按钮： ThemeBGButton
2	有边框的按钮： ThemeBorderButton
3	切状态的按钮： ThemeStateButton	未选中状态(selected=false) 已选中状态(selected=true)

1、纯背景的按钮：ThemeBGButton

import 'package:flutter_baseui_kit/flutter_baseui_kit.dart';

				ThemeBGButton(
          //width: 300, // 不设置会根据内容自适应
          //height: 80, // 不设置会根据内容自适应
          bgColorType: ThemeBGType.pink,
          needHighlight: true,	// 默认false,不需要高亮
          title: '红底白字的按钮',
          titleStyle: ButtonBoldTextStyle(fontSize: 18.0),
          cornerRadius: 20,
          //enable: true, // 不设置,默认true
          onPressed: () {},
        ),

如果你还需要在文字前添加图片，

可以通过 imageWidget 添加

import 'package:flutter_baseui_kit/flutter_baseui_kit.dart';

				ThemeBGButton(
          ...
          title: '以主题色(红色)为背景的按钮',
          titleStyle: ButtonBoldTextStyle(fontSize: 18.0),
          imageWidget: ImageAsset('images/xx.jpg', width: 22, height: 22,),
          //imageTitleGap: 5, // 默认5
          ...
        )

2、有边框的按钮：ThemeBorderButton

import 'package:flutter_baseui_kit/flutter_baseui_kit.dart';

				ThemeBorderButton(
          //width: 300, // 不设置会根据内容自适应
          //height: 80, // 不设置会根据内容自适应
          borderColorType: ThemeBGType.pink,
          title: '白底红字红框的按钮',
          titleStyle: ButtonBoldTextStyle(fontSize: 18.0),
          cornerRadius: 20,
          //enable: true, // 不设置,默认ture
          onPressed: () {},
        )

3、状态切换按钮：ThemeStateButton

未选中状态(selected=false)：
已选中状态(selected=true)：

import 'package:flutter_baseui_kit/flutter_baseui_kit.dart';

				ThemeStateButton(
          //width: 300, // 不设置会根据内容自适应
          //height: 80, // 不设置会根据内容自适应
          normalBGColorType: ThemeBGType.pink,
          normalTitle: '修改',
          selectedTitle: '提交',
          titleStyle: ButtonBoldTextStyle(fontSize: 18.0),
          cornerRadius: 20,
          selected: false,
          //enable: true, // 不设置,默认ture
          onPressed: () {},
        )

其他按钮样式：