在 Android 中使用 layout_weight 时图像对齐无法正常工作答案

【问题标题】：Image alignment is not working properly when using layout_weight in Android在 Android 中使用 layout_weight 时图像对齐无法正常工作
【发布时间】：2015-08-31 08:39:33
【问题描述】：

我将设计我的应用程序的仪表板，其中存在几个菜单/按钮。菜单使用一些图像表示。菜单被放置在 4 列中。首先列包含两个菜单，第四列包含三个。屏幕设计如下图：

现在为了开发这个，我尝试了 Linearlayout 和 layout_weight。但是我无法放置它们，并且图像被拉伸了。我使用了以下代码：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/mumbaibg"
android:orientation="vertical"
android:weightSum="3" >

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:orientation="horizontal" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:background="@drawable/newcar" />

        <View
            android:layout_width="1dp"
            android:layout_height="fill_parent"
            android:background="@android:color/white" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:background="@drawable/usedcar" />
    </LinearLayout>
</LinearLayout>

<View
    android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:background="@android:color/white" />

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:orientation="horizontal" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:background="@drawable/carloan" />

         <View
            android:layout_width="1dp"
            android:layout_height="fill_parent"
            android:background="@android:color/white" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:background="@drawable/service" />
    </LinearLayout>
</LinearLayout>

<View
    android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:background="@android:color/white" />

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:orientation="horizontal" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:background="@drawable/sos" />

         <View
            android:layout_width="1dp"
            android:layout_height="fill_parent"
            android:background="@android:color/white" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:background="@drawable/learndrive" />
    </LinearLayout>
</LinearLayout>

<View
    android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:background="@android:color/white" />

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1" >

     <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="3"
        android:orientation="horizontal" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:background="@drawable/insurance" />

         <View
            android:layout_width="1dp"
            android:layout_height="fill_parent"
            android:background="@android:color/white" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:background="@drawable/rtofinelist" />

        <View
            android:layout_width="1dp"
            android:layout_height="fill_parent"
            android:background="@android:color/white" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:layout_gravity="center"
            android:background="@drawable/newsoffer" />
    </LinearLayout>
</LinearLayout>

图像被放置在每一列上，但它们被拉伸了。我尝试过使用 .9patch 图像并将图像放置在不同的可绘制文件夹中。

使用当前代码，屏幕如下所示：

谁能给我一个更好更简单的解决方案来实现这一目标。

谢谢，阿林丹。

【问题讨论】：

标签： android android-layout layout imageview

【解决方案1】：

为了让您的缩放按预期工作，您需要为水平布局设置android:layout_width="0dp"，为垂直布局设置android:layout_height="0dp"。

编辑，这里是实现设计的代码示例：

<?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">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.25"
    android:orientation="horizontal">

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_favorite" />

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_favorite" />
</LinearLayout>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.25"
    android:orientation="horizontal">

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_favorite" />

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_favorite" />
</LinearLayout>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.25"
    android:orientation="horizontal">

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_favorite" />

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_favorite" />
</LinearLayout>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.25"
    android:orientation="horizontal">

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.33"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_favorite" />

    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.33"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_favorite" />
    <ImageView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.33"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_favorite" />
</LinearLayout>

【讨论】：

不确定你尝试了什么，我用我测试的示例代码编辑了我的回复。

【解决方案2】：

删除布局中的这两个属性： android:scaleType="fitCenter" 机器人：adjustViewBounds =“真” 他们负责拉伸。

然后，您有望获得右对齐的图像。将 layout_gravity 设置为 center，这应该将图像对齐到其相应网格的中间。

【讨论】：

我已经应用了这个。但没有运气。
发生了什么？还在拉伸吗？

【解决方案3】：

具有直接子视图的父 LinearLayout 需要指定 android:weightSum="3" 属性。子视图已经有相应的android:layout_weight="1" - 这很好。但是 parent 属性不存在，因此系统不知道如何为子视图正确分配空间。

【讨论】：

我没有正确理解您的观点。所以你是说，我需要将 android:weightSum="4" 更改为 android:weightSum="3"？