android_框架_RoundedImageView

13 篇文章 0 订阅

转载自: https://blog.csdn.net/zhangkaiyazky/article/details/85089306

RoundedImageView介绍及使用

在这里插入图片描述

在这里插入图片描述

控件属性:

riv_border_width: 边框宽度 
riv_border_color: 边框颜色 
riv_oval: 是否圆形 
riv_corner_radius: 圆角弧度 
riv_corner_radius_top_left:左上角弧度 
riv_corner_radius_top_right: 右上角弧度 
riv_corner_radius_bottom_left:左下角弧度 
riv_corner_radius_bottom_right:右下角弧度

android:scaleType="fitCenter": 图片缩放
 <com.makeramen.roundedimageview.RoundedImageView
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:src="@mipmap/avatar"
          app:riv_border_color="#333333"
          app:riv_border_width="2dp"
          app:riv_oval="true" />
    <com.makeramen.roundedimageview.RoundedImageView
          xmlns:app="http://schemas.android.com/apk/res-auto"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:scaleType="fitCenter"
          android:src="@mipmap/avatar"
          app:riv_border_color="#333333"
          app:riv_border_width="2dp"
          app:riv_corner_radius="10dp"
          app:riv_mutate_background="true"
          app:riv_oval="false"
          app:riv_tile_mode="repeat" />
    <com.makeramen.roundedimageview.RoundedImageView
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:scaleType="fitCenter"
          android:src="@mipmap/avatar"
          app:riv_border_color="#333333"
          app:riv_border_width="2dp"
          app:riv_corner_radius_top_left="25dp"
          app:riv_corner_radius_bottom_right="25dp"
          app:riv_mutate_background="true"
          app:riv_oval="false"
          app:riv_tile_mode="repeat" />
   <com.makeramen.roundedimageview.RoundedImageView
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:scaleType="fitCenter"
          android:src="@mipmap/avatar"
          app:riv_border_color="#333333"
          app:riv_border_width="2dp"
          app:riv_corner_radius_top_right="25dp"
          app:riv_corner_radius_bottom_left="25dp"
          app:riv_mutate_background="true"
          app:riv_oval="false"
          app:riv_tile_mode="repeat" />
   <com.makeramen.roundedimageview.RoundedImageView
          android:layout_width="96dp"
          android:layout_height="72dp"
          android:scaleType="center"
          android:src="@mipmap/avatar"
          app:riv_border_color="#333333"
          app:riv_border_width="2dp"
          app:riv_corner_radius="25dp"
          app:riv_mutate_background="true"
          app:riv_oval="true"
          app:riv_tile_mode="repeat" />

图片填充方式

ImageView设置填充方式
设置ImageView填充方式的前提是使用src作为设置图片的来源,否则的话,会导致图片填充方式设置无效的情况。

scaleType=“matrix” 是保持原图大小、从左上角的点开始,以矩阵形式绘图。
scaleType=“fitXY” 是将原图进行横方向(即XY方向)的拉伸后绘制的。
scaleType=“fitStart” 是将原图沿左上角的点(即matrix方式绘图开始的点),按比例缩放原图绘制而成的。
scaleType=“fitCenter” 是将原图沿上方居中的点(即matrix方式绘图第一行的居中的点),按比例缩放原图绘制而成的。
scaleType=“fitEnd” 是将原图沿下方居中的点(即matrix方式绘图最后一行的居中的点),按比例缩放原图绘制而成的。
scaleType=“Center” 是保持原图大小,以原图的几何中心点和ImagView的几何中心点为基准,只绘制ImagView大小的图像。
scaleType=“centerCrop” 不保持原图大小,以原图的几何中心点和ImagView的几何中心点为基准,只绘制ImagView大小的图像(以填满ImagView为目标,对原图进行裁剪)。
scaleType=“centerInside” 不保持原图大小,以原图的几何中心点和ImagView的几何中心点为基准,只绘制ImagView大小的图像(以显示完整图片为目标,对原图进行缩放)。

在这里插入图片描述

注意

ImageView中XML属性src和background的区别:

background会根据ImageView组件给定的长宽进行拉伸,而src就存放的是原图的大小,不会进行拉伸。src是图片内容(前景),bg是背景,可以同时使用。

此外:scaleType只对src起作用;bg可设置透明度,比如在ImageButton中就可以用android:scaleType控制图片的缩放方式

如上所述,background设置的图片会跟View组件给定的长宽比例进行拉伸。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值