有条件的拖放图像
Conditional Drag & Drop of images
因为我是新手,所以我会问一个问题,这个问题对你们中的许多人来说可能非常简单,但是我,我整天都在学习教程以了解它是如何工作的,但不幸的是我不是那个幸运.
我正在构建一个儿童应用程序,他们必须将动物图像拖到相应的阴影上。因此在下面的示例中,他们必须将奶牛的图像拖到奶牛的阴影上。
如果他们将它拖到错误的图像上,将会有声音通知这样说,如果他们将它拖到正确的图像上,图像将替换阴影,并且会有确认声音。
到目前为止,我设法编写了将奶牛图像拖到任何阴影上并替换它们的部分。我想只在正确的时候更换。
我将在我的代码下方添加,希望有人能够帮助我!
这是xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/animals_types"
android:textSize="25sp"
android:id="@+id/gamesCategory"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="@string/games_cow"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:textSize="35sp"
android:id="@+id/text_cow"
android:layout_below="@+id/gamesCategory"
android:layout_centerHorizontal="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/games_cow"
android:layout_below="@+id/text_cow"
android:layout_centerHorizontal="true"
android:maxHeight="150dp"
android:maxWidth="150dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:id="@+id/games_cow_item" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/games_cow_shadow"
android:maxHeight="150dp"
android:maxWidth="150dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:layout_below="@+id/games_cow_item"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:id="@+id/games_cow_shadow"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/games_pig_shadow"
android:maxHeight="130dp"
android:maxWidth="130dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:layout_marginRight="20dp"
android:layout_marginEnd="20dp"
android:layout_below="@+id/games_cow_item"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:id="@+id/games_pig_shadow"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/games_horse_shadow"
android:maxHeight="150dp"
android:maxWidth="150dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:layout_margin="20dp"
android:layout_below="@+id/games_cow_shadow"
android:id="@+id/games_horse_shadow"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="NEXT"
android:id="@+id/button5"
android:layout_below="@+id/games_horse_shadow"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BACK"
android:id="@+id/button6"
android:layout_alignTop="@+id/button5"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
这是Java:
package com.gadgetcatch.firstwords;
import android.content.ClipData;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.DragEvent;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;
/**
* Created by Alex on 2/1/2016.
*/
public class GamesAnimals extends AppCompatActivity {
private ImageView option, choice1, choice2, choice3;
@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.games_animals);
android.support.v7.app.ActionBar actionBar = getSupportActionBar();
assert actionBar != null;
actionBar.setDisplayShowHomeEnabled(true);
actionBar.setIcon(R.mipmap.ic_launcher);
//View to drag
option = (ImageView)findViewById(R.id.games_cow_item);
//Views to drop unto
choice1 = (ImageView)findViewById(R.id.games_cow_shadow);
choice2 = (ImageView)findViewById(R.id.games_pig_shadow);
choice3 = (ImageView)findViewById(R.id.games_horse_shadow);
//set touch listener
option.setOnTouchListener(new ChoiceTouchListener());
//set drag listeners
choice1.setOnDragListener(new ChoiceDragListener());
choice2.setOnDragListener(new ChoiceDragListener());
choice3.setOnDragListener(new ChoiceDragListener());
}
private final class ChoiceTouchListener implements View.OnTouchListener{
public boolean onTouch(View view, MotionEvent motionEvent){
if (motionEvent.getAction() == MotionEvent.ACTION_DOWN) {
//setup drag
ClipData data = ClipData.newPlainText("", "");
View.DragShadowBuilder shadowBuilder = new View.DragShadowBuilder(view);
//start dragging the item touched
view.startDrag(data, shadowBuilder, view, 0);
return true;
}
else {
return false;
}
}
}
private class ChoiceDragListener implements View.OnDragListener{
@Override
public boolean onDrag(View v, DragEvent event) {
//handle drag events
switch (event.getAction()) {
case DragEvent.ACTION_DRAG_STARTED:
//no action necessary
break;
case DragEvent.ACTION_DRAG_ENTERED:
//no action necessary
break;
case DragEvent.ACTION_DRAG_EXITED:
//no action necessary
break;
case DragEvent.ACTION_DROP:
//handle the dragged view being dropped over a drop view - asta de deasupra
//handle the dragged view being dropped over a target view -asta de jos
View view = (View) event.getLocalState();
//stop displaying the view where it was before it was dragged
view.setVisibility(View.INVISIBLE);
//view dragged item is being dropped on
ImageView dropTarget = (ImageView) v;
//view being dragged and dropped
ImageView dropped = (ImageView) view;
//update the image in the target view to reflect the data being dropped
dropTarget.setImageDrawable(dropped.getDrawable());
break;
case DragEvent.ACTION_DRAG_ENDED:
//no action necessary
break;
default:
break;
}
return true;
}
}
}
这是 .xml 的图片,以防我解释得不够好。
提前感谢您的任何建议!
cow_image
你快完成了:)你只需要检查图像是否正确。从您的代码中,我看到缺少所有逻辑。有上百万种方法可以做到这一点,但我建议您使用视图的 TAG
属性 来存储有关每个图像的信息。
A Tag 是您可以存储在任何视图上的东西。它可以是一个 String
,一个数字,等等。为了清楚起见,我们使用 String
。 我们将设置相同的 TAG 以匹配图像/阴影:
- Image COW SHADOW 将具有标签 "COW",与 Image COW
相同
- 图片 PIG SHADOW 将具有标签 "PIG",与图片 PIG 相同。
- Image HORSE SHADOW 将具有标签 "HORSE",与 Image Horse 相同。
然后在你的情况下ACTION_DROP,你将检查阴影和拖放图像的标签是否相同,如下所示:
.
.
.
case DragEvent.ACTION_DROP:
.
.
.
// view dragged item is being dropped on
ImageView dropTarget = (ImageView) v;
// view being dragged and dropped
ImageView dropped = (ImageView) view;
String tagDropTarget = (String)dropTarget.getTag(),
tagDroppedImage = (String)dropped.getTag();
if ((tagDropTarget != null) && (tagDropTarget.equals (tagDroppedImage)) {
// yippie! correct!!
// update the image in the target view to reflect the data being dropped
dropTarget.setImageDrawable(dropped.getDrawable());
} else {
// oppps, wrong!!!!
.
.
}
break;
现在我们需要在 XML:
中设置标签
<ImageView
android:tag="COW"
.
.
android:src="@drawable/games_cow"
android:id="@+id/games_cow_item" />
<ImageView
android:tag="COW"
.
.
android:src="@drawable/games_cow_shadow"
android:id="@+id/games_cow_shadow"/>
<ImageView
android:tag="PIG"
.
.
android:src="@drawable/games_pig_shadow"
android:id="@+id/games_pig_shadow"/>
<ImageView
android:tag="HORSE"
.
.
android:src="@drawable/games_horse_shadow"
android:id="@+id/games_horse_shadow"/>
因为我是新手,所以我会问一个问题,这个问题对你们中的许多人来说可能非常简单,但是我,我整天都在学习教程以了解它是如何工作的,但不幸的是我不是那个幸运.
我正在构建一个儿童应用程序,他们必须将动物图像拖到相应的阴影上。因此在下面的示例中,他们必须将奶牛的图像拖到奶牛的阴影上。
如果他们将它拖到错误的图像上,将会有声音通知这样说,如果他们将它拖到正确的图像上,图像将替换阴影,并且会有确认声音。
到目前为止,我设法编写了将奶牛图像拖到任何阴影上并替换它们的部分。我想只在正确的时候更换。
我将在我的代码下方添加,希望有人能够帮助我!
这是xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/animals_types"
android:textSize="25sp"
android:id="@+id/gamesCategory"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="@string/games_cow"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:textSize="35sp"
android:id="@+id/text_cow"
android:layout_below="@+id/gamesCategory"
android:layout_centerHorizontal="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/games_cow"
android:layout_below="@+id/text_cow"
android:layout_centerHorizontal="true"
android:maxHeight="150dp"
android:maxWidth="150dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:id="@+id/games_cow_item" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/games_cow_shadow"
android:maxHeight="150dp"
android:maxWidth="150dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:layout_below="@+id/games_cow_item"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:id="@+id/games_cow_shadow"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/games_pig_shadow"
android:maxHeight="130dp"
android:maxWidth="130dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:layout_marginRight="20dp"
android:layout_marginEnd="20dp"
android:layout_below="@+id/games_cow_item"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:id="@+id/games_pig_shadow"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/games_horse_shadow"
android:maxHeight="150dp"
android:maxWidth="150dp"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:layout_margin="20dp"
android:layout_below="@+id/games_cow_shadow"
android:id="@+id/games_horse_shadow"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="NEXT"
android:id="@+id/button5"
android:layout_below="@+id/games_horse_shadow"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="BACK"
android:id="@+id/button6"
android:layout_alignTop="@+id/button5"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
这是Java:
package com.gadgetcatch.firstwords;
import android.content.ClipData;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.DragEvent;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;
/**
* Created by Alex on 2/1/2016.
*/
public class GamesAnimals extends AppCompatActivity {
private ImageView option, choice1, choice2, choice3;
@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.games_animals);
android.support.v7.app.ActionBar actionBar = getSupportActionBar();
assert actionBar != null;
actionBar.setDisplayShowHomeEnabled(true);
actionBar.setIcon(R.mipmap.ic_launcher);
//View to drag
option = (ImageView)findViewById(R.id.games_cow_item);
//Views to drop unto
choice1 = (ImageView)findViewById(R.id.games_cow_shadow);
choice2 = (ImageView)findViewById(R.id.games_pig_shadow);
choice3 = (ImageView)findViewById(R.id.games_horse_shadow);
//set touch listener
option.setOnTouchListener(new ChoiceTouchListener());
//set drag listeners
choice1.setOnDragListener(new ChoiceDragListener());
choice2.setOnDragListener(new ChoiceDragListener());
choice3.setOnDragListener(new ChoiceDragListener());
}
private final class ChoiceTouchListener implements View.OnTouchListener{
public boolean onTouch(View view, MotionEvent motionEvent){
if (motionEvent.getAction() == MotionEvent.ACTION_DOWN) {
//setup drag
ClipData data = ClipData.newPlainText("", "");
View.DragShadowBuilder shadowBuilder = new View.DragShadowBuilder(view);
//start dragging the item touched
view.startDrag(data, shadowBuilder, view, 0);
return true;
}
else {
return false;
}
}
}
private class ChoiceDragListener implements View.OnDragListener{
@Override
public boolean onDrag(View v, DragEvent event) {
//handle drag events
switch (event.getAction()) {
case DragEvent.ACTION_DRAG_STARTED:
//no action necessary
break;
case DragEvent.ACTION_DRAG_ENTERED:
//no action necessary
break;
case DragEvent.ACTION_DRAG_EXITED:
//no action necessary
break;
case DragEvent.ACTION_DROP:
//handle the dragged view being dropped over a drop view - asta de deasupra
//handle the dragged view being dropped over a target view -asta de jos
View view = (View) event.getLocalState();
//stop displaying the view where it was before it was dragged
view.setVisibility(View.INVISIBLE);
//view dragged item is being dropped on
ImageView dropTarget = (ImageView) v;
//view being dragged and dropped
ImageView dropped = (ImageView) view;
//update the image in the target view to reflect the data being dropped
dropTarget.setImageDrawable(dropped.getDrawable());
break;
case DragEvent.ACTION_DRAG_ENDED:
//no action necessary
break;
default:
break;
}
return true;
}
}
}
这是 .xml 的图片,以防我解释得不够好。
提前感谢您的任何建议! cow_image
你快完成了:)你只需要检查图像是否正确。从您的代码中,我看到缺少所有逻辑。有上百万种方法可以做到这一点,但我建议您使用视图的 TAG
属性 来存储有关每个图像的信息。
A Tag 是您可以存储在任何视图上的东西。它可以是一个 String
,一个数字,等等。为了清楚起见,我们使用 String
。 我们将设置相同的 TAG 以匹配图像/阴影:
- Image COW SHADOW 将具有标签 "COW",与 Image COW 相同
- 图片 PIG SHADOW 将具有标签 "PIG",与图片 PIG 相同。
- Image HORSE SHADOW 将具有标签 "HORSE",与 Image Horse 相同。
然后在你的情况下ACTION_DROP,你将检查阴影和拖放图像的标签是否相同,如下所示:
.
.
.
case DragEvent.ACTION_DROP:
.
.
.
// view dragged item is being dropped on
ImageView dropTarget = (ImageView) v;
// view being dragged and dropped
ImageView dropped = (ImageView) view;
String tagDropTarget = (String)dropTarget.getTag(),
tagDroppedImage = (String)dropped.getTag();
if ((tagDropTarget != null) && (tagDropTarget.equals (tagDroppedImage)) {
// yippie! correct!!
// update the image in the target view to reflect the data being dropped
dropTarget.setImageDrawable(dropped.getDrawable());
} else {
// oppps, wrong!!!!
.
.
}
break;
现在我们需要在 XML:
中设置标签<ImageView
android:tag="COW"
.
.
android:src="@drawable/games_cow"
android:id="@+id/games_cow_item" />
<ImageView
android:tag="COW"
.
.
android:src="@drawable/games_cow_shadow"
android:id="@+id/games_cow_shadow"/>
<ImageView
android:tag="PIG"
.
.
android:src="@drawable/games_pig_shadow"
android:id="@+id/games_pig_shadow"/>
<ImageView
android:tag="HORSE"
.
.
android:src="@drawable/games_horse_shadow"
android:id="@+id/games_horse_shadow"/>