简单实现Android放大镜效果

2020-10-29 22:15:06 浏览数 (1)

利用之前学过的图形图像绘画技术和图片添加特效技术,我们来实现一个Android放大镜的简单应用。

最终效果如图

具体实现:

用来显示自定义的绘图类的布局文件 res/layout/main.xml:

代码语言:javascript复制
<?xml version="1.0" encoding="utf-8"?  
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 xmlns:tools="http://schemas.android.com/tools" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent" 
 android:id="@ id/frameLayout1" 
 android:orientation="vertical" 
   
  
</FrameLayout  

打开MainActivity,在文件中创建名为MyView的内部类,继承android.view.View类,并添加构造方法和重写onDraw(Canvas canvas)方法,在里面进行作图:

MainActivity:

代码语言:javascript复制
package com.example.test; 
import android.app.Activity; 
import android.content.Context; 
import android.graphics.Bitmap; 
import android.graphics.BitmapFactory; 
import android.graphics.BitmapShader; 
import android.graphics.Canvas; 
import android.graphics.Matrix; 
import android.graphics.Shader.TileMode; 
import android.graphics.drawable.ShapeDrawable; 
import android.graphics.drawable.shapes.OvalShape; 
import android.os.Bundle; 
import android.view.MotionEvent; 
import android.view.View; 
import android.widget.FrameLayout; 
public class MainActivity extends Activity { 
@Override 
public void onCreate(Bundle savedInstanceState) { 
super.onCreate(savedInstanceState); 
setContentView(R.layout.main); 
//获取布局文件中添加的帧布局管理器 
FrameLayout fl=(FrameLayout)findViewById(R.id.frameLayout1); 
//将自定义的MyView视图添加到帧布局 
fl.addView(new MyView(this)); 
} 
public class MyView extends View{ 
private Bitmap bitmap;//源图像,也就是背景图像 
private ShapeDrawable drawable; 
private final int RADIUS=57;//放大镜的半径 
private final int FACTOR=2;//放大倍数 
private Matrix matrix=new Matrix(); 
private Bitmap bitmap_magnifiter;//放大镜位图 
private int m_left=0;//放大镜的左边距 
private int m_top=0;//放大镜的顶边距 
public MyView(Context context) { 
super(context); 
//获取要显示的源图像 
Bitmap bitmap_source=BitmapFactory.decodeResource(getResources(), R.drawable.backgroud); 
bitmap=bitmap_source; 
BitmapShader shader=new BitmapShader(Bitmap.createScaledBitmap( 
bitmap_source, bitmap_source.getWidth()*FACTOR, 
bitmap_source.getHeight()*FACTOR, true),TileMode.CLAMP, 
TileMode.CLAMP);//创建BitmapShader对象 
/* 注:Bitmap.createScaledBitmap() 方 法根据给定的 Bitmap 创建 一个新的,缩放后的 Bitmap。 
* Shader.TileMode类型的参数包括CLAMP、MIRROR和REPEAT3个可选值,其中,CLAMP为使用 
* 边界颜色来填充剩余的空间;MIRROR为采用镜像方式;REPEAT为采用重复方式*/ 
//圆形的drawable 
drawable=new ShapeDrawable(new OvalShape()); 
drawable.getPaint().setShader(shader); 
drawable.setBounds(0, 0, RADIUS*2, RADIUS*2);//设置圆的外切矩形 
bitmap_magnifiter=BitmapFactory.decodeResource(getResources(), 
R.drawable.magnifiter);//获取放大镜图像 
m_left=RADIUS-bitmap_magnifiter.getWidth()/2;//计算放大镜默认的左边距 
m_top=RADIUS-bitmap_magnifiter.getHeight()/2;//计算放大镜默认的右边距 
} 
@Override 
protected void onDraw(Canvas canvas) { 
canvas.drawBitmap(bitmap, 0,0, null);//绘制背景图像 
canvas.drawBitmap(bitmap_magnifiter, m_left, m_top,null);//绘制放大镜图像 
drawable.draw(canvas);//绘制放大后的图像 
super.onDraw(canvas); 
} 
//重写onTouchEvent方法实现当用户触摸屏幕时,放大触摸点附近的图像 
@Override 
public boolean onTouchEvent(MotionEvent event) { 
final int x=(int)event.getX(); 
final int y=(int)event.getY(); 
//平移到绘制shader的起始位置 
matrix.setTranslate(RADIUS-x*FACTOR, RADIUS-y*FACTOR); 
drawable.getPaint().getShader().setLocalMatrix(matrix); 
drawable.setBounds(x-RADIUS,y-RADIUS,x RADIUS,y RADIUS);//设置圆的外切矩形 
m_left=x-bitmap_magnifiter.getWidth()/2;//计算放大镜的左边距 
m_top=y-bitmap_magnifiter.getHeight()/2;//计算放大镜的右边距 
invalidate();//重绘画布 
return true; 
} 
} 
} 

运行效果如开头图片显示效果一样,测试成功。

以上就是本文的全部内容,希望对大家的学习有所帮助。

0 人点赞