Zentrieren Sie eine Schaltfläche in einem linearen Layout

338

Ich verwende ein lineares Layout, um einen ziemlich hellen Startbildschirm anzuzeigen. Es hat 1 Schaltfläche, die horizontal und vertikal im Bildschirm zentriert werden soll. Unabhängig davon, was ich versuche, wird die Schaltfläche oben in der Mitte ausgerichtet. Ich habe das unten stehende XML eingefügt. Kann mich jemand in die richtige Richtung weisen?

<?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 
— der neunte Koffer
quelle
6
Was es für mich in einem LinearLayout mit horizontaler Ausrichtung behoben hat, war die Einstellung layout_widthauf "wrap_content". Anschließend layout_gravitytat das, was es tun sollte!
— Jemand irgendwo
Wenn Sie LinearLayout unbedingt verwenden müssen, sollte dies funktionieren: stackoverflow.com/questions/18051472/…
— Antonio

Antworten:

372

Wenn Sie ein Element in der Mitte des Bildschirms zentrieren möchten, verwenden Sie nicht a, LinearLayoutda diese zum Anzeigen einer Reihe von Elementen in einer Reihe vorgesehen sind.

Verwenden Sie RelativeLayoutstattdessen ein.

Also ersetzen:

android:layout_gravity="center_vertical|center_horizontal"

für die entsprechende RelativeLayoutOption:

android:layout_centerInParent="true"

Ihre Layoutdatei sieht also folgendermaßen aus:

<?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
quelle
38
Es gibt Fälle, in denen Sie ein LinearLayout verwenden und Inhalte zentrieren müssen. Dies sollte nicht die akzeptierte Antwort sein. Es ist besser, wenn möglich die Verwendung eines RelativeLayout vorzuschlagen und wenn nicht, wie in einem LinearLayout zentriert werden soll.
— Stevebot
Ganz zu schweigen von der Tatsache, dass ein RelativeLayout aufgrund der Art und Weise, wie die Abmessungen gemessen werden müssen, viel laufzeitintensiver ist, während ein LinearLayout sehr einfach und viel effizienter ist.
— Trevor Hart
Es war veraltet? Es ist ein Fehler aufgetreten.
— 司 谷 賢 司
436

Mit einem LinearLayout zentrieren:

<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
quelle
11
LinearLayout ist einfacher und leichter als ein RelativeLayout und sollte etwas schneller sein.
— SurlyDre
3
Ich habe layout_gravity anstelle der Schwerkraft verwendet. Wechsel zu Android: Schwerkraft = "Zentrum" hat dies für mich behoben. Anfängerfehler.
— Ackushiw
@ackushiw war auch mein Problem!
— Denny
Zumindest für mich Android: Gravity = "Mitte" LinearLayout-Attribut hat den Trick gemacht. Danke, Bro!
— tthreetorch
42

Haben Sie versucht, android:gravity="center_vertical|center_horizontal"innerhalb des Layouts und der Einstellung android:layout_weight="1"im Bild zu definieren?

— rui
quelle
2
Ich mag diese Option, mit der ich mi LinearLayout behalten kann! (Ich musste android:weight="1"den Knopf nicht einstellen , um ihn zu zentrieren.)
— Sébastien
4
android: Schwerkraft funktioniert bei mir in einem horizontalen LinearLayout nicht, android: layout_gravity jedoch.
— jfritz42
35

Eine häufig verwendete Methode, die mit linearem Layout arbeitet, besteht darin, eine Eigenschaft für die Bildschaltfläche festzulegen

android:layout_gravity="center"

Sie können wählen, ob Sie jedes Objekt im linearen Layout nach links, mittig oder rechts ausrichten möchten. Beachten Sie, dass die obige Zeile genau die gleiche ist wie

android:layout_gravity="center_vertical|center_horizontal"
— Hopcraft
quelle
4
Fügen Sie im übergeordneten Layout die Eigenschaft android :vity = "center" hinzu, die Ihre Schaltfläche enthält (untergeordnete Komponenten).
— Shekh Akther
Sie benötigen auch android.orientation = "vertikal" plus die layout_gravity im übergeordneten Element, auch bekannt als das LInearLayout-Element ....
— Joe Healy
8

Wenn Sie verwenden LinearLayout, können Sie den Schwerpunkt hinzufügen:

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

einfach damit

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

Der obige Code funktioniert.

— Vish
quelle
2

komplette und funktionierende Probe von meiner Maschine ...

<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>
Erweitern Sie das Snippet

— Joe Healy
quelle
Sie können 'android: layout_below' nur für Geschwister von 'RelativeLayout'
— Jazz
2

Gemäß der Android-Dokumentation für XML-Attribute von Android: layout_gravity können wir dies problemlos tun :)

<?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
quelle
1
android: layout_gravity = "center" funktioniert gut :) danke!
— Amine Soumiaa
1

Setzen Sie auf true android:layout_alignParentTop="true"und android:layout_centerHorizontal="true"in den Button wie folgt:

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

Geben Sie hier die Bildbeschreibung ein

— Oskar
quelle
0

Sie können diesen Code auch ausprobieren:

<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>
— user4058115
quelle
Können Sie erklären, wie sich dies von den bereits gegebenen Antworten unterscheidet?
— EWit
0

Verwenden Sie einfach (um es in die Mitte Ihres Layouts zu setzen)

        android:layout_gravity="center"

und verwenden 

         android:layout_marginBottom="80dp"

         android:layout_marginTop="80dp"

Position ändern

— Mohamed Adel
quelle
0

Sie können auch die Breite des Linearlayout auf wrap_contentund Verwendung 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
quelle
0

Das funktioniert bei mir.

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

Hast du das versucht?

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

verwenden

android: layout_centerHorizontal = "true"

— Mayank Mishra
quelle
1
Tatsächlich ist vogon101 eine gültige Eigenschaft in einem RelativeLayout. :) Die Frage wird jedoch nicht beantwortet, da der Benutzer ein LinearLayout verwendet und sowohl vertikal als auch horizontal zentrieren wollte.
— Sarah
-7

Es wäre einfacher, relative Layouts zu verwenden, aber für lineare Layouts zentriere ich normalerweise, indem ich sicherstelle, dass die Breite mit dem übergeordneten übereinstimmt: 

    android:layout_width="match_parent"

und dann geben Sie einfach Ränder nach rechts und links entsprechend. 

    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"
— user2090145
quelle
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.