欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

ImageButton与ImageView的区别

程序员文章站 2022-06-04 16:22:07
...

文章出处:原博客地址
第一次写博客,不知从何写起,就从最近项目中遇到的一些细节问题说起吧!

项目中使用ImageButton,但是给图片设置具体尺寸(width,height)之后,发现还是原来的大小,为了保持图片的原始像素,并没有给ImageButton设置ScaleType,后来将ImageButton换成ImageView之后就ok了(并不是唯一解决方案)

于是,想搞明白ImageViewImageButton之间到底有什么不同,发现两者之间还是有不小的区别.

源码的角度看继承关系,一目了然:
ImageButton与ImageView的区别

ImageButton与ImageView的区别

下面分几种不同的情况去说明两者之间的差别:

1,不设置具体宽高

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#00f"
    android:src="@drawable/search"/>

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp"
    android:background="#0f0"
    android:src="@drawable/search"/>

效果是这样的:
ImageButton与ImageView的区别
两者没有区别

2,设置了具体的宽高

<ImageView
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:background="#00f"
    android:src="@drawable/search"
    />

<ImageButton
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_marginTop="20dp"
    android:background="#0f0"
    android:src="@drawable/search"/>

效果是这样的:
ImageButton与ImageView的区别
效果就很明显了,ImageView会根据设置的具体宽高尺寸变化,但是ImageButton只会显示图片的原始像素大小.
当然,给ImageButton设置scaletype属性是可以完成ImageView的效果,但是那样会是图片失真.

3,设置背景选择器

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:clickable="true"
    android:background="#00f"
    android:src="@drawable/search_selector"/>

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp"
    android:background="#0f0"
    android:src="@drawable/search_selector"/>

注意:
ImageView要想使选择器效果生效,需要让控件是有焦点的,这里加上clickable=true处理一下
ImageButton就不需要处理,因为源码中,ImageButton的构造中,已经setFocusable(true)处理过了
ImageButton与ImageView的区别

效果都一样的,选择器都会生效,这里就不上图了.
同时,将宽高改成的具体尺寸,效果也是一样的,选择器都会生效

将两者的src换成background试了一下:

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:clickable="true"
    android:background="@drawable/search_selector"/>

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp"
    android:background="@drawable/search_selector"/>

效果也是一样的,选择器都会生效
同时,将宽高改成的具体尺寸,效果也是一样的,选择器都会生效

所以,在选择器的使用上,两者基本没有差别,要说差别,那就是ImageView需要处理一下焦点问题吧

4,设置background(无具体宽高)

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:clickable="true"
    android:background="@drawable/search_selected"/>

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp"
    android:background="@drawable/search_selected"/>

效果如图:
ImageButton与ImageView的区别
效果一样,一会再说srcbackground的区别

5,设置background(有具体宽高)

<ImageView
  android:layout_width="100dp"
    android:layout_height="100dp"
    android:clickable="true"
    android:background="@drawable/search_selected"/>

<ImageButton
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_marginTop="20dp"
    android:background="@drawable/search_selected"/>

效果如图:
ImageButton与ImageView的区别
两者效果一样的,但是跟使用src不同的是,ImageButton的效果也跟着具体参数不同而改变了.

下面就说一下srcbackground的区别吧(ImageViewImageButton通用):

  • (1),src指定的是原图的大小,宽高设置成图片的原始尺寸,在分辨率不同的手机上,显示效果会不同,但不会进行拉伸;
    background会根据具体的宽高进行拉伸

    注意: src指定的图片的宽高要是设置成超过其原始尺寸,比如图片原始像素是48*48,但是宽高设置成100*100,图片也是会被拉伸的

    (2),src是图片的前景,background是背景,background是所有控件都有的属性,两者可以同时使用

    (3),scaleType属性只有src才生效

6,点9图

<ImageView
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:src="@drawable/bg"/>

<ImageButton
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:layout_marginTop="10dp"
    android:background="@null"
    android:src="@drawable/bg"/>

<ImageView
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:layout_marginTop="10dp"
    android:background="@drawable/bg"/>

<ImageButton
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:layout_marginTop="10dp"
    android:background="@drawable/bg"/>

效果如下:
ImageButton与ImageView的区别
ImageViewImageButton在设置成src指定图片的时候,点9图都没有生效,ImageButton显示的是图片的原始大小,ImageView根据具体宽高,放大了图片;
但是都使用background的时候,点9图就生效了

总结:
1, ImageViewImageButton在用src指定图片的时候,不设置具体宽高,显示效果一样;
设置了具体宽高,若宽高不是图片的原始大小,ImageView会根据宽高放大或者缩小,ImageButton会显示原始图片大小

2, ImageViewImageButton在使用background的时候,效果是一样的

3, ImageViewImageButton在用选择器的时候,无论是src还是backgroud,都会生效,前提是ImageView需要获取到焦点

3,ImageViewImageButton在使用点9图的时候,使用src指定点9图,都不会生效;
使用background指定点9图,都才会生效

补充:
对于网上的一些资料说ImageButton支持点9图,ImageView不支持点9图,对此感觉这种说法并不严谨

以上就是ImageViewImageButton的区别,有不对之处,欢迎指正!