CODEWITHSUNDEEP
android
bungleofsketches
bungleofsketches

Reputation: 554

How to Stack two Android elements in the center of the screen

I want the editText and the button to be stacked on top of each other in the center of the screen. There's obviously an incredibly simple method I'm missing. Here they stick to the top left of the screen. Any help would be appreciated. I tried relative layout as well but then they're on top of each other in the Z-axis.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical"
   >

<EditText
    android:text="@string/hello_world"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"

    />

<Button
    android:text="Go >"
    android:layout_width="200dp"
    android:layout_height="wrap_content"
    />

Upvotes: 0

Views: 80

Answers (5)

Snicolas
Snicolas

Reputation: 38168

Use a relative layout and put your elements on top of each others :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center_vertical">
    <EditText
        android:id="@+id/tv_main"
        android:text="@string/hello_world"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
         android:layout_centerInParent="true"
        android:layout_centerHorizontal="true"/>
    <Button
        android:id="@+id/button_main"
        android:text="Go >"
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/tv_main"
        android:layout_centerHorizontal="true"/>
 </RelativeLayout>

Upvotes: 1

CodeWarrior
CodeWarrior

Reputation: 5176

Just use android:gravity="center" in your layout, it'll do the job for you.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center">

<EditText
    android:text="@string/hello_world"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"/>

<Button
    android:text="Go Went Gone"
    android:layout_width="200dp"
    android:layout_height="wrap_content"/>

</LinearLayout>

Upvotes: 0

sulai
sulai

Reputation: 5354

I would recommend to use RelativeLayout.

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

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

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView" />

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button" />

    </LinearLayout>

</RelativeLayout>

Upvotes: 0

Marc Ridders
Marc Ridders

Reputation: 351

You can wrap the edit text and Button in a vertical layout:

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

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:gravity="center"
    android:orientation="vertical" >

<EditText
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:text="@string/hello_world" />

<Button
    android:layout_width="200dp"
    android:layout_height="wrap_content"
    android:text="Go >" />
</LinearLayout>

Upvotes: 0

Manishika
Manishika

Reputation: 5564

Try the following data

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
   >

<EditText
    android:text="@string/hello_world"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
   android:layout_gravity="center_vertical"
   android:gravity="center"

    />

<Button
    android:text="Go >"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical"
     android:gravity="center"
    />
</LinearLayout>

Upvotes: 0

Related Questions