AndroidUI控件之imageview及其子类

先上一张imageview及其子类的的类图

1.imageview

imageview的主要功能是显示任意的drawable对象

下面是imageview支持的xml属性及相关方法

Xml属性	相关方法	说明
maxHeight	setMaxHeight(int)	设置最大高度
maxWidth	setMaxWidth(int)	设置最大宽度
scaleType	setScaleType(ImageView.Scaletype)	设置图片如何缩放
src	setImageResource(int)	设置显示drawable对象的ID

scaleType有下列的属性值：

1.matrix：用矩阵的方法来绘制，从左上角开始

2.fitXY：对图片横向纵向独立缩放，使它完全适应于imageview

3.fitStart：保持横纵比缩放图片，图片较长的一边等于imageview相应的边长，缩放完成后将图片放置在imageview的左上角

4.fitCenter：保持横纵比缩放图片，图片较长的一边等于imageview相应的边长，缩放完成后将图片放置在imageview的中央

5.fitEnd：保持横纵比缩放图片，图片较长的一边等于imageview相应的边长，缩放完成后将图片放置在imageview的右下角

6.center：把图片放置在imageview的中央，不进行缩放

7.centerCrop：保持横纵比缩放图片，直到最短的边能够显示出来

8.centerInside：保持横纵比缩放图片，使得imageview完全显示该图片

imageview显示图片主要有以下方法：

1.setImageBitmap(Bitmap bm):使用位图的方式设置imageview显示的图片

2.setImageDrawable(Drawable d):使用drawable对象的方式设置imageview显示的图片

3.setImageResource(int id):使用图片的资源id设置imageview显示的图片

4.setImageURI(Uri u):使用图片的uri设置imageview显示的图片

用一个简单的例子展示

下面是具体的实现代码：

xml部分：

<LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="增加透明度"
            android:id="@+id/addAlpha"/>
    <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="减少透明度"
            android:id="@+id/downAlpha"/>
    <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="下一张"
            android:id="@+id/next"/>
</LinearLayout>
<LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    <ImageView
            android:layout_width="wrap_content"
            android:layout_height="280dp"
            android:src="@drawable/android1"
            android:scaleType="fitCenter"
            android:id="@+id/imageView1"/>
    <ImageView
            android:layout_width="120dp"
            android:layout_height="120dp"
            android:background="#00f"
            android:id="@+id/imageView2"/>
</LinearLayout>

activity部分代码：

首先定义各种需要的变量

int[] images = new int[]{
        R.drawable.android1,
        R.drawable.android2,
        R.drawable.android4,
        R.drawable.android5,
        R.drawable.java
};
int currentimage = 0;
private int alpha = 255;

Button addbutton = (Button)findViewById(R.id.addAlpha);
Button downbutton = (Button)findViewById(R.id.downAlpha);
Button nextbutton = (Button)findViewById(R.id.next);
ImageView image1 = (ImageView)findViewById(R.id.imageView1);
ImageView image2 = (ImageView)findViewById(R.id.imageView2);

为控件添加监听：

addbutton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        if(alpha>=255){
            alpha=255;
        }else {
        alpha+=20;
        }
        image1.setImageAlpha(alpha);
    }
});
downbutton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        if(alpha<=0){
            alpha=0;
        }
        else {
            alpha-=20;
        }
        image1.setImageAlpha(alpha);
    }
});

nextbutton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        image1.setImageResource(images[currentimage++%images.length]);
    }
});

最后是透明度

image1.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View view, MotionEvent motionEvent) {
        BitmapDrawable bitmapDrawable =(BitmapDrawable) image1.getDrawable();
        Bitmap bitmap = bitmapDrawable.getBitmap();
        double scale = 1.0 * bitmap.getHeight()/image1.getHeight();
        int x = (int)(motionEvent.getX() * scale);
        int y = (int)(motionEvent.getY() * scale);

        if(x + 120 > bitmap.getWidth()){
            x = bitmap.getWidth() - 120;
        }
        if( y + 120 > bitmap.getHeight()){
            y = bitmap.getHeight() - 120;
        }
        image2.setImageBitmap(Bitmap.createBitmap(bitmap,x,y,120,120));
        image2.setImageAlpha(alpha);
        return false;
    }
});

2.imageButton

它与button的区别在于，button生成的按钮上显示文字，而imagebutton则显示图片,即使给它设置text属性它也只能显示图片

下面这个是对button和imagebutton详细讲解

http://www.cnblogs.com/hxsyl/p/3752872.html   点击打开链接

3.zoomButton

ZoomButton是缩放按钮，它显示的只能是图片，没有Text属性。

下面用一个实际例子讲述zoombutton的用法

下面两个缩放按钮就是用zoombutton实现的，点击相关按钮即可让图片放大或缩小

xml部分代码

<LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">
    <ImageView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/android1"
            android:scaleType="fitCenter"
            android:id="@+id/imageView1"/>
</LinearLayout>
<LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center">
    <ZoomButton
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:src="@drawable/zoom_in"
            android:id="@+id/plus"/>
    <ZoomButton
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:src="@drawable/zoom_out"
            android:id="@+id/min"/>
</LinearLayout>

activity部分代码：

ZoomButton plus = (ZoomButton)findViewById(R.id.plus);
ZoomButton mins = (ZoomButton)findViewById(R.id.min);
ImageView image = (ImageView)findViewById(R.id.imageView1);

ViewGroup.LayoutParams para;
para = image.getLayoutParams();


plus.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        para.width = image.getWidth()+10;
        para.height = image.getHeight()+10;
        image.setLayoutParams(para);
    }
});
mins.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        para.width = image.getWidth()-10;
        para.height = image.getHeight()-10;
        image.setLayoutParams(para);
    }
});

4.quickcontactbadge

显示关联到特定联系人的图片

额外的功能是：该图片关联到手机中的指定联系人，当用户点击该图片时，便会打开相应联系人的联系方式界面

assignContactForEmail：将图片关联到指定email对应的联系人

assignContactForPhone：将图片关联到指定手机号码对应的联系人

assignContactForUri：将图片关联到指定Uri对应的联系人

下面还是用一个小案例来使用：

点击这个图片就可以跳到特定联系人的联系方式界面，如图2

下面是具体实现代码：

xml部分：

<QuickContactBadge
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/java"
        android:id="@+id/quickContactBadge"/>
<TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="联系人1"
        android:id="@+id/phone1"/>

activity部分：

QuickContactBadge badge=(QuickContactBadge)findViewById(R.id.quickContactBadge);
badge.assignContactFromPhone("1801142",false);