尝试在复合布局中对齐RadioGroup中的单选按钮

Question

我有这个布局片段.为什么两个无线电组不对齐？我已尝试过使用和不使用边距和填充RadioGroup.

我假设marginLeft从单选按钮本身的左边缘开始marginRight测量,并从最长的单选按钮标题的右侧开始测量.在这方面,文件并不清楚.

请注意,我删除了与布局无关的任何行(例如文本).所有文字大小都是15sp.

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

        <ImageView
                android:id="@+id/lengthImage"
                android:layout_centerVertical="true"
                android:paddingLeft="10dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

        <TextView
                android:text="@string/length"
                android:layout_centerVertical="true"
                android:layout_toRightOf="@id/lengthImage"
                android:paddingLeft="15dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

        <RadioGroup
                android:orientation="vertical"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:layout_marginLeft="200dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">

            <RadioButton
                    android:id="@+id/lengthMetres"
                    android:paddingRight="20dp"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>

            <RadioButton
                    android:id="@+id/lengthFeet"
                    android:paddingRight="20dp"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>
        </RadioGroup>

    </RelativeLayout>

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

        <ImageView android:id="@+id/distanceImage"
                android:layout_centerVertical="true"
                android:paddingLeft="10dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

        <TextView
                android:text="@string/distance"
                android:layout_centerVertical="true"
                android:layout_toRightOf="@id/distanceImage"
                android:paddingLeft="15dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

        <RadioGroup
                android:orientation="vertical"
                android:layout_marginLeft="200dp"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">

            <RadioButton
                    android:id="@+id/distanceMile"
                    android:paddingRight="20dp"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>

            <RadioButton
                    android:id="@+id/distanceKM"
                    android:paddingRight="20dp"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>

            <RadioButton
                    android:id="@+id/distanceNM"
                    android:paddingRight="20dp"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"/>

        </RadioGroup>

    </RelativeLayout>

[编辑]

解.

将RadioGroup宽度硬编码为100dp非常有效.我讨厌这样做.我打赌那里有分辨率,密度和方向的组合会打破这个!

Answer 1

您无需硬编码即可完全构建布局100dp.

通过使一些小技巧用android:layout_alignLeft,android:layout_alignBottom并且android:layout_alignTop可以与解决您的问题RadioGroups.

但是,您将不得不稍微更改XML,因为只有两者RadioGroups都在相同时它才会起作用RelativeLayout.

这是您的代码,包含所有调整:

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

    <RadioGroup
        android:id="@+id/radio_group_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_marginLeft="200dp"
        android:orientation="vertical" >

        <RadioButton
            android:id="@+id/lengthMetres"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingRight="20dp"
            android:text="metres" />

        <RadioButton
            android:id="@+id/lengthFeet"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingRight="20dp"
            android:text="feet" />
    </RadioGroup>

    <ImageView
        android:id="@+id/lengthImage"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_alignBottom="@id/radio_group_1"
        android:layout_alignTop="@id/radio_group_1"
        android:layout_centerVertical="true"
        android:paddingLeft="10dp"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@id/radio_group_1"
        android:layout_alignTop="@id/radio_group_1"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@id/lengthImage"
        android:gravity="center"
        android:paddingLeft="15dp"
        android:text="@string/length" />

    <RadioGroup
        android:id="@+id/radio_group_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@id/radio_group_1"
        android:layout_below="@id/radio_group_1"
        android:orientation="vertical" >

        <RadioButton
            android:id="@+id/distanceMile"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingRight="20dp"
            android:text="mile" />

        <RadioButton
            android:id="@+id/distanceKM"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingRight="20dp"
            android:text="km" />

        <RadioButton
            android:id="@+id/distanceNM"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingRight="20dp"
            android:text="NM" />
    </RadioGroup>

    <ImageView
        android:id="@+id/lengthImage"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_alignBottom="@id/radio_group_2"
        android:layout_alignTop="@id/radio_group_2"
        android:layout_centerVertical="true"
        android:paddingLeft="10dp"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@id/radio_group_2"
        android:layout_alignTop="@id/radio_group_2"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@id/lengthImage"
        android:gravity="center"
        android:paddingLeft="15dp"
        android:text="@string/length" />
</RelativeLayout>

这就是它的样子:

我认为,在您的特定情况下,此解决方案是适用的,但对于某种通用解决方案,当您有两个以上的RadioGroup时,此解决方案将不得不进行改进.

希望这种方法对你有用:)