这里集合了常用的几种通用布局组件,封装了系统的API,可以很方便地设置布局的圆角、阴影、透明度等。

XUIAlphaView

点击可自动改变控件的透明度。

  • 组件内容:

  • XUIAlphaLinearLayout

  • XUIAlphaRelativeLayout
  • XUIAlphaFrameLayout
  • XUIAlphaImageButton
  • XUIAlphaImageView
  • XUIAlphaTextView
  • XUIAlphaButton
  • 使用案例
1. <com.xuexiang.xui.widget.alpha.XUIAlphaTextView
2. style="@style/TextStyle.Content"
3. android:layout_width="wrap_content"
4. android:clickable="true"
5. android:focusable="true"
6. android:padding="20dp"
7. android:text="点击确认"
8. android:textColor="@android:color/white" />

10. <com.xuexiang.xui.widget.alpha.XUIAlphaRelativeLayout
11. android:layout_width="match_parent"
12. android:layout_height="wrap_content"
13. android:background="@color/xui_config_color_light_blue"
14. android:clickable="true"
15. android:focusable="true"
16. android:padding="100dp"/>

XUILayout

封装了系统的API,可以很方便地设置布局的圆角、阴影、透明度等。

  • 组件内容:

  • XUIFrameLayout

  • XUILinearLayout
  • XUIRelativeLayout
  • XUIButton
  • 使用案例
1. <com.xuexiang.xui.widget.layout.XUILinearLayout
2. android:id="@id/layout_for_test"
3. android:layout_width="260dp"
4. android:layout_height="250dp"
5. android:layout_gravity="center_horizontal"
6. android:layout_marginTop="40dp"
7. android:background="@color/xui_config_color_white"
8. android:gravity="center"
9. android:orientation="vertical"
10. app:xui_borderColor="?attr/xui_config_color_separator_light"
11. app:xui_outerNormalColor="?attr/xui_config_color_background"
12. app:xui_showBorderOnlyBeforeL="true">

14. <TextView
15. android:id="@+id/radius_tv"
16. android:layout_width="wrap_content"
17. android:layout_height="wrap_content" />

19. <TextView
20. android:id="@+id/alpha_tv"
21. android:layout_width="wrap_content"
22. android:layout_height="wrap_content" />

24. <TextView
25. android:id="@+id/elevation_tv"
26. android:layout_width="wrap_content"
27. android:layout_height="wrap_content" />

29. </com.xuexiang.xui.widget.layout.XUILinearLayout>
  • 属性表: (XUILayout)
属性名 类型 默认值 备注
xui_bottomDividerHeight dimension 0 底部分割线的高度
xui_bottomDividerColor color reference R.attr.xui_config_color_separator_light
xui_bottomDividerInsetLeft dimension 0 底部分割线左侧的边距
xui_bottomDividerInsetRight dimension 0 底部分割线右侧的边距
xui_topDividerHeight dimension 0 顶部分割线的高度
xui_topDividerColor color reference R.attr.xui_config_color_separator_light
xui_topDividerInsetLeft dimension 0 顶部分割线左侧的边距
xui_topDividerInsetRight dimension 0 顶部分割线右侧的边距
xui_leftDividerWidth dimension 0 左侧分割线的宽度
xui_leftDividerColor color reference R.attr.xui_config_color_separator_light
xui_leftDividerInsetTop dimension 0 左侧分割线顶部的边距
xui_leftDividerInsetBottom dimension 0 左侧分割线底部的边距
xui_rightDividerWidth dimension 0 右侧分割线的高度
xui_rightDividerColor color reference R.attr.xui_config_color_separator_light
xui_rightDividerInsetTop dimension 0 右侧分割线顶部的边距
xui_rightDividerInsetBottom dimension 0 右侧分割线底部的边距
xui_radius dimension 0 圆角度数
xui_borderColor color / 边框颜色
xui_borderWidth dimension 1px 边框宽度
xui_outerNormalColor color reference /
xui_hideRadiusSide enum none 隐藏圆角的类型
xui_showBorderOnlyBeforeL boolean true 是否显示边框
xui_shadowElevation boolean 0 阴影的大小
xui_useThemeGeneralShadowElevation boolean false,主题默认阴影大小是14dp 是否使用主题的阴影大小
xui_shadowAlpha float 0.25 阴影的透明度
xui_outlineInsetTop dimension 0 轮廓的顶部边距
xui_outlineInsetLeft dimension 0 轮廓的左侧边距
xui_outlineInsetRight dimension 0 轮廓的右侧边距
xui_outlineInsetBottom dimension 0 轮廓的底部边距
xui_outlineExcludePadding boolean false 轮廓是否使用内边距

常用方法

  • 设置控件阴影的大小: setShadowElevation
  • 设置控件阴影的透明度: setShadowAlpha
  • 设置控件阴影的颜色: setShadowColor
  • 设置控件的圆角大小: setRadius
  • 设置隐藏控件圆角的一边: setHideRadiusSide
  • 设置控件阴影和圆角大小: setRadiusAndShadow
  • 设置边框的颜色: setBorderColor
  • 设置边框的宽度: setBorderWidth
  • 设置控件顶部分割线的样式: updateTopDivider
  • 设置控件底部分割线的样式: updateBottomDivider
  • 设置控件左侧分割线的样式: updateLeftDivider
  • 设置控件右侧分割线的样式: updateRightDivider
  • 设置控件顶部分割线的透明度: setTopDividerAlpha
  • 设置控件底部分割线的透明度: setBottomDividerAlpha
  • 设置控件左侧分割线的透明度: setLeftDividerAlpha
  • 设置控件右侧分割线的透明度: setRightDividerAlpha