Android 将多个嵌套LineairLayout转换为单个RelativeLayout

首先，一般来说我的UI很差，这就是为什么我需要一些帮助。现在我有以下几点：

用一幅油画解释：

我目前拥有的实际屏幕截图：

与代码，可以在这篇文章的底部找到。这是通过一些嵌套的线性布局和权重完成的

我现在想要的是：

ImageButton（宽度和高度已知/图像以xml格式设置）

TextView（高度已知，宽度应在1和3之间填充）

文本视图（高度已知，宽度（文本）未知）

EditText（高度已知，宽度（文本）未知）

AutoCompleteTextView（高度已知，宽度应介于4和9之间）

TextView（宽度和高度已知/文本在xml中设置）

微调器（已知高度，宽度应介于6和8之间）

ImageButton（宽度和高度已知/图像以xml格式设置）这是我现在要添加的按钮。

空间（宽度和高度都在代码中确定，以填充空白）

我知道我可能能够想出如何添加另一个嵌套LineairLayout和嵌套权重的ImageButton，但由于我的应用程序的性能已经不是很好，而且我目前正在尝试解决许多性能问题，我认为最好将此list_item.xml转换为单个RelativeLayout

那么，我该怎么做呢？我只是在UI布局方面做得很差劲，所以我会感谢所有能得到的帮助。如何使用第二幅绘制图像的结果创建一个相对图？

当前代码：

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE xml>
<!-- The DOCTYPE above is added to get rid of the following warning:
     "No grammar constraints (DTD or XML schema) detected for the document." -->

<!-- The View for a single CheckListItem -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/item_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <!-- The TextViews -->
    <LinearLayout
        android:id="@+id/ll1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/image"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/default_margin"
            android:adjustViewBounds="true"
            android:background="@layout/transparent_background"
            android:contentDescription="@string/checkbox_content_description"
            android:src="@drawable/checkbox_unchecked" />

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginRight="@dimen/default_margin"
            android:layout_marginTop="@dimen/default_margin"
            android:layout_weight="1"
            android:gravity="center_vertical" >

            <TextView
                android:id="@+id/tv_product_name"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:ellipsize="end"
                android:singleLine="true" />

        </LinearLayout>

        <TextView
            android:id="@+id/tv_price"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="@dimen/default_margin"
            android:layout_marginTop="@dimen/default_margin" />

    </LinearLayout>

    <!-- The EditTexts -->
    <LinearLayout
        android:id="@+id/ll2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/ll1"
        android:gravity="center"
        android:orientation="horizontal"
        android:visibility="visible" >

        <Space
            android:id="@+id/filler_space_image"
            android:layout_width="1dp"
            android:layout_height="1dp"
            android:layout_marginBottom="@dimen/default_margin"
            android:layout_marginLeft="@dimen/default_margin"
            android:layout_marginRight="@dimen/default_margin" />

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="@dimen/default_margin"
            android:layout_marginRight="@dimen/default_margin"
            android:orientation="vertical"
            android:padding="0dp">

            <EditText
                android:id="@+id/et_result_amount"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:inputType="number" />

            <TextView
                android:id="@+id/tv_tags"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/tags"
                android:gravity="center" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginBottom="@dimen/default_margin"
            android:layout_marginRight="@dimen/default_margin"
            android:layout_weight="1"
            android:gravity="center_vertical"
            android:padding="0dp"
            android:orientation="vertical">

            <AutoCompleteTextView
                android:id="@+id/actv_result_name"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:ellipsize="end"
                android:inputType="text"
                android:singleLine="true" />

            <Spinner
                android:id="@+id/sp_tags"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

            <!--<ImageButton
                android:id="@+id/btn_tags"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:src="@android:drawable/ic_menu_manage"
                android:contentDescription="@string/button_tags_content_description"
                android:background="@layout/transparent_background" />-->

        </LinearLayout>

        <Space
            android:id="@+id/filler_space_price"
            android:layout_width="1dp"
            android:layout_height="1dp"
            android:layout_marginBottom="@dimen/default_margin"
            android:layout_marginRight="@dimen/default_margin" />

    </LinearLayout>

</RelativeLayout>

---

在创建时多次调用getView而不是只调用一次，我也遇到了一些问题，但这是有问题的。

一旦创建了相对关系，请避免使用不同的线性布局，因为我认为您不需要它们，而是插入视图（textView）直接在这个相对位置内指定它们的绝对位置

这是一个简单的例子：

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

<TextView 
    android:id="@+id/textView1"
    android:layout_width="342dp"
    android:layout_height="39dp"
    android:layout_marginLeft="261dp"
    android:layout_marginTop="21dp"
    android:textSize="23sp"/>  

<TextView 
    android:id="@+id/textView2"
    android:layout_width="90dp"
    android:layout_height="90dp"
    android:layout_marginLeft="21dp"
    android:layout_marginTop="21dp"
    android:background="#0000"/>

 <TextView 
    android:id="@+id/textView3"
    android:layout_width="226dp"
    android:layout_height="39dp"
    android:layout_marginLeft="388dp"
    android:layout_marginTop="72dp"
    android:textSize="23sp"/> 

 <TextView
    android:id="@+id/textView5"
    android:layout_width="243dp"
    android:layout_height="37dp"
    android:layout_marginLeft="56dp"
    android:layout_marginTop="150dp"
    android:textSize="22sp"
    android:paddingLeft="8dp"
    android:gravity="center_vertical"
    android:background="#0000"/>

 <TextView
    android:id="@+id/textView7"
    android:layout_width="243dp"
    android:layout_height="37dp"
    android:layout_marginLeft="423dp"
    android:layout_marginTop="150dp"
    android:textSize="22sp"/>

---

当然，位置不是相对于布局的，您必须调整它们；）

我想这就是你所期待的。尝试布局，并根据您的需要进行调整：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <!-- Left side -->

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

        <ImageView
            android:id="@+id/image1"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="@android:color/white" />

        <View
            android:id="@+id/space9left"
            android:layout_width="50dp"
            android:layout_height="wrap_content"
            android:layout_below="@+id/image1" />
    </LinearLayout>

    <TextView
        android:id="@+id/textview2"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_toLeftOf="@+id/rightContainer"
        android:layout_toRightOf="@+id/leftContainer"
        android:text="Textview2" />

    <EditText
        android:id="@+id/edittext4"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_below="@+id/textview2"
        android:layout_toRightOf="@+id/leftContainer"
        android:text="Edittext4" />

    <TextView
        android:id="@+id/autocompleteTextview5"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_toLeftOf="@+id/rightContainer"
        android:layout_toRightOf="@+id/edittext4"
        android:layout_below="@+id/textview2"
        android:text="autocompleteTextview5" />

    <TextView
        android:id="@+id/textview6"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_below="@+id/edittext4"
        android:layout_toRightOf="@+id/leftContainer"
        android:text="Textview6" />

    <TextView
        android:id="@+id/spinner7"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_below="@+id/autocompleteTextview5"
        android:layout_toRightOf="@+id/textview6"
        android:layout_toLeftOf="@+id/rightContainer"
        android:text="Spinner7" />

    <!-- Right side -->
    <LinearLayout
        android:id="@+id/rightContainer"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/textview3"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:text="Textview3" />

        <View
            android:id="@+id/space9right"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:layout_below="@+id/image1" />

        <ImageView
            android:id="@+id/image8"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="@android:color/white" />
    </LinearLayout>

</RelativeLayout>

---

希望能有所帮助。

很抱歉响应太晚，我昨天无法整理所有内容来测试您的代码，但现在我已将其合并。结果可以在我的主要帖子的编辑1中找到。除了

android:layout\u leftOf=“@id/leftOf=“@id/leftOf=”

之外，大多数都可以按照我的意愿工作。我的意思是，如果你将一个视图（假设它的宽度为100dp）与marginLeft 50dp放在一起，你必须在下一个视图上设置marginLeft=150dp（50dp+100dp）在第一个元素旁边画，这意味着我必须在代码中画，因为元素之间也有边距。因此，在代码（例如getView方法）中，我应该将这些项的marginLeft添加到

image.getMeasureWidth（）+（px中的2*myMargin）

？您不必在代码中完成，只需计算它，就可以在XML中完成；）如果我的图像大小在不同的屏幕大小上保持不变，是的，但它们是包装内容。我有，像它的建议与图像，把不同大小的图像在多个可绘制的文件夹根据屏幕大小。无论如何，非常感谢。在一些自定义更改之后，很多都按照我现在想要的方式工作。我唯一的问题是TextView2的大小不正确。它应该在1到3之间填充，但它的大小与1大致相同。我已经尝试了宽度

匹配父项

和

包装内容

，但宽度没有改变。这是我代码中的

tv\u product\u name

。很抱歉反应太晚，我昨天无法整理所有内容来测试您的代码，但现在我已将其合并。结果可以在我的主要帖子的编辑1中找到。除了android:layout_leftOf=“@id/left_ll”，大多数都可以按我的要求工作。多亏了axl_编码器的帮助，我解决了这个问题，现在唯一剩下的就是textView2的大小正确了。它应该在Image1和TextView3之间填充，但看起来它与图像的宽度相同。我尝试了

match_parent

和

wrap_content

作为宽度，结果相同。在我的代码文本中，View2被命名为

tv\u product\u name

。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <!-- Left side -->

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

        <ImageView
            android:id="@+id/image1"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="@android:color/white" />

        <View
            android:id="@+id/space9left"
            android:layout_width="50dp"
            android:layout_height="wrap_content"
            android:layout_below="@+id/image1" />
    </LinearLayout>

    <TextView
        android:id="@+id/textview2"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_toLeftOf="@+id/rightContainer"
        android:layout_toRightOf="@+id/leftContainer"
        android:text="Textview2" />

    <EditText
        android:id="@+id/edittext4"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_below="@+id/textview2"
        android:layout_toRightOf="@+id/leftContainer"
        android:text="Edittext4" />

    <TextView
        android:id="@+id/autocompleteTextview5"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_toLeftOf="@+id/rightContainer"
        android:layout_toRightOf="@+id/edittext4"
        android:layout_below="@+id/textview2"
        android:text="autocompleteTextview5" />

    <TextView
        android:id="@+id/textview6"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_below="@+id/edittext4"
        android:layout_toRightOf="@+id/leftContainer"
        android:text="Textview6" />

    <TextView
        android:id="@+id/spinner7"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:layout_below="@+id/autocompleteTextview5"
        android:layout_toRightOf="@+id/textview6"
        android:layout_toLeftOf="@+id/rightContainer"
        android:text="Spinner7" />

    <!-- Right side -->
    <LinearLayout
        android:id="@+id/rightContainer"
        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/textview3"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:text="Textview3" />

        <View
            android:id="@+id/space9right"
            android:layout_width="wrap_content"
            android:layout_height="50dp"
            android:layout_below="@+id/image1" />

        <ImageView
            android:id="@+id/image8"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="@android:color/white" />
    </LinearLayout>

</RelativeLayout>