在两个现有元素之间垂直居中TextView

时间:2015-10-17 16:23:14

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

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

当它居中时,TextView顶部和标题底部之间的距离应该与TextView底部和按钮顶部之间的距离相同。

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

我得到的是:

enter image description here

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

enter image description here

这是我的XML(注意,我设置了主要TextView的文本programaticaly。)

<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>

3 个答案:

答案 0 :(得分: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>

这是结果(我为背景着色以显示不同的区域)。

  • white:主要相对布局
  • 浅蓝色400:标题TextView
  • 浅蓝色100:居中TextView的相对布局

Result

答案 1 :(得分:0)

没有机会尝试,但这样的事情应该有效:

<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>

答案 2 :(得分:0)

试试这个

<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>