在Android应用程序中如何对imageView进行分层？ [英] How do you layer imageViews in an android application?

问题描述

我正在尝试创建我的第一个真正的Android应用程序，代码看起来很简单，但布局给我的问题。

I'm trying to create my first real Android app, the code seems easy enough, but the layout is giving me problems.

我的应用程序将是一个拖动并放下应用程序，非常简单，只需将形状拖动到拼图中的正确位置。以下是现在的样子：

My app will be a drag and drop application, very simple, just drag shapes to the correct place in the "puzzle". Here's an example of how it looks right now:

我目前是4 ImageView ，一个是空难题顶部，然后1为每个形状如下。我认为，正确的方法是使拼图中的每个空白点都是一个 ImageView （箭头指向什么，例如，应该是一个 ImageView ）

What I have currently is 4 ImageViews, one for the "empty puzzle" at the top, then 1 for each of the shapes below. I think the correct way to do this is to have each of the empty spots in the puzzle be an ImageView (what the arrow is pointing to, for example, should be an ImageView)

如果我是正确的，我需要层 code> ImageView s，在顶部的拼图图像视图中放置3空的形状图像视图。问题是我找不到任何在线的例子或建议。所以我的问题是：

If I am correct on this, I need to "layer" ImageViews, put 3 "empty shape" image views over the "puzzle" image view at the top. The problem is I can't find any examples or suggestions for this anywhere online. So my questions are:

1. 有3个 ImageView 在背景的顶部 ImageView ，或者是否有更正确的方法？


2. 如果我正在正确的方向，有人可以解释/示范如何构建 ImageView 层？

1. Does it make sense to have 3 ImageViews sitting on top of a "background" ImageView, or is there a more correct way to do this?
2. If I'm heading in the right direction, could someone explain/examplify how one builds ImageView layers?

---

我当前屏幕的XML：

---

XML for my current screen:

<LinearLayout 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:orientation="vertical" >
    <ImageView
        android:id="@+id/emptyPuz"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/EmptyPuzzle" />
    <LinearLayout 
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:orientation="horizantal" >
       <ImageView
           android:id="@+id/imageView1"
           android:layout_width="0dp"
           android:layout_weight="1"
           android:layout_height="wrap_content"
           android:adjustViewBounds="false"
           android:src="@drawable/Circle" />
        <ImageView
           android:id="@+id/imageView2"
           android:layout_width="0dp"
           android:layout_weight="1"
           android:layout_height="wrap_content"
           android:adjustViewBounds="false"
           android:src="@drawable/Square" />
        <ImageView
           android:id="@+id/imageView3"
           android:layout_width="0dp"
           android:layout_weight="1"
           android:layout_height="wrap_content"
           android:adjustViewBounds="false"
           android:src="@drawable/Triangle" />
   </LinearLayout>
</LinearLayout>

推荐答案

最终使用的解决方案是添加一个新的 LinearLayout ，将背景设置为拼图库图像，并添加了三个新图像与它的空难题。即：我将3空拼图插槽中的每一个分解成如下例所示的单个图像：

The solution I ended up using was to add a new LinearLayout with the background set to a "puzzle base" image and added three new images with "empty puzzle" pieces on it. Ie: I broke up each of the 3 "empty" puzzle slots into individual images like in this example:

然后将它们用作新布局的背景，所以我之前有这段代码：

Then used them as backgrounds to a new layout, so where I had this code before:

<ImageView
    android:id="@+id/emptyPuz"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/EmptyPuzzle" />

我现在有：

<LinearLayout
   android:layout_width="fill_parent"
   android:layout_height="0dp"
   android:layout_weight="1"
   android:background="@drawable/emptypuzzle"
   android:orientation="horizontal" >
   <ImageView
       android:id="@+id/dropsquare"
       android:layout_width="0dp"
       android:layout_weight="1"
       android:tag="square"
       android:layout_height="wrap_content"
       android:adjustViewBounds="false"
       android:src="@drawable/emptysquare" />
   <ImageView
       android:id="@+id/droptriangle"
       android:layout_width="0dp"
       android:layout_weight="1"
       android:tag="triangle"
       android:layout_height="wrap_content"
       android:adjustViewBounds="false"
       android:src="@drawable/emptytriangle" />
   <ImageView
       android:id="@+id/dropcircle"
       android:layout_width="0dp"
       android:layout_weight="1"
       android:tag="circle"           
       android:layout_height="wrap_content"
       android:adjustViewBounds="false"
       android:src="@drawable/emptycircle" />
</LinearLayout>

结束一个结果的拖放游戏看起来像：

Ending with a resultant drag and drop game looking like:

这不漂亮，但我的孩子喜欢它。 ：）

It's not pretty, but my toddler likes it. :)

这篇关于在Android应用程序中如何对imageView进行分层？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！