2012-08-28 15 views
11

Volevo sapere come centrare una vista tra due altre viste (o tra una vista e il bordo principale) utilizzando RelativeLayout.Come centrare una vista utilizzando RelativeLayout?

Per esempio, se ho il seguente ...

enter image description here

Come faccio a centrare verticalmente il pulsante tra l'ImageView e la parte inferiore dello schermo utilizzando RelativeLayout?

Sto cercando una soluzione in cui ...

  • il pulsante non è allungato in alcun modo
  • non ci sono i layout nidificate

e sto cercando di fare questo nel layout XML (non a livello di codice).

risposta

16

È possibile utilizzare seguente:

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

Questo non posizionerebbe semplicemente il pulsante _immediatamente_ sotto il TextView? Sembra che non ci sia alcun riguardo alla parte inferiore dello schermo nel layout sopra. Ho bisogno del pulsante centrato verticalmente tra TextView e la parte inferiore dello schermo. – Gus

+0

Ho modificato la mia risposta. Si prega di consultare la mia risposta aggiornata. – Shrikant

+0

Ciao Gus! Questo ha risolto il tuo problema? – Shrikant

1

uso questo android: layout_centerInParent = "true" in file XML ..

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

Questo è veramente utilizzando un LinearLayout per eseguire il lavoro, piuttosto che RelativeLayout. – Gus

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

Odio la codifica dura. –

1

@Gus è possibile creare vista centrale tra altre due viste ... non è esatto, devi provare con questo ...

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

Utilizzare al di sotto del codice XMl per risolvere il problema.

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

Penso che quello che basta è quello di Allinea l'ImageView come si farebbe normalmente fatto e allineare il pulsante usando layout_below, senza bisogno di hardcoding né utilizzando le visualizzazioni nidificate utilizzare Android: la gravità = "center" sulla pulsante che hai finito

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

Non c'è purtroppo un modo semplice per farlo. Puoi nidificare i layout o farlo in fase di runtime. Il modo più semplice è quello di nidificare i layout:

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

Questo pone l'immagine in alto. Al di sotto di questo, gli attributi layout_height=0 e layout_weight=1 sullo RelativeLayout fanno sì che occupi tutto lo spazio rimanente. È quindi possibile centrare il pulsante nel numero RelativeLayout. Puoi giocare con il padding sul pulsante per ottenere le dimensioni che desideri.

Problemi correlati