代码之家 › 专栏 › 技术社区 › Huzo

在RelativeLayout中,当按钮右侧有一个ImageView时,如何使按钮的宽度与父级匹配?

android-relativelayout android-layout android

Huzo · 技术社区 · 7 年前

使用XML代码:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp">

    <TextView
        style="?android:listSeparatorTextViewStyle"
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:text="@string/crime_title_label" />

    <EditText
        android:id="@+id/crime_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/title"
        android:hint="@string/crime_title_hint" />

    <TextView
        style="?android:listSeparatorTextViewStyle"
        android:id="@+id/crime_details"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/crime_title"
        android:text="@string/crime_details_label" />

    <Button
        android:id="@+id/crime_date"
        android:layout_below="@+id/crime_details"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <CheckBox
        android:id="@+id/crime_solved"
        android:layout_below="@+id/crime_date"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/crime_solved_label" />

    <Button
        android:id="@+id/suspect_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/crime_solved"
        android:text="@string/choose_suspect" />

    <Button
        android:id="@+id/send_crime_report"
        android:text="@string/send_crime_report"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/suspect_button" />

    <ImageView
        android:id="@+id/callImage"
        android:layout_width="57dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/crime_solved"
        android:layout_alignBottom="@+id/suspect_button"
        android:layout_toRightOf="@id/suspect_button"
        app:srcCompat="@android:drawable/sym_action_call" />

</RelativeLayout>

我要做的是,拥有ImageView callImage 在…的右边 suspect_button 在最右边。为了这个,我想要 可疑按钮 match_parent . 但当我这么做的时候 匹配父项 图像视图丢失。简单地说,我想 匹配父项 “那个 可疑按钮 但也有我的观点 书画 而不是迷失在外表。

如果您不建议需要我使用其他布局的解决方案,我将不胜感激。我想知道如果可能的话,或者如何在相对布局中做我想做的事情。

谢谢。

4 回复 | 直到 7 年前

Tung Duong 7 年前

你只需要添加 callImage android:layout_alignParentRight="true" suspect_button android:layout_width="match_parent" 和 android:layout_toLeftOf="@+id/callImage"

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp">

    <TextView
        style="?android:listSeparatorTextViewStyle"
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:text="@string/crime_title_label" />

    <EditText
        android:id="@+id/crime_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/title"
        android:hint="@string/crime_title_hint" />

    <TextView
        style="?android:listSeparatorTextViewStyle"
        android:id="@+id/crime_details"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/crime_title"
        android:text="@string/crime_details_label" />

    <Button
        android:id="@+id/crime_date"
        android:layout_below="@+id/crime_details"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <CheckBox
        android:id="@+id/crime_solved"
        android:layout_below="@+id/crime_date"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/crime_solved_label" />

    <Button
        android:id="@+id/suspect_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/crime_solved"
        android:layout_toLeftOf="@+id/callImage"
        android:text="@string/choose_suspect" />

    <Button
        android:id="@+id/send_crime_report"
        android:text="@string/send_crime_report"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/suspect_button" />

    <ImageView
        android:id="@+id/callImage"
        android:layout_width="57dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/crime_solved"
        android:layout_alignBottom="@+id/suspect_button"
        android:layout_alignParentRight="true"
        app:srcCompat="@android:drawable/sym_action_call" />

</RelativeLayout>

在评论中回答问题。我需要添加线性布局,使图像视图对齐屏幕的右半部分

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp">

    <TextView
        style="?android:listSeparatorTextViewStyle"
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:text="@string/crime_title_label" />

    <EditText
        android:id="@+id/crime_title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/title"
        android:hint="@string/crime_title_hint" />

    <TextView
        style="?android:listSeparatorTextViewStyle"
        android:id="@+id/crime_details"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/crime_title"
        android:text="@string/crime_details_label" />

    <Button
        android:id="@+id/crime_date"
        android:layout_below="@+id/crime_details"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <CheckBox
        android:id="@+id/crime_solved"
        android:layout_below="@+id/crime_date"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/crime_solved_label" />

    <LinearLayout
        android:id="@+id/suspect_button_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/crime_solved"
        android:weightSum="2"
        android:orientation="horizontal">
        <Button
            android:id="@+id/suspect_button"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/choose_suspect" />



        <LinearLayout
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical">
            <ImageView
                android:id="@+id/callImage"
                android:layout_width="57dp"
                android:layout_height="wrap_content"
                app:srcCompat="@android:drawable/sym_action_call" />
        </LinearLayout>

    </LinearLayout>

    <Button
        android:id="@+id/send_crime_report"
        android:text="@string/send_crime_report"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/suspect_button_layout" />

</RelativeLayout>

它会像这样出现

Mr. Jay Patel 7 年前

嘿,伙计,你得试试线性布局android:layout_weight=两个元素都是“5”!将两个元素平均分配!

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

    <Button
        android:id="@+id/send_crime_report"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="5"
        android:text="sdfsdfsd" />

    <ImageView
        android:id="@+id/callImage"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="5"
        app:srcCompat="@android:drawable/sym_action_call" />


</LinearLayout>

Huzo 7 年前

实现这一点的方式与董多勇的回答略有不同:

1.对齐 callImage android:layout_alignParentRight="true"
2.制造 suspect_button layout_width match_parent 并添加 layout_marginRight 到正好与 书画

Bilal Naeem 7 年前

您可以在您的 可疑按钮 书画