Android ImageView 从屏幕边缘留下间隙答案

【问题标题】：Android ImageView leaves gaps from edge of screenAndroid ImageView 从屏幕边缘留下间隙
【发布时间】：2016-02-21 06:13:07
【问题描述】：

我正在尝试制作一款由 4 名玩家玩的纸牌游戏，标准的 52 张纸牌均等分。我想在屏幕的每一侧显示 13 张牌，在中间显示 4 张牌（这些牌会在每个玩家轮到时显示）。我已将 13 张卡片添加到 4 个 LinearLayouts 中，并将它们显示在侧面。右边的两个已经旋转（见代码）。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/table_back1" >

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

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

        <ImageView
            android:id="@+id/imageView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView5"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView6"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView8"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView9"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView10"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView11"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView12"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/imageView13"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1_full" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_alignParentTop="true"
        android:orientation="horizontal"
        android:rotation="180" >

        <ImageView
            android:id="@+id/ImageView14"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView15"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView16"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView17"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView18"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView19"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView20"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView21"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView22"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView23"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView24"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView25"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView26"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1_full" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/LinearLayout3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:orientation="horizontal"
        android:layout_margin="10dp"
        android:rotation="270" >

        <ImageView
            android:id="@+id/ImageView27"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView28"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView29"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView30"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView31"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView32"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView33"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView34"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView35"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView36"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView37"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView38"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView39"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1_full" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/LinearLayout4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:orientation="horizontal"
        android:layout_margin="10dp"
        android:rotation="90" >

        <ImageView
            android:id="@+id/ImageView40"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView41"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView42"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView43"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView44"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView45"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView46"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView47"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView48"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView49"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView50"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView51"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1" />

        <ImageView
            android:id="@+id/ImageView52"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:src="@drawable/back1_full" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/LinearLayout5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/center1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="false"
             />

        <ImageView
            android:id="@+id/center2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="false"
             />

        <ImageView
            android:id="@+id/center3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="false"
             />

        <ImageView
            android:id="@+id/center4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:clickable="false"
             />

    </LinearLayout>

</RelativeLayout>

我有什么：

我想要什么：

因为我设置了android:layout_alignParentRight="true" 和android:layout_alignParentLeft="true"，所以要附加到屏幕边缘的垂直卡片应该是这样的

问题：

卡片位于屏幕中间而不是附加在屏幕中间两侧
我尝试在 LinearLayout 中显示 13 张卡片，但卡片消失了两边都在屏幕外，所以我不得不裁剪卡片并显示完整的卡片仅在边缘。
每次触摸垂直卡片时，它们都会开始向屏幕边缘移动。

问题：

有没有一种方法可以让我将卡片堆叠（重叠），这样它们仍然以相同的方式显示而无需裁剪图片？
卡片没有贴在屏幕边缘的原因是什么？
有没有更好的方法来解决这个问题？

我必须只用 XML 来做这件事。另外我是android新手，所以请用我能理解的方式解释你的解决方案。

提前致谢。

【问题讨论】：

标签： android xml android-layout

【解决方案1】：

我尝试了你的布局，只是用我的一张图片替换了你的图片，这是我的结果：

所以我不明白你的结果。但如果我想用你现在拥有的东西做你想做的事，我会这样做：

1) 左上右上：

<LinearLayout
    android:id="@+id/LinearLayout4"
    android:layout_width="match_parent"
    android:layout_height="50dp"></LinearLayout>

2) 右上左下：

<LinearLayout
    android:id="@+id/LinearLayout4"
    android:layout_width="50dp"
    android:orientation="vertical"
    android:layout_height="match_parent"
    android:layout_alignParentRight="true"></LinearLayout>

3) 左下右下

<LinearLayout
    android:id="@+id/LinearLayout4"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:layout_alignParentBottom="true"></LinearLayout>

4) 左上左下

<LinearLayout
    android:id="@+id/LinearLayout4"
    android:layout_width="50dp"
    android:layout_height="match_parent"
    android:orientation="vertical"></LinearLayout>

这是使用 LinearLayout 执行此操作的正确方法，但是如果您这样做，您会意识到它超出了边界。所以你将不得不使用重量。例如，如果您有 13 张卡片/LinearLayout，则必须在 LinearLayout 中添加 android:android:weightSum="13" 并在每张卡片中说明它们必须承受的重量，所以这里 1. (android:layout_weight=您的每张卡中都有“1”）。所以它会将你的屏幕分成 13 个区块，其中一个区块会被一张卡片填满。但是 LinearLayout 将他的孩子并排放置（这就是为什么我不明白你的结果，我们可以看到一张卡片）。

因此，如果您想将一个放在另一个上，最好的方法是使用 RelativeLayout。

如果您想了解更多信息，请告诉我。

【讨论】：