纯血鸿蒙组件库AUI：按钮组件(A_Button) 原创

摘要：
按钮组件(A_Button)：支持胶囊按钮、圆形按钮和普通按钮。关键属性：文本、按钮类型、按钮颜色、图标、按钮尺寸、块级按钮、加载状态、禁用。

调用示例一：极简调用

1.拖拽按钮组件到页面排版区
2.设置按钮文字
3.保存设置

调用示例二：圆形按钮

1.拖拽按钮组件到排版区
2.设置按钮为圆形，选择颜色、设置图标
3.保存设置

调用示例三：更多属性设置

1.拖拽按钮组件到排版区
2.按钮类型：胶囊，设置图标：选择按钮尺寸，块级按钮：是。
3.保存设置

调用示例四：禁用按钮

1.拖拽按钮组件到排版区
2.打开禁用开关!
3.保存设置

生成鸿蒙代码：

GridCol({ span: 4 }) {
              A_Button({
                text: '返回列表',
                color: this.primaryColor,
              })
                .onClick(() => {
                  // TODO 完成按钮交互
                })
            }

            GridCol({ span: 4 }) {
              A_Button({
                buttonType: ButtonType.Circle,
                color: ColorConstants.DANGER,
                icon: 'mdi-delete-outline',
              })
                .onClick(() => {
                  // TODO 完成按钮交互
                })
            }

            GridCol({ span: 4 }) {
              A_Button({
                text: '保存数据',
                color: this.primaryColor,
                icon: 'mdi-apps',
                buttonSize: 'x-large',
                blockButton: true,
              })
                .onClick(() => {
                  // TODO 完成按钮交互
                })
            }

            GridCol({ span: 4 }) {
              A_Button({
                text: '保存数据',
                color: this.primaryColor,
                disabled: true
              })
                .onClick(() => {
                  // TODO 完成按钮交互
                })
            }

将代码拷贝到鸿蒙开发工具IDE，运行代码，以下分别为平板、折叠屏、手机在浅色模式和深色模式下的表现：


按钮组件的调用属性含义如下：

/**
 * 【按钮】
 * text：文本
 * buttonType：按钮类型[支持normal(普通),胶囊(capsule)和圆形(circle)]
 * color：按钮颜色
 * icon：图标
 * buttonSize：按钮尺寸[支持x-small,small,regular,large和x-large]
 * blockButton：块级按钮
 * loading: 加载状态
 * disabled：禁用
 */
@Component
export struct A_Button {
  @Prop text: string
  @Prop buttonType?: ButtonType = ButtonType.Capsule
  @Prop color?: ResourceStr = ColorConstants.INFO
  @Prop icon?: string
  @Prop buttonSize?: string
  @Prop blockButton?: boolean = false
  @Prop loading?: boolean = false
  @Prop disabled?: boolean = false