图片拖放 [英] Image dragging and dropping

查看:115
本文介绍了图片拖放的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经开始了previous的问题,但我想改变拖动的方法。

I have started the previous question, but I want to change the method of dragging.

所以任务是,用户(孩子)学习如何做加法。因此,有2糖果,和1糖果罐。用户需要拖动和糖果拖放到罐子。怎么办呢?

So the task is, the user (kid) learns how to do addition. So there's 2 candies, and 1 candy jar. The user requires to drag and drop the candy to the jar. How to do it?

这是code我有:

主要XML

<?xml version="1.0" encoding="utf-8"?>


<AbsoluteLayout android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/mainLayout">
<ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/emptyLetterView" android:src="@drawable/r_empty" android:layout_x="200px" android:layout_y="300px"></ImageView>
<ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/letterView" android:src="@drawable/r_filled" ></ImageView>
</AbsoluteLayout>

这是java文件
    包edu.sbcc.cs123.draganddropbasic;

This is the java file package edu.sbcc.cs123.draganddropbasic;

import android.app.*;
import android.graphics.*;
import android.os.*;
import android.view.*;
import android.view.View.*;
import android.widget.*;

@SuppressWarnings("deprecation")
public class DragAndDropBasicActivity extends Activity implements OnTouchListener {
    private ImageView letterView;                       // The letter that the user drags.
    private ImageView emptyLetterView;              // The letter outline that the user is supposed to drag letterView to.
    private AbsoluteLayout mainLayout;


    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        mainLayout = (AbsoluteLayout) findViewById(R.id.mainLayout);
        mainLayout.setOnTouchListener(this);
        letterView = (ImageView) findViewById(R.id.letterView);
        letterView.setOnTouchListener(this);

        emptyLetterView = (ImageView) findViewById(R.id.emptyLetterView);
    }

    private boolean dragging = false;
    private Rect hitRect = new Rect();

    @Override
    /**
     * NOTE:  Had significant problems when I tried to react to ACTION_MOVE on letterView.   Kept getting alternating (X,Y) 
     * locations of the motion events, which caused the letter to flicker and move back and forth.  The only solution I could 
     * find was to determine when the user had touched down on the letter, then process moves in the ACTION_MOVE 
     * associated with the mainLayout.
     */
    public boolean onTouch(View v, MotionEvent event) {
        boolean eventConsumed = true;
        int x = (int)event.getX();
        int y = (int)event.getY();

        int action = event.getAction();
        if (action == MotionEvent.ACTION_DOWN) {
            if (v == letterView) {
                dragging = true;
                eventConsumed = false;
            }
        } else if (action == MotionEvent.ACTION_UP) {

            if (dragging) {
                emptyLetterView.getHitRect(hitRect);
                if (hitRect.contains(x, y))
                    setSameAbsoluteLocation(letterView, emptyLetterView);
            }
            dragging = false;
            eventConsumed = false;

        } else if (action == MotionEvent.ACTION_MOVE) {
            if (v != letterView) {
                if (dragging) {
                    setAbsoluteLocationCentered(letterView, x, y);
                }
            }
        }

        return eventConsumed;

    }


    private void setSameAbsoluteLocation(View v1, View v2) {
        AbsoluteLayout.LayoutParams alp2 = (AbsoluteLayout.LayoutParams) v2.getLayoutParams();
        setAbsoluteLocation(v1, alp2.x, alp2.y);
    }


    private void setAbsoluteLocationCentered(View v, int x, int y) {
        setAbsoluteLocation(v, x - v.getWidth() / 2, y - v.getHeight() / 2);
    }


    private void setAbsoluteLocation(View v, int x, int y) {
        AbsoluteLayout.LayoutParams alp = (AbsoluteLayout.LayoutParams) v.getLayoutParams();
        alp.x = x;
        alp.y = y;
        v.setLayoutParams(alp);
    }
}

这就是我一直在执行一段时间
我只是添加了新的变量,并将其更改为letterView1和emptyLetterView1

And this is what I have been implementing for awhile I just add the new variables and change it to letterView1 and emptyLetterView1

Java的文件:

package edu.sbcc.cs123.draganddropbasic;

import android.app.*;
import android.graphics.*;
import android.os.*;
import android.view.*;
import android.view.View.*;
import android.widget.*;

@SuppressWarnings("deprecation")
public class DragAndDropBasicActivity extends Activity implements OnTouchListener {
    private ImageView letterView;                       // The letter that the user drags.
    private ImageView emptyLetterView;          // The letter outline that the user is supposed to drag letterView to.
    private ImageView letterView1;                      // The letter that the user drags.
    private ImageView emptyLetterView1; 
    private AbsoluteLayout mainLayout;


    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        mainLayout = (AbsoluteLayout) findViewById(R.id.mainLayout);
        mainLayout.setOnTouchListener(this);
        letterView = (ImageView) findViewById(R.id.letterView);
        letterView.setOnTouchListener(this);

        emptyLetterView = (ImageView) findViewById(R.id.emptyLetterView);

        letterView1 = (ImageView) findViewById(R.id.letterView1);
        letterView1.setOnTouchListener(this);

        emptyLetterView1 = (ImageView) findViewById(R.id.emptyLetterView1);
    }

    private boolean dragging = false;
    private Rect hitRect = new Rect();

    @Override
    /**
     * NOTE:  Had significant problems when I tried to react to ACTION_MOVE on letterView.   Kept getting alternating (X,Y) 
     * locations of the motion events, which caused the letter to flicker and move back and forth.  The only solution I could 
     * find was to determine when the user had touched down on the letter, then process moves in the ACTION_MOVE 
     * associated with the mainLayout.
     */
    public boolean onTouch(View v, MotionEvent event) {
        boolean eventConsumed = true;
        int x = (int)event.getX();
        int y = (int)event.getY();

        int action = event.getAction();
        if (action == MotionEvent.ACTION_DOWN) {
            if (v == letterView) {
                dragging = true;
                eventConsumed = false;
            }
            if (v == letterView1) {
                dragging = true;
                eventConsumed = false;
            }
        } else if (action == MotionEvent.ACTION_UP) {

            if (dragging) {
                emptyLetterView.getHitRect(hitRect);
                if (hitRect.contains(x, y))
                    setSameAbsoluteLocation(letterView, emptyLetterView);
            }

            if (dragging) {
                emptyLetterView1.getHitRect(hitRect);
                if (hitRect.contains(x, y))
                    setSameAbsoluteLocation1(letterView1, emptyLetterView1);
            }
            dragging = false;
            eventConsumed = true;

        } else if (action == MotionEvent.ACTION_MOVE) {
            if (v != letterView) {
                if (dragging) {
                    setAbsoluteLocationCentered(letterView, x, y);
                }
            }
            if (v != letterView1) {
                if (dragging) {
                    setAbsoluteLocationCentered1(letterView1, x, y);
                }
            }
        }

        return eventConsumed;

    }


    private void setSameAbsoluteLocation(View v1, View v2) {
        AbsoluteLayout.LayoutParams alp2 = (AbsoluteLayout.LayoutParams) v2.getLayoutParams();
        setAbsoluteLocation(v1, alp2.x, alp2.y);
    }


    private void setAbsoluteLocationCentered(View v, int x, int y) {
        setAbsoluteLocation(v, x - v.getWidth() / 2, y - v.getHeight() / 2);
    }


    private void setAbsoluteLocation(View v, int x, int y) {
        AbsoluteLayout.LayoutParams alp = (AbsoluteLayout.LayoutParams) v.getLayoutParams();
        alp.x = x;
        alp.y = y;
        v.setLayoutParams(alp);
    }




    private void setSameAbsoluteLocation1(View v1, View v2) {
        AbsoluteLayout.LayoutParams alp2 = (AbsoluteLayout.LayoutParams) v2.getLayoutParams();
        setAbsoluteLocation1(v1, alp2.x, alp2.y);
    }


    private void setAbsoluteLocationCentered1(View v, int x, int y) {
        setAbsoluteLocation1(v, x - v.getWidth() / 2, y - v.getHeight() / 2);
    }


    private void setAbsoluteLocation1(View v, int x, int y) {
        AbsoluteLayout.LayoutParams alp = (AbsoluteLayout.LayoutParams) v.getLayoutParams();
        alp.x = x;
        alp.y = y;
        v.setLayoutParams(alp);
    }
}

我添加图像文件到XML文件并更改其ID为letterView1和emptyLetterView1为好。

I have added the image file to the xml file and change the id to letterView1 and emptyLetterView1 as well.

所以成功显示其他图像,但是,当我拖着形象之一,另一个图像消失了。

So another image is shown successfully, however, when I dragged one of the image, another images disappeared.

我怎样才能实现这个好吗?

How can I implement this please?

推荐答案

与code中的问题就在这里。

The issue with your code is here

else if (action == MotionEvent.ACTION_MOVE) {
        if (v != letterView) {
            if (dragging) {
                setAbsoluteLocationCentered(letterView, x, y);
            }
        }
        if (v != letterView1) {
            if (dragging) {
                setAbsoluteLocationCentered1(letterView1, x, y);
            }
        }
    }

现在在你的前面code有2监听器。

Now in your earlier code there were 2 listeners.


  1. 的主要背景

  2. letterView

  1. The main background
  2. The letterView

现在你有3个侦听器,这样如果(V!= letterView)如果用户拖在地面上或信件将是真实的。

Now you have 3 listeners so if (v != letterView) will be true if the user is dragging on the ground or on the letter.

例如,如果你开始拖动屏幕上的一个随机的补丁则 v!= letterView v!= letterView1 。他们都将被然后集中到同一个点,这样人会出现有隐藏的。

For example if you start dragging on a random patch of screen then v!=letterView and v!=letterView1. They will both be centered then to the same point so one will APPEAR to have hidden.

同样的,如果你拖上其中一人将成立。另将移动到这一点,它就会出现隐藏的。

Same will hold true if you drag on one of them. The other will move to that point and it will appear hidden.

而不是使用非等式,你可以尝试

Instead of using non-equations you can try

else if (action == MotionEvent.ACTION_MOVE) {
        if (v == letterView) {
            if (dragging) {
                setAbsoluteLocationCentered(letterView, x, y);
            }
        }
        if (v == letterView1) {
            if (dragging) {
                setAbsoluteLocationCentered1(letterView1, x, y);
            }
        }
    }

或者,你甚至可以做的命中测试

Or you can even do a hit test

   else if (action == MotionEvent.ACTION_MOVE) {
        letterView.getHitRect(hitRect);
        if (letterView.contains(x,y)) {
            if (dragging) {
                setAbsoluteLocationCentered(letterView, x, y);
            }
        }
        letterView1.getHitRect(hitRect);
        if (letterView1.contains(x,y)) {
            if (dragging) {
                setAbsoluteLocationCentered1(letterView1, x, y);
            }
        }
  }

这篇关于图片拖放的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆