`

图片简单放大

img 
阅读更多
先上效果图:
[img]

[/img]

布局文件:
main.xm
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:orientation="vertical"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:id="@+id/layout1">

	<RelativeLayout
		xmlns:android="http://schemas.android.com/apk/res/android"
		android:layout_width="fill_parent"
		android:layout_height="fill_parent"
		android:id="@+id/rl">

		<ScrollView
			xmlns:android="http://schemas.android.com/apk/res/android"
			android:layout_width="fill_parent"
			android:layout_height="fill_parent"
			android:layout_weight="19"
			android:scrollbars="none"
			android:fadingEdge="vertical"
			android:layout_gravity="center"
			android:gravity="center">

			<HorizontalScrollView
				android:layout_height="fill_parent"
				android:layout_width="fill_parent"
				android:scrollbars="none"
				android:layout_gravity="center"
				android:gravity="center"
				android:id="@+id/hs">
				<LinearLayout
					android:orientation="horizontal"
					android:layout_width="fill_parent"
					android:layout_height="fill_parent"
					android:id="@+id/layoutImage"
					android:layout_gravity="center"
					android:gravity="center">
					<ImageView
						android:layout_gravity="center"
						android:gravity="center"
						android:id="@+id/myImageView"
						android:layout_width="fill_parent"
						android:layout_height="fill_parent"
						android:layout_weight="19"
						android:paddingTop="5dip"
						android:paddingBottom="5dip" />
				</LinearLayout>
			</HorizontalScrollView>
		</ScrollView>



		<ZoomControls
			android:id="@+id/zoomcontrol"
			android:layout_width="wrap_content"
			android:layout_height="wrap_content"
			android:layout_centerHorizontal="true"
			android:layout_alignParentBottom="true" />

	</RelativeLayout>

</FrameLayout>  


MainActivity:
package com.magus.img;

import android.app.Activity;
import android.app.Dialog;
import android.app.ProgressDialog;
import android.content.DialogInterface;
import android.content.DialogInterface.OnKeyListener;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Matrix;
import android.os.Bundle;
import android.os.Handler;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.KeyEvent;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.ZoomControls;

public class MainActivity extends Activity {
    /** Called when the activity is first created. */
	


	private final int LOADING_IMAGE = 1;
	public static String KEY_IMAGEURI = "ImageUri";
	private ZoomControls zoom;
	private ImageView mImageView;
	private LinearLayout layoutImage;
	private int displayWidth;
	private int displayHeight;
	/**图片资源*/
	private Bitmap bmp;
	/**宽的缩放比例*/
	private float scaleWidth = 1;
	/**高的缩放比例*/
	private float scaleHeight = 1;
	/**用来计数放大+1  缩小-1*/
	private int  zoomNumber=0;
	/**点击屏幕显示缩放按钮,三秒消失*/
	private int showTime=3000;

	
	RelativeLayout rl;
	Handler mHandler = new Handler();
	private Runnable task = new Runnable() {
		public void run() {
			
			zoom.setVisibility(View.INVISIBLE);
			
		}
	};
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
		//showDialog(LOADING_IMAGE);
		//图片是从网络上获取的话,需要加入滚动条
		  bmp=BitmapFactory.decodeResource(getResources(), R.drawable.image);
		//removeDialog(LOADING_IMAGE);
	    initZoom();
}
    
    
	@Override
	protected Dialog onCreateDialog(int id) {
		switch (id) {
		case LOADING_IMAGE: {
			final ProgressDialog dialog = new ProgressDialog(this);
			dialog.setOnKeyListener(new OnKeyListener() {
				@Override
				public boolean onKey(DialogInterface dialog, int keyCode,
						KeyEvent event) {
					if (keyCode == KeyEvent.KEYCODE_BACK) {
						finish();
					}
					return false;
				}
			});
			dialog.setMessage("正在加载图片请稍后...");
			dialog.setIndeterminate(true);
			dialog.setCancelable(true);
			return dialog;
		}
		}
		return null;
	}
	
	
	public void initZoom() {

		/* 取得屏幕分辨率大小 */
		DisplayMetrics dm = new DisplayMetrics();
		getWindowManager().getDefaultDisplay().getMetrics(dm);
		displayWidth = dm.widthPixels;
		displayHeight = dm.heightPixels;
		mImageView = (ImageView) findViewById(R.id.myImageView);
		mImageView.setImageBitmap(bmp);
		layoutImage = (LinearLayout) findViewById(R.id.layoutImage);
		mImageView.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View v) {
				// TODO Auto-generated method stub
                /**
                 * 在图片上和整个view上同时添加点击监听捕捉屏幕
                 * 点击事件,来显示放大缩小按钮 
                 * */			
				zoom.setVisibility(View.VISIBLE);
				mHandler.removeCallbacks(task);
				mHandler.postDelayed(task, showTime);
			}
		});
		
		layoutImage.setOnClickListener(new OnClickListener() {
			
			@Override
			public void onClick(View v) {
				// TODO Auto-generated method stub
			
				zoom.setVisibility(View.VISIBLE);
				mHandler.removeCallbacks(task);
				mHandler.postDelayed(task, showTime);
			}
		});
		
		zoom = (ZoomControls) findViewById(R.id.zoomcontrol);
		zoom.setIsZoomInEnabled(true);
		zoom.setIsZoomOutEnabled(true);
		// 图片放大
		zoom.setOnZoomInClickListener(new OnClickListener() {
			public void onClick(View v) {
				big();
			}
		});
		// 图片减小
		zoom.setOnZoomOutClickListener(new OnClickListener() {

			public void onClick(View v) {
				small();
			}

		});
		
		
		
		zoom.setVisibility(View.VISIBLE);
		mHandler.postDelayed(task, showTime);

	}

	@Override
	public boolean onTouchEvent(MotionEvent event) {
		// TODO Auto-generated method stub
	    /**
         * 在图片上和整个view上同时添加点击监听捕捉屏幕
         * 点击事件,来显示放大缩小按钮 
         * */		
		zoom.setVisibility(View.VISIBLE);
		mHandler.removeCallbacks(task);
		mHandler.postDelayed(task, showTime);
		return false;
	}

	@Override
	public boolean onKeyDown(int keyCode, KeyEvent event) {
		// TODO Auto-generated method stub
		super.onKeyDown(keyCode, event);

		return true;
	}

	/* 图片缩小的method */
	private void small() {
		
	
		
		--zoomNumber;
		int bmpWidth = bmp.getWidth();
		int bmpHeight = bmp.getHeight();

		Log.i("","bmpWidth = " + bmpWidth + ", bmpHeight = " + bmpHeight);

		/* 设置图片缩小的比例 */
		double scale = 0.8;
		/* 计算出这次要缩小的比例 */
		scaleWidth = (float) (scaleWidth * scale);
		scaleHeight = (float) (scaleHeight * scale);
		/* 产生reSize后的Bitmap对象 */
		Matrix matrix = new Matrix();
		matrix.postScale(scaleWidth, scaleHeight);
		Bitmap resizeBmp = Bitmap.createBitmap(bmp, 0, 0, bmpWidth, bmpHeight,
				matrix, true);
		mImageView.setImageBitmap(resizeBmp);

		/* 限制缩小尺寸 */
		if ((scaleWidth * scale * bmpWidth < bmpWidth / 4
				|| scaleHeight * scale * bmpHeight > bmpWidth /4
				|| scaleWidth * scale * bmpWidth > displayWidth / 5
				|| scaleHeight * scale * bmpHeight > displayHeight / 5)&&(zoomNumber==-1) ){
			
		zoom.setIsZoomOutEnabled(false);
		
		} else {
			
		zoom.setIsZoomOutEnabled(true);
	
		}
		
		zoom.setIsZoomInEnabled(true);
		System.gc();
	}

	/* 图片放大的method */
	private void big() {
		++zoomNumber;
		int bmpWidth = bmp.getWidth();
		int bmpHeight = bmp.getHeight();

		/* 设置图片放大的比例 */
		double scale = 1.25;
		/* 计算这次要放大的比例 */
		scaleWidth = (float) (scaleWidth * scale);
		scaleHeight = (float) (scaleHeight * scale);
		/* 产生reSize后的Bitmap对象 */
		Matrix matrix = new Matrix();
		matrix.postScale(scaleWidth, scaleHeight);
		Bitmap resizeBmp = Bitmap.createBitmap(bmp, 0, 0, bmpWidth, bmpHeight,
				matrix, true);
		mImageView.setImageBitmap(resizeBmp);
		/* 限制放大尺寸 */
		if (scaleWidth * scale * bmpWidth > bmpWidth * 4
				|| scaleHeight * scale * bmpHeight > bmpWidth * 4
				|| scaleWidth * scale * bmpWidth > displayWidth * 5
				|| scaleHeight * scale * bmpHeight > displayHeight * 5) {
			
			zoom.setIsZoomInEnabled(false);
		
		} else {
			
			zoom.setIsZoomInEnabled(true);
	
		}
	
		zoom.setIsZoomOutEnabled(true);
		
	System.gc();
	}
	
}
  • 大小: 51.1 KB
分享到:
评论

相关推荐

    简单实用jQuery图片放大镜效果

    本教程将详细介绍如何使用jQuery实现一个简单而实用的图片放大镜效果。 首先,jQuery是一款广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画制作等任务,使得网页交互变得更加便捷。在我们的案例中,...

    图片放大到全屏

    在Android开发中,实现“图片点击一下就放大到全屏,再点一下就回到原界面”的功能是一项常见的需求。这通常涉及到图片显示、手势检测、布局动态调整等多个知识点。以下将详细阐述这些技术要点。 首先,我们需要一...

    H5 PhotoSwipe简单例子 vue图片拉伸放大缩放例子

    **标题解析:** "H5 PhotoSwipe简单例子 - vue图片拉伸放大缩放例子" 这个标题表明我们要探讨的是一个使用H5技术,并结合PhotoSwipe库实现的Vue.js项目,该项目主要用于处理图片的放大、缩小和拉伸功能。 **描述...

    HTML点击图片放大

    这个简单的功能可以通过各种方式进行扩展和优化,比如使用现代CSS的`transform-origin`调整放大中心,或者利用`lightbox`插件实现更复杂的弹出式查看效果。通过学习和实践这些技术,开发者可以提升网页的交互性和...

    在线图片放大缩小

    标题“在线图片放大缩小”指的是一个在线服务或应用程序,它允许用户无损地调整图片的尺寸,无论是放大还是缩小。这种技术在数字媒体处理、网页设计、社交媒体分享以及个人照片编辑等领域都十分常见。下面我们将深入...

    图片点击放大.rar

    在图片放大功能中,CSS可以用于设置初始图片尺寸、鼠标悬停时的过渡效果、以及全屏模式下的样式。例如,使用CSS3的`transform`属性可以实现图片的缩放和平移,而`transition`属性则可以添加平滑的动画效果。全屏模式...

    js实现单击图片放大

    本教程将详细介绍如何使用JavaScript(配合jQuery库)来实现这样一个简单的图片点击放大功能。 首先,我们需要在HTML中设置好图片的基本结构。假设我们有以下HTML代码: ```html &lt;!DOCTYPE html&gt; 图片点击...

    易语言图片放大缩小例程

    本文将深入探讨“易语言图片放大缩小例程”,包括源码解析、图片处理原理以及如何在易语言中实现显示和移动图片。 在易语言中,处理图片放大缩小的关键在于理解图像处理的基本概念和技术。首先,我们需要了解位图和...

    网页代码点击图片放大效果

    CSS3提供了一些新的属性,如`transform`和`transition`,它们可以用来实现简单的图片放大效果。首先,我们需要为图片设置一个容器,并设置初始状态。当用户点击图片时,通过修改`transform`属性来改变图片的大小,...

    C# 对图片的放大缩小 局部放大

    以下是一个简单的图片放大示例: ```csharp using System.Drawing; public static Bitmap BlowUpImage(Bitmap originalImage, int newWidth, int newHeight) { Bitmap scaledImage = new Bitmap(newWidth, ...

    图片放大效果 演示示例 图片放大镜

    传统的简单放大方法(例如最近邻插值或双线性插值)会导致明显的像素化,影响视觉效果。为了改善这一点,出现了多种高级算法,如超分辨率重建、Lanczos重采样和神经网络驱动的图像增强技术。 Lanczos重采样是一种高...

    鼠标经过图片放大

    在网页设计和开发中,"鼠标经过图片放大"是一种常见的交互效果,它可以提升用户体验,让用户在悬停鼠标时能更清晰地看到图片的细节。这种技术主要涉及到HTML、CSS以及JavaScript的应用,尤其在电商网站中非常常见,...

    图片无损放大软件

    传统的图像放大方法,如简单的像素插值,往往会导致图像模糊、像素化,这是因为新插入的像素无法准确地反映原始图像的信息。而无损放大软件则采用了先进的算法,如超分辨率重建、深度学习等,来生成更接近原始图像的...

    使用jQuery实现的点击图片放大

    这种方法简单且性能良好,但可能无法完全覆盖图片,可能会有空白区域。 **方法二:使用弹出框或模态窗口** 另一种方法是当用户点击图片时,显示一个带有放大图片的新层或模态窗口。首先,我们需要在HTML中添加一个...

    Unity鼠标滑过,图片局部放大效果

    在Unity引擎中,实现“鼠标滑过,图片局部放大效果”是一种常见的交互设计,常见于电商网站的商品展示或游戏中的UI元素互动。这种效果能够增强用户的视觉体验,提供更直观的信息展示。以下将详细介绍如何利用Unity来...

    js实现点击图片放大照片

    对于简单的应用场景,可以使用CSS的`object-fit`属性来实现图片的缩放效果: ```html ; height: auto; object-fit: cover;"&gt; ``` 以上代码会保持图片的纵横比,并将其宽度限制为200像素,同时自动调整高度,以适应...

    jquery图片放大滚动

    以下是一个简单的jQuery图片放大滚动的示例代码: ```javascript $(document).ready(function() { $('.img-container').hover(function() { $(this).find('img').addClass('zoom'); }, function() { $(this)....

    一个简单的javascript图片放大效果代码

    一个简单的图片放大效果: 参数说明: 1.berviary:String,需要被放大的图片id 2.expand:object,放大区域,如果不设置此项或者此项的id未设置,则默认为光标跟随模式,会自动创建用于显示放大区域的div. 3.clip:object,...

    jquery 点击图片放大,再点击缩小(针对同一张图片)

    至此,一个简单的jQuery图片放大缩小功能已经实现。用户点击图片时,图片会放大;再次点击,图片会恢复原大小。这个功能对于展示细节丰富的图片特别有用,如产品图片、艺术作品等。 注意:在实际项目中,可能需要...

    APP里点击图片放大功能实现

    在这个场景下,我们关注的是通过用户交互来控制图片的放大和缩小。 1. **单击检测**:首先,我们需要监听UITableViewCell中的UIImageView的点击事件。这可以通过为UIImageView添加手势识别器(UIGestureRecognizer...

Global site tag (gtag.js) - Google Analytics