这里集合了常用的几种通用布局组件,封装了系统的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" />
  9. <com.xuexiang.xui.widget.alpha.XUIAlphaRelativeLayout
  10. android:layout_width="match_parent"
  11. android:layout_height="wrap_content"
  12. android:background="@color/xui_config_color_light_blue"
  13. android:clickable="true"
  14. android:focusable="true"
  15. 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">
  13. <TextView
  14. android:id="@+id/radius_tv"
  15. android:layout_width="wrap_content"
  16. android:layout_height="wrap_content" />
  17. <TextView
  18. android:id="@+id/alpha_tv"
  19. android:layout_width="wrap_content"
  20. android:layout_height="wrap_content" />
  21. <TextView
  22. android:id="@+id/elevation_tv"
  23. android:layout_width="wrap_content"
  24. android:layout_height="wrap_content" />
  25. </com.xuexiang.xui.widget.layout.XUILinearLayout>
  • 属性表: (XUILayout)
属性名类型默认值备注
xui_bottomDividerHeightdimension0底部分割线的高度
xui_bottomDividerColorcolorreferenceR.attr.xui_config_color_separator_light
xui_bottomDividerInsetLeftdimension0底部分割线左侧的边距
xui_bottomDividerInsetRightdimension0底部分割线右侧的边距
xui_topDividerHeightdimension0顶部分割线的高度
xui_topDividerColorcolorreferenceR.attr.xui_config_color_separator_light
xui_topDividerInsetLeftdimension0顶部分割线左侧的边距
xui_topDividerInsetRightdimension0顶部分割线右侧的边距
xui_leftDividerWidthdimension0左侧分割线的宽度
xui_leftDividerColorcolorreferenceR.attr.xui_config_color_separator_light
xui_leftDividerInsetTopdimension0左侧分割线顶部的边距
xui_leftDividerInsetBottomdimension0左侧分割线底部的边距
xui_rightDividerWidthdimension0右侧分割线的高度
xui_rightDividerColorcolorreferenceR.attr.xui_config_color_separator_light
xui_rightDividerInsetTopdimension0右侧分割线顶部的边距
xui_rightDividerInsetBottomdimension0右侧分割线底部的边距
xui_radiusdimension0圆角度数
xui_borderColorcolor/边框颜色
xui_borderWidthdimension1px边框宽度
xui_outerNormalColorcolorreference/
xui_hideRadiusSideenumnone隐藏圆角的类型
xui_showBorderOnlyBeforeLbooleantrue是否显示边框
xui_shadowElevationboolean0阴影的大小
xui_useThemeGeneralShadowElevationbooleanfalse,主题默认阴影大小是14dp是否使用主题的阴影大小
xui_shadowAlphafloat0.25阴影的透明度
xui_outlineInsetTopdimension0轮廓的顶部边距
xui_outlineInsetLeftdimension0轮廓的左侧边距
xui_outlineInsetRightdimension0轮廓的右侧边距
xui_outlineInsetBottomdimension0轮廓的底部边距
xui_outlineExcludePaddingbooleanfalse轮廓是否使用内边距

常用方法

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