Banner
Android轮播控件,常用于APP的首页顶部，是应用营销宣传的重要入口。
支持自定义轮播样式，轮播布局可自定义，目前提供SimpleImageBanner（图片）、SimpleTextBanner（文字）、SimpleGuideBanner（引导页）三种样式的轮播控件。
- 演示效果
- 使用案例
<com.xuexiang.xui.widget.banner.widget.banner.SimpleImageBanner
android:id="@+id/sib_the_most_comlex_usage"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
app:bb_barColor="#88000000"
app:bb_barPaddingBottom="5dp"
app:bb_barPaddingLeft="10dp"
app:bb_barPaddingRight="10dp"
app:bb_barPaddingTop="5dp"
app:bb_delay="2"
app:bb_indicatorCornerRadius="3dp"
app:bb_indicatorGap="8dp"
app:bb_indicatorGravity="RIGHT"
app:bb_indicatorHeight="6dp"
app:bb_indicatorSelectColor="#ffffff"
app:bb_indicatorStyle="CORNER_RECTANGLE"
app:bb_indicatorUnselectColor="#88ffffff"
app:bb_indicatorWidth="6dp"
app:bb_isAutoScrollEnable="true"
app:bb_isBarShowWhenLast="true"
app:bb_isIndicatorShow="true"
app:bb_isLoopEnable="true"
app:bb_isTitleShow="true"
app:bb_period="10"
app:bb_scale="0.5625"
app:bb_textColor="#ffffff"
app:bb_textSize="13.5sp" />
- 属性表:(BaseBanner)
| 属性名 | 类型 | 默认值 | 备注 |
|---|---|---|---|
| bb_scale | float | 0.5 | Banner高宽比,范围0-1 |
| bb_isLoopEnable | boolean | true | 是否支持循环 |
| bb_delay | integer | 5 | 滚动延时（秒） |
| bb_period | integer | 5 | 滚动间隔（秒） |
| bb_isAutoScrollEnable | boolean | true | 是否支持自动滚动 |
| bb_barColor | color | Color.TRANSPARENT | 设置底部背景条颜色 |
| bb_barPaddingLeft | dimension | 10dp | 设置底部背景条padding,单位dp |
| bb_barPaddingTop | dimension | 居中是6dp，否则是2dp | 设置底部背景条padding,单位dp |
| bb_barPaddingRight | dimension | 10dp | 设置底部背景条padding,单位dp |
| bb_barPaddingBottom | dimension | 居中是6dp，否则是2dp | 设置底部背景条padding,单位dp |
| bb_textColor | color | Color.WHITE | 设置标题文字颜色 |
| bb_textSize | dimension | 14sp | 设置标题文字大小,单位sp |
| bb_isTitleShow | boolean | true | 设置是否显示标题 |
| bb_isIndicatorShow | boolean | true | 设置是否显示指示器 |
| bb_indicatorGravity | enum | CENTER（LEFT、RIGHT） | 设置指示器位置 |
- 属性表:(BaseIndicatorBanner)
| 属性名 | 类型 | 默认值 | 备注 |
|---|---|---|---|
| bb_indicatorStyle | enum | CORNER_RECTANGLE（DRAWABLE_RESOURCE） | 设置指示器样式 |
| bb_indicatorWidth | dimension | 6dp | 设置指示器宽度,单位dp |
| bb_indicatorHeight | dimension | 6dp | 设置指示器高度,单位dp |
| bb_indicatorGap | dimension | 6dp | 设置指示器间距,单位dp |
| bb_indicatorSelectColor | color | Color.WHITE | 设置指示器选中颜色 |
| bb_indicatorUnselectColor | color | #88ffffff | 设置指示器未选中颜色 |
| bb_indicatorCornerRadius | dimension | 3dp | 设置指示器圆角弧度,单位dp |
| bb_indicatorSelectRes | reference | / | 设置指示器选中drawable资源 |
| bb_indicatorUnselectRes | reference | / | 设置指示器未选中drawable资源 |
使用RecyclerView实现的Banner轮播图控件，支持无限轮播。
- 演示效果
- 使用案例
<com.xuexiang.xui.widget.banner.recycler.BannerLayout
android:id="@+id/bl_horizontal"
android:layout_width="match_parent"
android:layout_height="200dp"
app:bl_autoPlaying="true"
app:bl_centerScale="1.3"
app:bl_itemSpace="10dp"
app:bl_moveSpeed="1.8" />
| 属性名 | 类型 | 默认值 | 备注 |
|---|---|---|---|
| bl_interval | integer | 4000ms | 轮播间隔，单位ms |
| bl_showIndicator | boolean | true | 是否显示轮播索引 |
| bl_orientation | enum | horizontal | 轮播的方向 |
| bl_autoPlaying | boolean | true | 是否是自动轮播 |
| bl_indicatorSelectedSrc | reference | / | 轮播索引选中的效果 |
| bl_indicatorUnselectedSrc | reference | / | 轮播索引未选中的效果 |
| bl_indicatorSize | dimension | 5dp | 轮播索引的大小 |
| bl_indicatorSelectedColor | color | R.color.xui_config_color_red | 轮播索引选中的颜色 |
| bl_indicatorUnselectedColor | color | R.color.xui_config_color_gray_2 | 轮播索引未选中的颜色 |
| bl_indicatorSpace | dimension | 4dp | 索引器之间的间隔 |
| bl_indicatorMarginLeft | dimension | 16dp | 索引器的左侧边距 |
| bl_indicatorMarginRight | dimension | 0dp | 索引器的右侧边距 |
| bl_indicatorMarginBottom | dimension | 11dp | 索引器的底部边距 |
| bl_indicatorGravity | enum | left | 索引器的对齐方式 |
| bl_itemSpace | dimension | 10dp | 轮播图之间的间距 |
| bl_centerScale | float | 1.2F | 图片缩放系数 |
| bl_moveSpeed | float | 1.0F | 轮播速度 |