android - 使用填充时，ImageViews 未垂直对齐

Question

我试图让两个 ImageView 并排放置，并在图像周围留出空隙。我一直在使用 Padding、Margin 等并且都具有相同的效果（见下图）

如您所见，右侧的图像向上移动，我该如何阻止它？

这是我使用的布局文件：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <!-- Top Row -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/tab_headlines"
            android:src="@drawable/headlines"
            android:layout_margin="5sp"
            />
        <ImageView 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/tab_headlines"
            android:src="@drawable/headlines"
            />

    </LinearLayout>

我将使用更多的图像行，因此额外的 LinearLayout

Answer 1

用于layout_weight平均划分布局。试试下面的代码：

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <!-- Top Row -->

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <ImageView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="6dp"
            android:layout_marginRight="3dp"
            android:layout_weight="1"
            android:contentDescription="@string/tab_headlines"
            android:src="@drawable/headlines" />

        <ImageView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="3dp"
            android:layout_marginRight="6dp"
            android:layout_weight="1"
            android:contentDescription="@string/tab_headlines"
            android:src="@drawable/headlines" />
    </LinearLayout>
</LinearLayout>

此外，切勿sp用于指定布局尺寸。改为使用dp。

Answer 2

要修复垂直对齐：

android:layout_height="match_parent"在你的使用ImageView

通过android:layout_height="match_parent"在内部使用ImageView，它将与其父级LinearLayout匹配android:layout_height="wrap_content"

现在问题出现了，为什么两者的高度相同ImageViews？

你的父母LinearLayout's Height会automatically chosen from ImageView Whose height is greater因为android:layout_height="wrap_content"你的原因LinearLayout！

并且通过使用android:layout_height="match_parent"，您将使用same height for ImageView高度较小的！

---

修复水平对齐：

利用android:layout_weight="equal weight value for btoh"

将您的代码更改为

   <ImageView 
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:contentDescription="@string/tab_headlines"
        android:src="@drawable/headlines"
        android:layout_margin="5sp"
        />
    <ImageView 
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:contentDescription="@string/tab_headlines"
        android:src="@drawable/headlines"
        />

Answer 3

您已经为左侧图像提供了 layout_margin 而没有为右侧图像提供。这就是问题所在。如果您只需要连续两个图像，并且两者的图像大小相同，那么您可以使用 layout_weight 属性并为它们之间的空间提供填充。所以，试试这个。它会起作用的。

    <!-- Top Row -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <ImageView 
            android:layout_width="0dp"
            android:layout_height="wrap_content"
             android:layout_weight="0.5"
            android:contentDescription="@string/tab_headlines"
            android:src="@drawable/headlines"
            android:padding="3dp"
            />
        <ImageView 
            android:layout_width="0dp"
            android:layout_height="wrap_content"
           android:layout_weight="0.5"
            android:contentDescription="@string/tab_headlines"
            android:src="@drawable/headlines"
           android:padding="3dp"
            />

    </LinearLayout>