Android ImageView通过Matrix实现图片倾斜效果

0.168字数 266阅读 842

通过matrix可以直接对Bitmap进行缩放、旋转等操作,通过ImageViewsetImageMatrix(Matrix matrix)方法也可以达到一样的效果,不过要想
setImageMatrix(Matrix matrix)生效,必须将ImageViewScaleType设置为MATRIX

使用ImageViewsetImageMatrix(Matrix matrix)方法来实现倾斜效果相较于直接通过matrix操作Bitmap来实现,好处在于我们可以预先通过成熟的图片的加载框架(例如GlidePicasso)来加载图片,不用自己处理Bitmap,以减少因Bitmap导致的内存溢出的几率,在代码上也更加简洁。

一个简单的示例:

device-2017-07-25-151401.png

实现代码:

package com.hpplay.muiltythreaddemo;

import android.graphics.Camera;
import android.graphics.Matrix;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;

import com.bumptech.glide.Glide;

/**
 * Created by DON on 2017/7/25.
 */

public class MatrixFragment extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        LinearLayout rootView = new LinearLayout(getActivity());
        return rootView;
    }

    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);

        LinearLayout rootView = (LinearLayout) view;
        rootView.setOrientation(LinearLayout.HORIZONTAL);
        rootView.setGravity(Gravity.CENTER);

        int imgWidth = 480, imgHeight = 300;

        final ImageView leftImg = new ImageView(getActivity());
        leftImg.setScaleType(ImageView.ScaleType.MATRIX);
        LinearLayout.LayoutParams leftParams = new LinearLayout.LayoutParams(
                imgWidth, imgHeight);
        leftParams.leftMargin = 20;
        rootView.addView(leftImg, leftParams);

        ImageView centerImg = new ImageView(getActivity());
        centerImg.setImageResource(R.drawable.im5);
        LinearLayout.LayoutParams centerParams = new LinearLayout.LayoutParams(
                imgWidth, imgHeight);
        rootView.addView(centerImg, centerParams);

        final ImageView rightImg = new ImageView(getActivity());
        rightImg.setScaleType(ImageView.ScaleType.MATRIX);
        LinearLayout.LayoutParams rightParams = new LinearLayout.LayoutParams(
                imgWidth, imgHeight);
        rightParams.rightMargin = 20;
        rootView.addView(rightImg, rightParams);

        //通过Glide加载图片,会将原始图片修改为与控件一样大小,
        // 不必再通过matrix对图片进行缩放,效率更高
        Glide.with(getActivity())
                .load(R.drawable.im5)
                .into(leftImg);
        Glide.with(getActivity())
                .load(R.drawable.im5)
                .into(rightImg);

        //延时300ms等待Glide加载图片完成,这里只做演示用,正确的处理方法应为监听Glide的加载进度
        rootView.postDelayed(new Runnable() {
            @Override
            public void run() {
                rotateImg(leftImg, 30);
                rotateImg(rightImg, -30);
            }
        }, 300);


    }

    /**
     *  设置旋转中心非常必要
     * @param imageView
     * @param rotateValue
     */
    private void rotateImg(ImageView imageView, int rotateValue) {
        Matrix matrix = getMatrix(rotateValue);
        if (rotateValue >= 0) {
            // 旋转中心为(0,height/2)
            matrix.preTranslate(0, -imageView.getHeight() / 2);
            matrix.postTranslate(0, imageView.getHeight() / 2);
        } else {
            // 旋转中心为(width,height/2)
            matrix.preTranslate(-imageView.getWidth(), -imageView.getHeight() / 2);
            matrix.postTranslate(imageView.getWidth(), imageView.getHeight() / 2);
        }
        imageView.setImageMatrix(matrix);
    }


    private Matrix getMatrix(int rotate) {
        Matrix matrix = new Matrix();
        Camera camera = new Camera();
        camera.save();
        camera.rotateY(rotate);
        camera.getMatrix(matrix);
        camera.restore();
        return matrix;
    }

}

这里的图片倾斜效果是通过对matrix设置绕Y轴旋转来实现的,直接使用matrix只适用于对图片进行缩放、旋转等处理,对于普通的View类并不适用。View类的旋转、缩放等可以通过直接调用其自有方法实现,也很是简单方便。

推荐阅读更多精彩内容