【Android 开发】:UI控件之 ImageView 实现图片旋转和缩放功能

1.  前言

    在开发中实现对图像的缩放有很多方法,最简单的方法是改变ImageView控件的大小,我们只要将<ImageView>标签的android:scaleType的属性值设置为fitCenter,要是想实现图像的旋转可以使用android.graphics.Matirx类的setRotate来实现。

下面我们就来学习一下如何利用ImageView来实现图片的等比例缩放和旋转的功能。在学习之前,我们需要补充一些需要的知识点。

1). android.graphics.Matrix

查看API文档中的 android.graphics.Matrix类,这个类会构造出一个 3*3 的矩阵,它没有构造方法,你可以使用 reset()方法来初始化,这个类可以设计旋转的功能。

2). DisplayMetrics
这是一个显示翻转的类,这个类是描述一个结构化的显示信息,比如大小,像素和字体缩放比例。注意这个图像缩放是要根据屏幕的比例进行缩放的,也就是说图像是不能大于屏幕的尺寸的。

2. 程序实现

1) 布局文件:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/imageview"
        android:layout_width="200dp"
        android:layout_height="150dp"
        android:scaleType="fitCenter"
        android:src="@drawable/dog" />

    <TextView
        android:id="@+id/textview1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:text="图像宽度: 240 图像高度:160" />

    <SeekBar
        android:id="@+id/seekbar1"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:max="240"
        android:progress="120" />

    <TextView
        android:id="@+id/textview2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:text="0度" />

    <SeekBar
        android:id="@+id/seekbar2"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:max="360" />

</LinearLayout>

2) 程序Java代码

public class ImageViewRatote extends Activity implements OnSeekBarChangeListener {

    private int minWidth = 80;
    private ImageView imageView;
    private SeekBar seekBar1, seekBar2;
    private TextView textView1, textView2;
    private Matrix matrix = new Matrix();  //android.graphics.Matrix是实现翻转的类

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        initComponent();
        seekBar1.setOnSeekBarChangeListener(this);
        seekBar2.setOnSeekBarChangeListener(this);

        DisplayMetrics dm = new DisplayMetrics();
        getWindowManager().getDefaultDisplay().getMetrics(dm);
        // 通过dm对象所占有的宽度像素 - 最小宽度值,这样在进行缩放的时候就是按照缩放比例进行缩放了。
        seekBar1.setMax(dm.widthPixels - minWidth);

    }

    @Override
    public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
        // TODO Auto-generated method stub
        if (seekBar.getId() == R.id.seekbar1) {
            // 我们在main布局文件中设置的ImageView控件宽高分别是:200:150 所以这边设置高度是宽度3/4.
            // 在实现缩放的过程中,我们要确保原图片宽高比例是不变化的。
            int newWidth = progress + minWidth;
            int newHeight = (int) (newWidth * 3 / 4); 
            imageView.setLayoutParams(new LinearLayout.LayoutParams(newWidth, newHeight));
            textView1.setText("图像宽度: " + newWidth + "图像高度: " + newHeight);
        }else if(seekBar.getId() == R.id.seekbar2){
            Bitmap bitmap = ((BitmapDrawable)(getResources().getDrawable(R.drawable.dog))).getBitmap();
            matrix.setRotate(progress); //设置翻转的角度
            //重新绘制翻转后的图片
            bitmap = Bitmap.createBitmap(bitmap, 0, 0, bitmap.getWidth(), bitmap.getHeight(), matrix, true);
            imageView.setImageBitmap(bitmap);
            textView2.setText(progress + "度");
        }
    }

    @Override
    public void onStartTrackingTouch(SeekBar seekBar) {
        // TODO Auto-generated method stub

    }

    @Override
    public void onStopTrackingTouch(SeekBar seekBar) {
        // TODO Auto-generated method stub

    }

    private void initComponent() {
        imageView = (ImageView) findViewById(R.id.imageview);
        seekBar1 = (SeekBar) findViewById(R.id.seekbar1);
        seekBar2 = (SeekBar) findViewById(R.id.seekbar2);
        textView1 = (TextView) findViewById(R.id.textview1);
        textView2 = (TextView) findViewById(R.id.textview2);
    }
}

3. 程序执行结果

【Android 开发】:UI控件之 ImageView 实现图片旋转和缩放功能_第1张图片 ---> 【Android 开发】:UI控件之 ImageView 实现图片旋转和缩放功能_第2张图片





你可能感兴趣的:(android,缩放,旋转,imageview,控件)