在 2 个现有元素之间垂直居中 TextView答案

【问题标题】：Vertically centre TextView between 2 existing elements在 2 个现有元素之间垂直居中 TextView
【发布时间】：2015-10-17 16:23:14
【问题描述】：

我的 Android 项目中有一个 RelativeLayout，它显示在一个简单的自定义对话框中。我在顶部有一个标题，在中间有一些文字，在底部有一个按钮。我要做的就是将标题底部和按钮顶部之间的文本居中。

居中时，TextView 顶部到标题底部的距离应与 TextView 底部到按钮顶部的距离相同。

为了实现这一点，我在相对布局中放置了一个框架布局，并将其放置在“按钮上方”和“标题下方”。

我得到的是这样的：

这就是我想要实现的目标：

这是我的 XML（注意，我以编程方式设置了主 TextView 的文本）。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:fillViewport="true"
    android:gravity="fill"
    android:background="#FFFFFF">

    <TextView
        android:id="@+id/title"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Title"
        android:layout_marginTop="10dp"
        android:textColor="#000000"
        android:gravity="center"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:textSize="40dp">        
    </TextView>   

    <Button
        android:id="@+id/button"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_gravity="bottom"
        android:layout_marginBottom="10dp"
        android:layout_alignParentBottom="true"
        android:textSize="25dp"
        android:text="Click Me"        
        android:background="@drawable/buttonbk"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"        
        android:textStyle="bold">
    </Button>

    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:layout_above="@+id/button"
        android:layout_below="@id/title" >

        <TextView
            android:id="@+id/text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:gravity="center_vertical|center_horizontal"
            android:paddingTop="50dp"
            android:paddingLeft="18dp"
            android:paddingRight="18dp"
            android:layout_gravity="center"
            android:textSize="30dp" 
            android:textColor="#000000">        
        </TextView>       

    </FrameLayout>

</RelativeLayout>

【问题讨论】：

标签： android android-layout android-relativelayout android-framelayout gravity

【解决方案1】：

这可能是您的问题的一个可能的解决方案。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white" >

    <TextView
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:gravity="center"
        android:background="@color/light_blue400"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:text="Title"
        android:textColor="@color/black"
        android:textSize="40dp" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/button"
        android:layout_below="@id/title"
        android:background="@color/light_blue100" >

        <TextView
            android:id="@+id/text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:paddingLeft="18dp"
            android:paddingRight="18dp"
            android:text="Text centered vertically"
            android:textColor="@color/black"
            android:textSize="30dp" />

    </RelativeLayout>

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_gravity="bottom"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:text="Click Me"
        android:textSize="25dp"
        android:textStyle="bold" />

</RelativeLayout>

这是结果（我已经为背景着色以显示不同的区域）。

白色：主要的相对布局
浅蓝色400：标题TextView
浅蓝色 100：居中 TextView 的相对布局

【讨论】：

感谢@eldivino，我不得不将按钮代码移到嵌入式布局上方，因为它给了我一个错误。然而它确实有效，它让我发现了问题（因为我正在逐行比较你的代码和我的代码），这对我来说是一个愚蠢的错误 - 我在我的 textview 顶部添加了一个 50dp 填充（android:paddingTop ="50dp")，我从原始代码中删除了它，它运行良好。谢谢！

【解决方案2】：

没有机会尝试，但是这样的东西应该可以工作：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:fillViewport="true"
android:gravity="fill">

<TextView
    android:id="@+id/title"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp"
    android:gravity="center"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:text="Title"
    android:textColor="#000000"
    android:textSize="40dp"></TextView>

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@id/text"
    android:layout_below="@id/title"
    android:background="#FFFFFF">

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_marginTop="5dp"
        android:paddingLeft="18dp"
        android:paddingRight="18dp"
        android:paddingTop="50dp"
        android:textColor="#000000"
        android:textSize="30dp"></TextView>
</RelativeLayout>

<Button
    android:id="@+id/button"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"
    android:layout_gravity="bottom"
    android:layout_marginBottom="10dp"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    android:background="@drawable/buttonbk"
    android:text="Click Me"
    android:textSize="25dp"
    android:textStyle="bold"></Button>
</RelativeLayout>

【讨论】：

【解决方案3】：

试试这个

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:gravity="fill"
android:background="#FFFFFF">

<TextView
    android:id="@+id/title"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="Title"
    android:layout_marginTop="10dp"
    android:textColor="#000000"
    android:gravity="center"
    android:paddingLeft="10dp"
    android:paddingRight="10dp"
    android:textSize="40dp">        
</TextView>   

<Button
    android:id="@+id/button"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_gravity="bottom"
    android:layout_marginBottom="10dp"
    android:layout_alignParentBottom="true"
    android:textSize="25dp"
    android:text="Click Me"        
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"        
    android:textStyle="bold">
</Button>

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="fill_parent"
    android:layout_above="@+id/button"
    android:layout_below="@id/title" >

    <TextView
        android:id="@+id/text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:paddingLeft="18dp"
        android:paddingRight="18dp"
        android:layout_gravity="center"
        android:textSize="30dp" 
        android:text="Hi Im textView"
        android:textColor="#000000">        
    </TextView>       

</FrameLayout>

【讨论】：