Android实现随触摸移动而变化的效果

来源：互联网发布：如何安装c语言编辑：程序博客网时间：2024/05/17 23:43

Android可以做很多有意思的事情，而这正是我喜欢她的原因。
今天会做一个在屏幕上随着手指移动而变化的效果。

步骤如下

首先，我们要自定义一个View组件，而这个组件就是在之后会用到的屏幕上移动的小组件。然后我们在一个布局上添加这个View，并且给此View添加onTouch触摸事件。此外，此组件内也要重写onDraw方法，对此组件进行绘制。

废话不说，代码见真章：
class GirlView extends View{
public float bitmapX;

    public float bitmapY;    public Bitmap bitmap= BitmapFactory.decodeResource(getResources(), R.drawable.s_1);    public GirlView(Context context) {        super(context);        this.bitmapX = 0;        this.bitmapY = 60;    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        Paint paint = new Paint();//画笔        canvas.drawBitmap(bitmap,bitmapX,bitmapY,paint);//作画        if (bitmap.isRecycled()) {            bitmap.recycle();//回收        }    }}

绘制三步骤：
1. 准备画板，也就是：Canvas canvas对象
2. 准备画布，
bitmap=BitmapFactory.decodeResource(getResources(), R.drawable.s_1);
3. 画笔准备，Paint paint = new Paint();
4. 然后开始绘制就行了。

接着，再奉上Activity内的代码：
public class FrameActivity extends AppCompatActivity {

    private FrameLayout frameLayout;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_frame);        frameLayout = (FrameLayout) findViewById(R.id.main_frame);        final GirlView girlView = new GirlView(this);        girlView.setOnTouchListener(new View.OnTouchListener() {            float startX;            float startY;            float moveX;            float moveY;            int i=0;            @Override            public boolean onTouch(View v, MotionEvent event) {                switch (event.getAction()) {                    case MotionEvent.ACTION_DOWN:                        startX = event.getX()-200;                        startY = event.getY()-250;                        girlView.bitmapX = startX;                        girlView.bitmapY = startY;                        girlView.invalidate();                        break;                    case MotionEvent.ACTION_MOVE:                        moveX = event.getX();                        moveY = event.getY();                        /*减去的200和250分别指代图片本来的宽和高。                        * Touch事件的时候，手指的落点会在此View的左上角，做减法的原因                        * 就是要让手指落点到View的中心*/                        if (Math.abs(moveX-startX)>50|| Math.abs(moveY-startY)>50) {                            girlView.bitmapX = moveX-200;                            girlView.bitmapY = moveY-250;                            i++;                            girlView.bitmap = getMove(i % 8);                            girlView.invalidate();//重新绘制                            startX=moveX;                            startY = moveY;                        }                }                return true;            }        });        frameLayout.addView(girlView);    }    /*得到不同的画布*/    public Bitmap getMove(int i) {        Bitmap bitmap = BitmapFactory.decodeResource(getResources(), getDrawID(i));        return bitmap;    }    public int getDrawID(int i) {        int drawID = R.drawable.s_1;        switch (i) {            case 0:                drawID =R.drawable.s_1;                break;            case 1:                drawID =R.drawable.s_2;                break;            case 2:                drawID =R.drawable.s_3;                break;            case 3:                drawID =R.drawable.s_4;                break;            case 4:                drawID =R.drawable.s_5;                break;            case 5:                drawID =R.drawable.s_6;                break;            case 6:                drawID =R.drawable.s_7;                break;            case 7:                drawID =R.drawable.s_8;                break;        }        return drawID;    }

分析如下：
这里我们首先准备八张图，这八张图连起来就会形成一个动画效果。
在oTouch的方法内，我们设定了这样一个条件，只要手指移动的距离，在X轴和Y轴上不管哪一个超过50的话，就会让GrilView切换一张画布。
同时，为了保证手指落下的点在组件内部，要减去相应地距离。因为如果直接让moveX和moveY的值等于GrilView的x和y的值的话，这样手指的落点就会在此组件的左上角，那样效果不是很好。
最后，切记onTouch方法要返回true。

以上

0 0