在 RelativeLayout 中正确调整两个文本视图之间的空间答案

【问题标题】：Properly adjusting space between two textviews in RelativeLayout在 RelativeLayout 中正确调整两个文本视图之间的空间
【发布时间】：2014-09-17 02:54:54
【问题描述】：

我整天都在编辑我的 relativelayout，但我无法制作出令人满意的屏幕。

目前看起来是这样的：

它没有居中，小时时间和分钟时间之间有一个非常尴尬的空间。

我正试图弄清楚如何修复它，使其居中类似于这个应用程序，除了我包括小 h 和 m。

我做了很多研究，几乎使用了Relative Layout中的所有定位视图，但仍然无法生成。

Properly aligning TextViews in RelativeLayout

这是我的 xml 文件。不知道该怎么做我觉得我已经用尽了所有的选择。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:seekarc="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <FrameLayout
        android:id="@+id/seekArcContainer"
        android:layout_width="350dp"
        android:layout_height="wrap_content"
        >

    </FrameLayout>

    <include
        layout="@layout/controls"
        android:id="@+id/controls" />

    <com.triggertrap.seekarc.SeekArc
        android:id="@+id/seekArc"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_gravity="center_horizontal|bottom"
        seekarc:thumb="@drawable/custom_seek_arc_control_selector"
        android:padding="30dp"
        seekarc:rotation="0"
        seekarc:startAngle="0"
        seekarc:sweepAngle="360"
        seekarc:touchInside="true"
        seekarc:arcColor="#30ff5b56"
        seekarc:progressColor="#ffff3a35"
        android:layout_below="@+id/seekArcContainer"
        android:layout_centerHorizontal="true" />

    <TextView
        android:id="@+id/hour_progress_number"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textColor="@color/red_highlight"
        android:text="00"



        android:textSize="90sp"
        android:layout_toStartOf="@+id/little_hour_text2"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />


    <TextView
        android:id="@+id/minute_progress_number"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textColor="@color/red_highlight"


        android:text="00"
        android:textSize="90sp"
        android:layout_toStartOf="@+id/little_minute_text2"
        android:layout_alignTop="@+id/hour_progress_number"
        android:layout_toLeftOf="@+id/little_minute_text2" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="H"
        android:textSize="24sp"



        android:id="@+id/little_hour_text2"

        android:textColor="@color/red_highlight"

        android:layout_toStartOf="@+id/minute_progress_number"
        android:layout_marginRight="45dp"
        android:layout_alignBottom="@+id/hour_progress_number"
        android:layout_toLeftOf="@+id/minute_progress_number" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="M"
        android:textSize="24sp"
        android:id="@+id/little_minute_text2"
        android:textColor="@color/red_highlight"

        android:layout_marginRight="36dp"
        android:layout_alignRight="@+id/seekArc"
        android:layout_alignEnd="@+id/seekArc"
        android:layout_alignBottom="@+id/minute_progress_number" />


</RelativeLayout>

【问题讨论】：

小时和分钟文本字段可以只有 1 个文本字段吗？哈：嗯。这样你只需要担心居中 1 个文本字段
很遗憾没有:(
在中心放置一个虚拟视图，然后在该虚拟视图中放置小时 toLeftOf 和分钟 toRightOf。
是的。您可以按照 Ketan 的建议在中间设置一个网格视图
我将如何实现它？

标签： android xml android-layout android-relativelayout textview

【解决方案1】：

试试这个代码，这个 xml 可以帮助你..你可以从中得到想法。有问题再问...

<?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:gravity="center_horizontal"
    android:orientation="vertical" >

    <RelativeLayout
        android:layout_width="300dp"
        android:layout_height="300dp" >

        <com.triggertrap.seekarc.SeekArc
            android:id="@+id/seekArc"
            android:layout_width="300dp"
            android:layout_height="300dp"
            android:layout_centerInParent="true" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:orientation="horizontal" >

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="00"
                    android:textSize="60sp" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="H"
                    android:textSize="30sp" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:gravity="center" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="00"
                    android:textSize="60sp" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="M"
                    android:textSize="30sp" />
            </LinearLayout>
        </LinearLayout>
    </RelativeLayout>

</LinearLayout>

【讨论】：

【解决方案2】：

您正在寻找的是第二个答案中的here（不是公认的答案）。您在两个视图的中间使用了一个支柱。

这是答案中给出的示例：

<RelativeLayout 
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <View android:id="@+id/strut"
        android:layout_width="0dp"
        android:layout_height="0dp" 
        android:layout_centerHorizontal="true"/>
    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignRight="@id/strut"
        android:layout_alignParentLeft="true"
        android:text="Left"/> 
    <Button 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@id/strut"
        android:layout_alignParentRight="true"
        android:text="Right"/>
</RelativeLayout>

【讨论】：