Layout

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

XUIAlphaView

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

• 组件内容：

  • XUIAlphaLinearLayout
  • XUIAlphaRelativeLayout
  • XUIAlphaFrameLayout
  • XUIAlphaImageButton
  • XUIAlphaImageView
  • XUIAlphaTextView
  • XUIAlphaButton

• 使用案例

<com.xuexiang.xui.widget.alpha.XUIAlphaTextView
    style="@style/TextStyle.Content"
    android:layout_width="wrap_content"
    android:clickable="true"
    android:focusable="true"
    android:padding="20dp"
    android:text="点击确认"
    android:textColor="@android:color/white" />
    
<com.xuexiang.xui.widget.alpha.XUIAlphaRelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/xui_config_color_light_blue"
    android:clickable="true"
    android:focusable="true"
    android:padding="100dp"/>

XUILayout

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

• 组件内容：

  • XUIFrameLayout
  • XUILinearLayout
  • XUIRelativeLayout
  • XUIButton

• 使用案例

<com.xuexiang.xui.widget.layout.XUILinearLayout
    android:id="@id/layout_for_test"
    android:layout_width="260dp"
    android:layout_height="250dp"
    android:layout_gravity="center_horizontal"
    android:layout_marginTop="40dp"
    android:background="@color/xui_config_color_white"
    android:gravity="center"
    android:orientation="vertical"
    app:xui_borderColor="?attr/xui_config_color_separator_light"
    app:xui_outerNormalColor="?attr/xui_config_color_background"
    app:xui_showBorderOnlyBeforeL="true">

    <TextView
        android:id="@+id/radius_tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/alpha_tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TextView
        android:id="@+id/elevation_tv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</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	/	21版本下，裁剪圆角边框的镂空颜色
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

ExpandableLayout

可自由伸缩的布局。

• 使用案例

<com.xuexiang.xui.widget.layout.ExpandableLayout
    android:id="@+id/expandable_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/xui_config_color_white"
    app:el_duration="300"
    app:el_expanded="false">

    <TextView
        android:id="@+id/tv_content"
        style="@style/TextStyle.Explain"
        android:paddingStart="8dp"
        android:paddingEnd="8dp"
        android:paddingBottom="8dp"
        android:singleLine="false"
        android:text="@string/etv_content_demo1" />

</com.xuexiang.xui.widget.layout.ExpandableLayout>

• 属性表: (ExpandableLayout)

属性名	类型	默认值	备注
el_duration	integer	300(ms)	动画持续的时间
el_expanded	boolean	false	是否是展开的
el_parallax	float	1	视差效果
android:orientation	enum	vertical	对齐方式