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

Question

我将设计我的应用程序的仪表板，其中有几个菜单/按钮。菜单使用一些图像表示。菜单分为 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>

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

使用当前代码，屏幕看起来像这样:

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

谢谢，阿林达姆。

Answer 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>