android Matrix图片随意的放大缩小,拖动
摘要:step1:新建一个项目DragAndZoom,并准备一张照片放在res/drawable-hdpi目录下,如下图所示:
step1:新建一个项目DragAndZoom,并准备一张照片放在res/drawable-hdpi目录下,如下图所示:
step2: 设置应用的UI界面,在main.xml中设置:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<?xml version=
"1.0"
encoding=
"utf-8"
?>
<LinearLayout xmlns:android=
"http://schemas.android.com/apk/res/android"
android:orientation=
"vertical"
android:layout_width=
"fill_parent"
android:layout_height=
"fill_parent"
>
<ImageView
android:layout_width=
"fill_parent"
android:layout_height=
"wrap_content"
android:src=
"@drawable/wall"
android:id=
"@+id/imageView"
android:scaleType=
"matrix"
/> <!-- 指定为matrix类型 -->
</LinearLayout>
|
step3:MainActivity.java中实现具体的需求
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
|
package
cn.roco.drag;
import
android.app.Activity;
import
android.graphics.Matrix;
import
android.graphics.PointF;
import
android.os.Bundle;
import
android.util.FloatMath;
import
android.view.MotionEvent;
import
android.view.View;
import
android.view.View.OnTouchListener;
import
android.widget.ImageView;
public
class
MainActivity
extends
Activity {
private
ImageView imageView;
@Override
public
void
onCreate(Bundle savedInstanceState) {
super
.onCreate(savedInstanceState);
setContentView(R.layout.main);
imageView = (ImageView)
this
.findViewById(R.id.imageView);
imageView.setOnTouchListener(
new
TouchListener());
}
private
final
class
TouchListener
implements
OnTouchListener {
/** 记录是拖拉照片模式还是放大缩小照片模式 */
private
int
mode =
0
;
// 初始状态
/** 拖拉照片模式 */
private
static
final
int
MODE_DRAG =
1
;
/** 放大缩小照片模式 */
private
static
final
int
MODE_ZOOM =
2
;
/** 用于记录开始时候的坐标位置 */
private
PointF startPoint =
new
PointF();
/** 用于记录拖拉图片移动的坐标位置 */
private
Matrix matrix =
new
Matrix();
/** 用于记录图片要进行拖拉时候的坐标位置 */
private
Matrix currentMatrix =
new
Matrix();
/** 两个手指的开始距离 */
private
float startDis;
/** 两个手指的中间点 */
private
PointF midPoint;
@Override
public
boolean onTouch(View v, MotionEvent event) {
/** 通过与运算保留最后八位 MotionEvent.ACTION_MASK = 255 */
switch
(event.getAction() & MotionEvent.ACTION_MASK) {
// 手指压下屏幕
case
MotionEvent.ACTION_DOWN:
mode = MODE_DRAG;
// 记录ImageView当前的移动位置
currentMatrix.
set
(imageView.getImageMatrix());
startPoint.
set
(event.getX(), event.getY());
break
;
// 手指在屏幕上移动,改事件会被不断触发
case
MotionEvent.ACTION_MOVE:
// 拖拉图片
if
(mode == MODE_DRAG) {
float dx = event.getX() - startPoint.x;
// 得到x轴的移动距离
float dy = event.getY() - startPoint.y;
// 得到x轴的移动距离
// 在没有移动之前的位置上进行移动
matrix.
set
(currentMatrix);
matrix.postTranslate(dx, dy);
}
// 放大缩小图片
else
if
(mode == MODE_ZOOM) {
float endDis = distance(event);
// 结束距离
if
(endDis > 10f) {
// 两个手指并拢在一起的时候像素大于10
float scale = endDis / startDis;
// 得到缩放倍数
matrix.
set
(currentMatrix);
matrix.postScale(scale, scale,midPoint.x,midPoint.y);
}
}
break
;
// 手指离开屏幕
case
MotionEvent.ACTION_UP:
// 当触点离开屏幕,但是屏幕上还有触点(手指)
case
MotionEvent.ACTION_POINTER_UP:
mode =
0
;
break
;
// 当屏幕上已经有触点(手指),再有一个触点压下屏幕
case
MotionEvent.ACTION_POINTER_DOWN:
mode = MODE_ZOOM;
/** 计算两个手指间的距离 */
startDis = distance(event);
/** 计算两个手指间的中间点 */
if
(startDis > 10f) {
// 两个手指并拢在一起的时候像素大于10
midPoint = mid(event);
//记录当前ImageView的缩放倍数
currentMatrix.
set
(imageView.getImageMatrix());
}
break
;
}
imageView.setImageMatrix(matrix);
return
true
;
}
/** 计算两个手指间的距离 */
private
float distance(MotionEvent event) {
float dx = event.getX(
1
) - event.getX(
0
);
float dy = event.getY(
1
) - event.getY(
0
);
/** 使用勾股定理返回两点之间的距离 */
return
FloatMath.sqrt(dx * dx + dy * dy);
}
/** 计算两个手指间的中间点 */
private
PointF mid(MotionEvent event) {
float midX = (event.getX(
1
) + event.getX(
0
)) /
2
;
float midY = (event.getY(
1
) + event.getY(
0
)) /
2
;
return
new
PointF(midX, midY);
}
}
}
|
step4:AndroidMainfest.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<?xml version=
"1.0"
encoding=
"utf-8"
?>
<manifest xmlns:android=
"http://schemas.android.com/apk/res/android"
package
=
"cn.roco.drag"
android:versionCode=
"1"
android:versionName=
"1.0"
>
<uses-sdk android:minSdkVersion=
"8"
/>
<application android:icon=
"@drawable/icon"
android:
label
=
"@string/app_name"
>
<activity android:name=
".MainActivity"
android:
label
=
"@string/app_name"
>
<intent-filter>
<action android:name=
"android.intent.action.MAIN"
/>
<category android:name=
"android.intent.category.LAUNCHER"
/>
</intent-filter>
</activity>
</application>
</manifest>
|
step5:具体的效果图
上面两个是图片拖拽的效果,而图片的缩放效果要在真机中才能够看得到,请读者自己在真机环境中测试。