`
zhonglunshun
  • 浏览: 139542 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

图片的拖拽和缩放

阅读更多
图片的拖拽很基础也很实用,很多地方用到,直接上干货。
MainActivity.java:
package com.example.dragzoom;

import android.app.Activity;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.os.Bundle;
import android.view.Menu;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.ImageView;

/**
 * 
 * @author Zls
 *实现图片的拖拽和缩放,给图片添加onClickListener
 */

public class MainActivity extends Activity {

	private ImageView image;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		image = (ImageView) this.findViewById(R.id.image);
		image.setOnTouchListener(new MyTouchListener());
	}

	public final class MyTouchListener implements OnTouchListener {
		private int mode = 0;									//三种模式表示触摸类型
		private static final int DRAG = 1;
		private static final int ZOOM = 2;
		private PointF startpPoint = new PointF(), midPoint;	//startPoint用来记录拖拽的时候记录第一次拖拽的点,midPoint让图片缩放的时候不移动
		private float startDis, endDis;							//两者之比表示缩放比例
		private Matrix oldMatrix = new Matrix(), newMatrix = new Matrix();		//两个矩阵

		@Override
		public boolean onTouch(View v, MotionEvent event) {
			switch (event.getAction() & MotionEvent.ACTION_MASK) {
			case MotionEvent.ACTION_DOWN:						//单手指按下表示为拖拽
				mode = DRAG;
				oldMatrix.set(image.getImageMatrix());
				startpPoint.set(event.getX(), event.getY());
				break;

			case MotionEvent.ACTION_MOVE:						// 手指在屏幕移动,该 事件会不断地触发
				if (mode == DRAG) {
					float dx = event.getX() - startpPoint.x;	// 得到在x轴的移动距离
					float dy = event.getY() - startpPoint.y;	// 得到在y轴的移动距离
					newMatrix.set(oldMatrix);					// 在没有进行移动之前的位置基础上进行移动
					newMatrix.postTranslate(dx, dy);
				} else if (mode == ZOOM) {						// 缩放
					endDis = countDis(event);					// 结束距离
					if (endDis > 10f) {
						float scale = endDis / startDis;		// 得到缩放倍数
						newMatrix.set(oldMatrix);
						newMatrix.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 = ZOOM;
				startDis = countDis(event);
				if (startDis > 10f) {
					midPoint = midPoint(event);
				}
				break;
			}
			image.setImageMatrix(newMatrix);					//让image显示最新的矩阵位置和大小,不执行则以上的触摸事件就无效鸟
			return true;
		}
	}

	private static PointF midPoint(MotionEvent event) {
		float dx = (event.getX(1) + event.getX(0)) / 2;
		float dy = (event.getY(1) + event.getY(0)) / 2;
		return new PointF(dx, dy);
	}

	//
	private static float countDis(MotionEvent event) {
		float a = event.getX(1) - event.getX(0);
		float b = event.getY(1) - event.getY(0);
		float c = (float) Math.sqrt(a * a + b * b);
		return c;
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}


layout_main.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <ImageView 
        android:id="@+id/image"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scaleType="matrix"
        android:src="@drawable/luobing"/>

</RelativeLayout>


ps:如果有错误希望不吝赐教。
分享到:
评论

相关推荐

    Csharp处理图片拖动和缩放功能

    本文将详细介绍如何使用 C# 在 Windows Forms 应用程序中实现图片的拖动和缩放功能。 #### 图片拖动功能实现 首先,我们来讨论如何实现图片的拖动功能。在 Windows Forms 中,`PictureBox` 控件通常用于显示图片。...

    图片拖动和缩放功能

    为了提供更好的用户体验,可以使用CSS3的`transition`属性实现平滑的缩放和移动效果。这将使得图片在移动或缩放时有平滑的动画过渡。 5. **响应式设计**: 如果是Web应用,还需要考虑响应式设计,确保图片在不同...

    Android 图片拖动和缩放

    6. **坐标转换**: 由于Android的坐标系统与图片的坐标系统不同,我们需要将屏幕坐标转换为图片坐标,以便正确地处理图片的拖动和缩放。这通常涉及到`ImageView`的`getImageMatrix()`和`mapPointFromViewToImage()`...

    C#图片拖拽缩放工具

    在本文中,我们将深入探讨如何使用C#编程语言创建一个具备图片拖拽和缩放功能的工具。这个工具的核心功能是允许用户通过鼠标操作在界面上自由移动和调整图像的大小,提供直观的图像查看体验。 首先,我们需要了解C#...

    C#PictureBoxx显示图片,可鼠标拖动和缩放

    在开发Windows应用程序时,我们经常需要实现一些交互功能,比如允许用户通过鼠标拖动和缩放图片。本篇文章将详细讲解如何在Visual Studio 2015中,利用.NET Framework 4.5.2,实现一个具有图片拖动和缩放功能的...

    微信小程序自定义组件实现图片单指拖动双指缩放效果

    在这个组件的`js`文件中,我们将实现图片拖动和缩放的核心逻辑。 对于单指拖动效果,我们需要监听`touchstart`, `touchmove`和`touchend`这三个触摸事件。在`touchstart`事件中记录初始触摸点的位置,在`touchmove`...

    C#控件picturebox实现图像拖拽和缩放

    C#控件PictureBox实现图像拖拽和缩放 摘要:本篇文章主要介绍了C#控件PictureBox实现图像拖拽和缩放的方法,通过使用PictureBox控件的MouseDown、MouseUp和MouseMove事件来实现图像的拖拽和缩放。同时,本篇文章还...

    hammer 对图片的拖拽 缩放

    在这个名为"hammer 对图片的拖拽 缩放"的示例中,我们将探讨如何使用`hammer.js`来实现图片的动态操作。 `hammer.js`插件的主要目标是让开发者能够轻松地处理触摸事件,使得网页应用在移动设备上具有更自然、直观的...

    LabVIEW 拖动图片和自动缩放图片

    LabVIEW 拖动图片和自动缩放图片,NI公司自己都没有做出来过,非常的好。

    Winform图片拖拽移动缩放

    以上代码展示了基本的图片拖拽和缩放功能,你可以根据实际需求进行扩展,如添加边界检查以防止图片移出控件范围,或者增加平滑滚动效果等。 在提供的压缩包文件"ImageMoveZoom"中,可能包含了实现这些功能的源代码...

    Android 多点触控,多张图片拖拽,缩放,旋转

    在Android平台上,实现多点触控、多张...综上所述,Android平台提供了丰富的API来支持多点触控、图片拖拽、缩放和旋转。通过理解这些API的工作原理并结合实际需求,开发者可以构建出功能强大且易于使用的图像交互应用。

    jQuery图片拖拽缩放预览

    jQuery库以其简洁API和丰富的功能,成为了JavaScript开发者的首选工具,而图片拖拽和缩放预览则是jQuery中的一个实用特性。 首先,我们要理解jQuery的核心概念。jQuery是一个轻量级的JavaScript库,它简化了HTML...

    微信小程序 图片缩放拖动

    由于压缩包中删除了两个gif图片,这不会影响核心的图片缩放和拖动功能,因为这些图片可能只是示例或者用于演示效果。 综上所述,微信小程序实现图片缩放和拖动的关键在于监听触摸事件,动态计算图片的缩放比例和...

    C#编写的用GDI绘制的图片显示、拖动、缩放自定义控件

    在本文中,我们将深入探讨如何使用C#编程语言与GDI+(图形设备接口)来创建一个自定义控件,该控件具有显示、拖动和缩放图片的功能,特别是支持BMP格式的图片。GDI+是.NET Framework中的一部分,提供了一套丰富的...

    图片的拖动与缩放

    在IT行业中,图片的拖动与缩放是用户界面(UI)设计中常见的交互功能,尤其是在图像处理软件、网页和移动应用中。这个功能增强了用户体验,使得用户可以方便地查看和调整图片的位置和大小。接下来,我们将深入探讨...

    js图片缩放效果制作鼠标滚动图片等比例缩放

    在网页设计中,动态的图片展示效果可以提升用户体验,其中一种常见的技术是通过JavaScript实现鼠标滚动时图片等比例缩放。这个技术的核心在于利用JavaScript事件监听和CSS3变换功能,来实现图片随着页面滚动而优雅地...

    C#图片浏览支持鼠标拖动与滚轮缩放.rar_C#_telephone9gy_图片缩放_缩放_鼠标缩放图片

    在C#编程中,开发一个图像查看器应用时,常常需要实现用户可以通过鼠标进行图片的浏览、拖动和缩放功能。本项目“C#图片浏览支持鼠标拖动与滚轮缩放.rar”正是这样一个实例,它展示了如何利用C#语言来实现这些交互...

Global site tag (gtag.js) - Google Analytics