All Products
Search
Document Center

Button component

Last Updated: May 25, 2021

AUButton provides buttons of different patterns.

Sample image

Dependency

See Quick start.

Style API

Property Description
mainButtonStyle The main button on a page.
subButtonStyle The secondary button on a page.
warnButtonStyle The warning button.
assMainButtonStyle The auxiliary main button.
assButtonStyle The auxiliary secondary button.
listButtonStyle The list button.

Sample code

  • Main button on a page

 
  1. <com.alipay.mobile.antui.basic.AUButton
  2. style="@com.alipay.mobile.antui:style/mainButtonStyle"
  3. android:layout_margin="12dp"
  4. android:clickable="true"
  5. android:text="页面主按钮 Normal" />
  6. <com.alipay.mobile.antui.basic.AUButton
  7. style="@com.alipay.mobile.antui:style/mainButtonStyle"
  8. android:layout_margin="12dp"
  9. android:enabled="false"
  10. android:text="页面主按钮 Disable"
  11. app:dynamicThemeDisable="true" />
  • Secondary button on a page

 
  1. <com.alipay.mobile.antui.basic.AUButton
  2. style="@com.alipay.mobile.antui:style/subButtonStyle"
  3. android:layout_margin="12dp"
  4. android:clickable="true"
  5. android:text="页面次要操作 Normal" />
  6. <com.alipay.mobile.antui.basic.AUButton
  7. style="@com.alipay.mobile.antui:style/subButtonStyle"
  8. android:layout_margin="12dp"
  9. android:enabled="false"/>
  • The warning button.

 
  1. <com.alipay.mobile.antui.basic.AUButton
  2. style="@com.alipay.mobile.antui:style/warnButtonStyle"
  3. android:layout_margin="12dp"
  4. android:clickable="true"
  5. android:text="警告按钮 Normal" />
  6. <com.alipay.mobile.antui.basic.AUButton
  7. style="@com.alipay.mobile.antui:style/warnButtonStyle"
  8. android:layout_margin="12dp"
  9. android:enabled="false"
  10. android:text="警告按钮 Disable" />
  • Auxiliary main button

 
  1. <com.alipay.mobile.antui.basic.AUButton
  2. style="@com.alipay.mobile.antui:style/assMainButtonStyle"
  3. android:layout_margin="12dp"
  4. android:clickable="true"
  5. android:text="下载" />
  6. <com.alipay.mobile.antui.basic.AUButton
  7. style="@com.alipay.mobile.antui:style/assMainButtonStyle"
  8. android:layout_margin="12dp"
  9. android:enabled="false"
  10. android:text="下载" />
  11. <com.alipay.mobile.antui.basic.AUButton
  12. style="@com.alipay.mobile.antui:style/assMainButtonStyle"
  13. android:layout_margin="12dp"
  14. android:text="辅助主按钮" />
  • Auxiliary secondary button

 
  1. <com.alipay.mobile.antui.basic.AUButton
  2. style="@com.alipay.mobile.antui:style/assButtonStyle"
  3. android:layout_margin="12dp"
  4. android:clickable="true"
  5. android:text="下载" />
  6. <com.alipay.mobile.antui.basic.AUButton
  7. style="@com.alipay.mobile.antui:style/assButtonStyle"
  8. android:layout_margin="12dp"
  9. android:enabled="false"
  10. android:text="下载" />
  11. <com.alipay.mobile.antui.basic.AUButton
  12. style="@com.alipay.mobile.antui:style/assButtonStyle"
  13. android:layout_margin="12dp"
  14. android:text="辅助按钮" />
  • List button

 
  1. <com.alipay.mobile.antui.basic.AUButton
  2. style="@com.alipay.mobile.antui:style/listButtonStyle"
  3. android:layout_marginTop="12dp"
  4. android:layout_marginBottom="12dp"
  5. android:clickable="true"
  6. android:text="取消关注" />
  7. <com.alipay.mobile.antui.basic.AUButton
  8. style="@com.alipay.mobile.antui:style/listButtonStyle"
  9. android:layout_marginTop="12dp"
  10. android:layout_marginBottom="12dp"
  11. android:clickable="true"
  12. android:textColor="@com.alipay.mobile.antui:color/AU_COLOR_LINK"
  13. android:text="更多服务" />