2012-10 自由拼图 简介

前言

照片格是目前在手机上广泛使用的一个应用。该应用将多张图片组合到一张图片之中，便于在网络上传播。
本文将对项目中自己实现的自由拼图的实现进行较详细的介绍

 

自由拼图界面

 

整个实现一览

 

类图

类图说明
模板拼图，自由拼图公用类：
PhotoGridDisplay：整个屏幕（各种按键）.
PhotogridPreview: 定义拼图类的方法

自由拼图相关类：
PhotoGridFree：实现PhotogridPreview中定义的方法，生成自由拼图
FreeImageView：自由拼图中的图片
TouchView：自由拼图中的左上角按键
TouchViewMirror：自由拼图中的其他位置的按键的基类
TouchViewCenterMirror：继承自TouchViewMirror，自由拼图中的右下角的按键

 

 

PhotoGridFree

 

实现PhotogridPreview中定义的方法
生成自由拼图的界面，背景，背景选择栏，根据PhotoGridDisplay传递过来的图片数量，生成对应的FreeImageView，生成FreeImageView最初的样式（如图所示的各图片的位置和旋转），生成touchView，TouchViewCenterMirror
在activity onPause()的时候保存FreeImageView的位置信息，旋转信息，在onResume()的时候重绘。

FreeImageView

继承ImageView，重载onMeasure()实现在初始化界面时，FreeImageView的图片的部分能够显示在PhotoGridFree窗口外面；重载onDraw()实现绘制图片边框。
注册OnTouchListener实现对图片的拖动效果。
提供setLocation()接口，实现外部控制图片的位置。
定义 interface OnTouchViewTouchListener {

       public void onTouch(View v, MotionEvent event);
   };

提供addOnFreeImageTouchListener()监听接口，实现通知外部监听类

关键API：
boolean android.widget.ImageView.setFrame(int l, int t, int r, int b)

protected boolean setFrame (int l, int t, int r, int b)
Since: API Level 1
Assign a size and position to this view. This is called from layout.

TouchView

该类负责控制各个图片（FreeImageView）的旋转效果。通过HashMap<FreeImageView, Point>保存各FreeImageView的位置信息。

该类会获得一个ImageView的图片。当FreeImageView被旋转时，一个指示旋转的图片会出现在FreeImageView的左上方。
通过向FreeImageView类注册OnTouchViewTouchListener，监听哪个FreeImageView被选中。
自身实现OnTouchListener，实现由拖动TouchView来缩放，旋转FreeImageView。
内置TouchViewMirror数组，负责处理TouchViewMirror的onTouch行为，通知TouchViewMirror。

旋转和缩放
旋转的实现是依据图片的中心进行旋转。
旋转原则：TouchView的中心，TouchViewCenterMirror的中心始终在FreeImageView的对角线上。
需要注意的是三角函数的有效区间，必要时要自己修正。
缩放原则：TouchView的中心与FreeImageView的边角的距离保持不变。

 

TouchViewMirror

 

抽象类。定义该类的目的是如果要在FreeImageView的另外三个边角（右上，左下，右下）实现TouchView，则通过继承TouchViewMirror，将其所获得的onTouchEvent传递给TouchView,实现对FreeImageView的操作；同时向TouchView注册监听，获得TouchView行为的变换。

   abstract public void init(TouchView touchView, FreeImageView freeImageView,
           float w, float h);
   abstract public void notifyTouchViewVisible(FreeImageView freeImageView);
   abstract public void notifyTouchViewInVisible();
   abstract protected void handleOnTouch(View v, MotionEvent event);
   abstract public void notifyTouchViewMirrorLocation(
           FreeImageView freeImageView, float incX, float incY,
           boolean translate);
   abstract public void setLocation(FreeImageView freeImageView, int x, int y);

TouchViewCenterMirror

继承自TouchViewMirror，表现为右下角的TouchView。之所以定义为CenterMirror是因为同左上角的TouchView是关于FreeImageView的中心对称的。