ImageView是Android中最常用的组件之一,主要功能就是图片的展示预览。

RadiusImageView

提供为图片添加圆角、边框、剪裁到圆形或其他形状等功能的ImageView。

  • 演示效果

ImageView - 图1

  • 使用案例
  1. <com.xuexiang.xui.widget.imageview.RadiusImageView
  2. android:clickable="true"
  3. android:layout_width="150dp"
  4. android:layout_height="wrap_content"
  5. android:src="@drawable/img_beautiful_scenery"
  6. app:riv_border_color="@color/xui_config_color_gray_6"
  7. app:riv_border_width="1px"
  8. app:riv_is_circle="true"
  9. app:riv_selected_border_color="@color/xui_config_color_gray_4"
  10. app:riv_selected_border_width="1px"
  11. app:riv_selected_mask_color="@color/xui_config_color_gray_8"/>
  • 属性表: (RadiusImageView)
属性名类型默认值备注
riv_border_widthdimension0边框的宽度
riv_border_colorcolorColor.GRAY边框的颜色
riv_selected_mask_colorcolorColor.TRANSPARENT选中时,覆盖在图片上的图层颜色
riv_selected_border_colorcolorColor.GRAY边框选中时的颜色
riv_selected_border_widthdimension0边框选中时的宽度
riv_corner_radiusdimension0圆角的大小
riv_is_ovalbooleanfalse是否是椭圆形
riv_is_circlebooleanfalse图片是否是圆形的
riv_is_touch_select_mode_enabledbooleantrue图片是否可触摸选中

IconImageView

可在ImageView上设置图标的ImageView

  • 使用案例
  1. <com.xuexiang.xui.widget.imageview.IconImageView
  2. android:id="@+id/iv"
  3. android:layout_width="200dp"
  4. android:layout_height="200dp"
  5. android:layout_centerHorizontal="true"
  6. android:layout_centerVertical="true"
  7. android:clickable="false"
  8. android:contentDescription="@null"
  9. android:focusable="false"
  10. android:scaleType="centerCrop"
  11. android:src="@drawable/xui_ic_default_img"
  12. app:iiv_icon="@drawable/ic_player"/>
  • 属性表: (IconImageView)
属性名类型默认值备注
iiv_iconreference/图标的资源
iiv_icon_scalefloat0.5f图标缩放的比例
iiv_is_showbooleantrue图标是否显示

SmoothImageView

可支持缩放的图片控件

  • 使用案例
  1. <com.xuexiang.xui.widget.imageview.preview.view.SmoothImageView
  2. android:id="@+id/photoView"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. android:padding="20dp"
  6. android:background="@android:color/transparent" />

PreviewBuilder

图片集预览,支持视频和gif的预览。

  • 演示效果

ImageView - 图2

  • 使用案例
  1. PreviewBuilder.from(getActivity())
  2. .setImgs(mAdapter.getListData()) //图片对象集合
  3. .setCurrentIndex(position) //当前预览的索引
  4. .setSingleFling(true)
  5. .setType(PreviewBuilder.IndicatorType.Number) //指示器为数字
  6. .start();