如何使用RelativeLayout使视图居中?

问题描述 投票:14回答:7

我想知道如何使用RelativeLayout将View放在两个其他视图之间(或在视图和父边缘之间)。

例如,如果我有以下...

如何使用RelativeLayout将Button垂直居中在ImageView和屏幕底部?

我正在寻找一个解决方案......

  • Button没有以任何方式拉伸
  • 没有嵌套布局

我正在尝试在XML布局中执行此操作(不是以编程方式)。

android android-layout android-relativelayout
7个回答
23
投票

您可以使用以下内容:

<RelativeLayout 
        android:layout_below="@id/theImageView"
        android:align_parentBottom="true"
        android:layout_width="match_parent"
        android:layout_height="200dp" >    


        <Button 
            android:id="@+id/btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"            
            android:onClick="onClickButton"
            android:textSize="20sp"
            android:text="Go"/>

    </RelativeLayout>

3
投票

使用下面的XMl代码,它将解决您的问题。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <LinearLayout
        android:id="@+id/mLlayout1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <ImageView
            android:id="@+id/mImgView1"
            android:layout_width="fill_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:src="@drawable/ic_launcher" />

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="match_parent"
            android:layout_weight="2" >

            <Button
                android:id="@+id/Btn1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerInParent="true"
                android:text="Dipak" />
        </RelativeLayout>
    </LinearLayout>

</RelativeLayout>

3
投票

遗憾的是,没有简单的方法可以做到这一点。您可以嵌套布局,也可以在运行时进行布局。最简单的方法是嵌套布局:

<LinearLayout
    android:width="match_parent"
    android:height="match_parent"
    android:orientation="vertical">
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/my_top_image"/>
    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="0dip"
        android:layout_weight="1">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="@string/my_button_label"/>
    </RelativeLayout>
</LinearLayout>

这会将图像置于顶部。在此之下,layout_height=0上的layout_weight=1RelativeLayout属性导致它占据所有剩余空间。然后,您可以将按钮置于RelativeLayout中心。您可以在按钮上使用填充来使其达到您想要的大小。


1
投票

在XML文件中使用此android:layout_centerInParent =“true”..

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="1.0" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight="0.8"
        android:background="#00ff00" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true" />
    </RelativeLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight="0.2" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="Button" />
    </RelativeLayout>

</LinearLayout>

1
投票

@Gus你可以在另外两个视图之间创建中心视图......这不是你必须用这种方式尝试....

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:background="#00ccFF"
        android:orientation="horizontal" >
    </LinearLayout>

    <LinearLayout
        android:layout_width="59dp"
        android:layout_height="59dp"
        android:layout_alignRight="@+id/linearLayout1"
        android:layout_alignTop="@+id/linearLayout1"
        android:layout_marginRight="-21dp"
        android:layout_marginTop="-21dp"
        android:background="#FFccFF"
        android:orientation="vertical" >
    </LinearLayout>

</RelativeLayout>

0
投票

我认为你需要的是像往常一样对齐imageview并使用layout_below对齐按钮,不需要硬编码也不需要使用嵌套视图在你完成的按钮上使用android:gravity =“center”

   <RelativeLayout 
    android:layout_below="@id/theImageView"
    android:align_parentBottom="true"
    android:layout_width="match_parent"
    android:layout_height="200dp" >    

   <ImageView
       android:id="@+id/imgview"
        android:layout_width="match_parentmat"
        android:layout_height="wrap_content"  />
    <Button 
        android:id="@+id/btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:layout_below="@+id/imgview"
        android:gravity="center"        
        android:onClick="onClickButton"
        android:textSize="20sp"
        android:text="Go"/>

</RelativeLayout>

-1
投票
    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="20dp"
        android:src="@drawable/wood" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/imageView1"
        android:layout_below="@+id/imageView1"
        android:layout_marginLeft="101dp"
        android:layout_marginTop="53dp"
        android:text="Image Button" />
</RelativeLayout>
© www.soinside.com 2019 - 2024. All rights reserved.