Tengahkan tombol dalam tata letak Linear

338

Saya menggunakan tata letak linier untuk menampilkan layar awal yang cukup ringan. Ini memiliki 1 tombol yang seharusnya berpusat di layar baik secara horizontal dan vertikal. Namun apa pun yang saya coba lakukan tombol akan menyelaraskan pusat tengah. Saya telah memasukkan XML di bawah ini, dapatkah seseorang mengarahkan saya ke arah yang benar?

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

    <ImageButton android:id="@+id/btnFindMe" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical|center_horizontal"
        android:background="@drawable/findme"></ImageButton>

</LinearLayout>
xml  android  layout 
— themaninthesuitcase
sumber
6
Apa yang diperbaiki untuk saya di LinearLayout dengan perataan horisontal adalah untuk diatur layout_widthke "wrap_content". Selanjutnya layout_gravitymelakukan apa yang seharusnya dilakukan!
— Seseorang di suatu tempat
Jika Anda benar-benar perlu menggunakan LinearLayout, saya pikir ini harus bekerja: stackoverflow.com/questions/18051472/…
— Antonio

Jawaban:

374

Jika Anda ingin memusatkan item di tengah layar jangan gunakan LinearLayoutkarena ini dimaksudkan untuk menampilkan sejumlah item dalam satu baris.

Gunakan RelativeLayoutsaja.

Jadi ganti:

android:layout_gravity="center_vertical|center_horizontal"

untuk RelativeLayoutopsi yang relevan :

android:layout_centerInParent="true"

Jadi file layout Anda akan terlihat seperti ini:

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

    <ImageButton android:id="@+id/btnFindMe" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:background="@drawable/findme"></ImageButton>

</RelativeLayout>
— Dave Webb
sumber
38
Ada beberapa contoh di mana Anda perlu menggunakan konten LinearLayout dan pusat. Ini seharusnya bukan jawaban yang diterima. Akan lebih baik untuk menyarankan menggunakan RelativeLayout jika memungkinkan, dan jika tidak bagaimana cara memusatkan di LinearLayout.
— stevebot
Belum lagi fakta bahwa RelativeLayout jauh lebih intensif runtime karena cara mereka harus memiliki dimensi mereka diukur, sedangkan LinearLayout super mudah dan jauh lebih efisien.
— Trevor Hart
436

Pusat menggunakan LinearLayout:

<LinearLayout
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical" >

    <ImageButton
        android:id="@+id/btnFindMe"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/findme" />
</LinearLayout>
— lancha90
sumber
11
LinearLayout lebih sederhana dan lebih ringan dibandingkan dengan RelativeLayout, harus sedikit lebih cepat.
— SurlyDre
3
Saya menggunakan layout_gravity bukan gravitasi. mengubah ke android: gravity = "center" memperbaiki ini untuk saya. kesalahan pemula.
— ackushiw
@ackushiw juga masalah saya!
— Denny
Setidaknya bagi saya android: gravity = "center" atribut LinearLayout yang melakukan trik. Terima kasih kawan!
— tthreetorch
42

Sudahkah Anda mencoba mendefinisikan android:gravity="center_vertical|center_horizontal"di dalam tata letak dan pengaturan android:layout_weight="1"pada gambar?

— rui
sumber
2
Saya suka opsi ini yang memungkinkan saya menyimpan mi LinearLayout! (Aku tidak harus mengatur android:weight="1"tombol untuk memusatkannya.)
— Sébastien
4
android: gravitasi tidak bekerja untuk saya dalam LinearLayout horizontal, tetapi android: layout_gravity tidak.
— jfritz42
35

Metode yang umum digunakan yang bekerja dengan tata letak linier adalah mengatur properti pada tombol gambar

android:layout_gravity="center"

Anda dapat memilih apakah akan menyelaraskan kiri, meluruskan tengah, atau meluruskan kanan setiap objek dalam tata letak linier. Perhatikan bahwa baris di atas persis sama dengan

android:layout_gravity="center_vertical|center_horizontal"
— hopcraft
sumber
4
Tambahkan android: gravity = "center" properti di tata letak induk - yang menahan tombol Anda (komponen anak).
— Shekh Akther
Anda juga memerlukan android.orientation = "vertikal" ditambah layout_gravity pada induknya, alias elemen LInearLayout ....
— Joe Healy
8

Jika Anda menggunakan, LinearLayoutAnda dapat menambahkan pusat gravitasi:

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:gravity="center">
            <Button
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            />
</LinearLayout>`
— Hans Pour
sumber
7

mudah dengan ini

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:visibility="visible" 
        android:gravity="center"
        android:orientation="vertical" >

        <ProgressBar
            android:id="@+id/pbEndTrip"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:gravity="center"
            android:text="Gettings" />
    </LinearLayout>
— Javier
sumber
5 
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <ImageButton android:id="@+id/btnFindMe" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"
        android:layout_gravity = "center"
        android:background="@drawable/findme">
    </ImageButton>

</LinearLayout>

Kode di atas akan berfungsi.

— Vish
sumber
2

menyelesaikan dan bekerja sampel dari mesin saya ...

<LinearLayout 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"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context=".MainActivity"
    android:gravity="center"
    android:textAlignment="center">


    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="My Apps!"
        android:id="@+id/textView"
        android:gravity="center"
        android:layout_marginBottom="20dp"
     />

    <Button
        android:layout_width="220dp"
        android:layout_height="wrap_content"
        android:text="SPOTIFY STREAMER"
        android:id="@+id/button_spotify"
        android:gravity="center"
        android:layout_below="@+id/textView"
        android:padding="20dp"
        />

    <Button
        android:layout_width="220dp"
        android:layout_height="wrap_content"
        android:text="SCORES"
        android:id="@+id/button_scores"
        android:gravity="center"
        android:layout_below="@+id/textView"
        android:padding="20dp"
        />


    <Button
        android:layout_width="220dp"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="LIBRARY APP"
        android:id="@+id/button_library"
        android:gravity="center"
        android:layout_below="@+id/textView"
        android:padding="20dp"
        />

    <Button
        android:layout_width="220dp"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="BUILD IT BIGGER"
        android:id="@+id/button_buildit"
        android:gravity="center"
        android:layout_below="@+id/textView"
        android:padding="20dp"
        />

    <Button
        android:layout_width="220dp"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="BACON READER"
        android:id="@+id/button_bacon"
        android:gravity="center"
        android:layout_below="@+id/textView"
        android:padding="20dp"
        />

    <Button
        android:layout_width="220dp"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="CAPSTONE: MY OWN APP"
        android:id="@+id/button_capstone"
        android:gravity="center"
        android:layout_below="@+id/textView"
        android:padding="20dp"
        />

</LinearLayout>
Luaskan cuplikan

— Joe Healy
sumber
Anda hanya dapat menggunakan 'android: layout_below' pada saudara dari 'RelativeLayout'
— jazz
2

Sesuai dokumentasi Android untuk Atribut XML android: layout_gravity , kita dapat melakukannya dengan mudah :)

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

    <ImageButton android:id="@+id/btnFindMe" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"

        android:layout_gravity="center"

        android:background="@drawable/findme"></ImageButton>

</LinearLayout>
— Reza Mamun
sumber
1
android: layout_gravity = "center" berfungsi dengan baik :) terima kasih!
— Amine Soumiaa
1

Setel ke true android:layout_alignParentTop="true"dan android:layout_centerHorizontal="true"di Button, seperti ini:

<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"
    >
     <Button
        android:id="@+id/switch_flashlight"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/turn_on_flashlight"
        android:textColor="@android:color/black"
        android:onClick="action_trn"
        android:background="@android:color/holo_green_light"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:padding="5dp" />
</RelativeLayout>

masukkan deskripsi gambar di sini

— Oskar
sumber
0

Anda juga dapat Mencoba Kode ini:

<LinearLayout
            android:id="@+id/linear_layout"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:orientation="horizontal"
            android:weightSum="2.0"
            android:background="@drawable/anyBackground" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:orientation="vertical"
            android:layout_weight="1" >

            <ImageView
                android:id="@+id/img_mail"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:background="@drawable/yourImage" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:orientation="vertical"
            android:layout_weight="1" >



<ImageView
            android:id="@+id/img_save"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:background="@drawable/yourImage" />
        </LinearLayout>
        </LinearLayout>
— pengguna4058115
sumber
Bisakah Anda menjelaskan bagaimana ini berbeda dari jawaban yang sudah disediakan?
— EWit
0

cukup gunakan (untuk membuatnya di tengah tata letak Anda)

        android:layout_gravity="center"

dan gunakan 

         android:layout_marginBottom="80dp"

         android:layout_marginTop="80dp"

untuk mengubah posisi

— Mohamed Adel
sumber
0

Anda juga dapat mengatur lebar LinearLayout untuk wrap_contentdan penggunaan android:layout_centerInParent, android:layout_centerVertical="true":

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_centerInParent="true"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
>

<ImageButton android:id="@+id/btnFindMe" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"       
    android:background="@drawable/findme"/>

— A-Sharabiani
sumber
0

Ini bekerja untuk saya.

android:layout_alignParentEnd="true"
— Marci
sumber
-2

Apakah kamu mencoba ini?

  <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/mainlayout" android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5px"
android:background="#303030"
>
    <RelativeLayout
    android:id="@+id/widget42"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    >
    <ImageButton
    android:id="@+id/map"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="map"
    android:src="@drawable/outbox_pressed"
    android:background="@null"
    android:layout_toRightOf="@+id/location"
    />
    <ImageButton
    android:id="@+id/location"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="location"
    android:src="@drawable/inbox_pressed"
    android:background="@null"
    />
    </RelativeLayout>
    <ImageButton
    android:id="@+id/home"
    android:src="@drawable/button_back"
    android:background="@null"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    />
</RelativeLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5px"
android:orientation="horizontal"
android:background="#252525"
>
    <EditText
    android:id="@+id/searchfield"
    android:layout_width="fill_parent"
    android:layout_weight="1"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:background="@drawable/customshape"
    />
    <ImageButton
    android:id="@+id/search_button"
    android:src="@drawable/search_press"
    android:background="@null"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    />
</LinearLayout>
<com.google.android.maps.MapView
    android:id="@+id/mapview" 
    android:layout_weight="1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:clickable="true"
    android:apiKey="apikey" />

</TableLayout>
— Varghese John
sumber
-2

menggunakan

android: layout_centerHorizontal = "true"

— Mayank Mishra
sumber
1
Sebenarnya vogon101, ini adalah properti yang valid di RelativeLayout. :) Itu tidak menjawab pertanyaan, karena pengguna menggunakan LinearLayout dan ingin memusatkan secara vertikal dan horizontal.
— Sarah
-7

Akan lebih mudah menggunakan tata letak relatif, tetapi untuk tata letak linier saya biasanya memusatkan dengan memastikan lebarnya cocok dengan induk: 

    android:layout_width="match_parent"

dan kemudian berikan margin ke kanan dan kiri sesuai. 

    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"
— pengguna2090145
sumber
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.