web-dev-qa-db-fra.com

RelativeLayout: aligner la vue centrée horizontalement ou verticalement par rapport à une autre vue

Est-il possible d'aligner une vue en XML dans une vue horizontale ou verticale centrée sur RelativeLayout en fonction d'une autre vue déjà existante.

Par exemple: disons qu'il y a quelque chose comme ceci:

enter image description here

La deuxième vue de texte doit être affichée centrée sous la première vue de texte:

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

    <TextView
        Android:id="@+id/textView"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_alignParentLeft="true"
        Android:layout_marginLeft="72dp"
        Android:text="dynamic text" />

    <TextView
        Android:id="@+id/second"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_below="@id/textView"
        Android:layout_marginLeft="43dp" <!-- Is there a rule to center it? -->
        Android:text="centered below text 1" />

</RelativeLayout>

Est-il possible d'implémenter quelque chose comme ça en XML? Existe-t-il une règle que j'ai encore manquée? Je ne veux pas calculer la position par programmation

13
sockeqwe

Utilisez une mise en page parent distincte pour ces vues et ajoutez-la à votre mise en page principale (peut contenir d'autres éléments si vous en avez)

<?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:orientation="vertical"
         Android:gravity="center"
         Android:layout_marginLeft = "30dp">
        <TextView
            Android:id="@+id/textView"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:text="dynamic text" />

        <TextView
            Android:id="@+id/second"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:text="centered below text 1" />
    </LinearLayout>
...
...
other veiws go here
...

</RelativeLayout>
12
Noundla Sandeep

J'ai une bien meilleure solution que celle acceptée. PAS DE NESTING EXTRA! Vous pouvez le faire en combinant deux attributs dans la vue plus petite. si vous vous centrez horizontalement, vous pouvez utiliser align_start & align_end dans la vue la plus grande. Assurez-vous que la gravité du texte est centrée entre "Android: gravity =" center ". Pour un alignement vertical, utilisez align_top & align_bottom. Ci-dessous, l'implémentation modifiée de votre mise en page.

<?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"
Android:paddingLeft="43dp" >

<TextView
    Android:id="@+id/textView"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_alignStart="@+id/second"
    Android:layout_alignEnd="@+id/second"
    Android:gravity="center"
    Android:text="dynamic text" />

<TextView
    Android:id="@+id/second"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_below="@id/textView"
    Android:gravity="center"
    Android:text="centered below text 1" />

</RelativeLayout>

Pas besoin d'imbrication inutile comme la réponse acceptée.

26
Jessicardo

Utilisez les suivants qui vous conviennent 

    Android:layout_centerHorizontal="true"
    Android:layout_centerInParent="true"    
    Android:layout_centerVertical="true"    
6
stinepike

La solution correcte consiste à utiliser ConstraintLayout

J'ai essayé d'aligner une vue de texte horizontalement sous un bouton dans RelativeLayout, mais ce n'était pas possible, car align_bottom et layout_below ne fonctionnaient pas bien ensemble. Enfin, j’ai retenu constraintLayout et essayé la même logique et cela a fonctionné comme un charme. voici le code ci-dessous.

<Android.support.constraint.ConstraintLayout 
xmlns:app="http://schemas.Android.com/apk/res-auto"
xmlns:tools="http://schemas.Android.com/tools"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:clipChildren="false"
xmlns:Android="http://schemas.Android.com/apk/res/Android">

<Button
    Android:id="@+id/episode_recording_header_stop"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:background="@mipmap/ic_launcher"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.399" />


<TextView
    Android:id="@+id/button_selected_text"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_margin="8dp"
    Android:textAlignment="center"
    Android:textColor="@Android:color/black"
    Android:textSize="12sp"
    Android:text="text which is exactly center aligned w.r.t the Button above"
    app:layout_constraintEnd_toEndOf="@+id/episode_recording_header_stop"
   app:layout_constraintStart_toStartOf="@+id/episode_recording_header_stop"
    app:layout_constraintTop_toBottomOf="@+id/episode_recording_header_stop" 
    />

</Android.support.constraint.ConstraintLayout>

Le résultat final est joint ci-dessous

 enter image description here

3
Rakesh Gopathi

J'ai trouvé la solution: Enveloppez le contenu dans un autre RelativeLayout et vous pourrez ensuite placer ce LayoutWrapper où vous le souhaitez:

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

    <RelativeLayout
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_alignParentLeft="true"
        Android:layout_alignParentTop="true"
        Android:layout_marginLeft="58dp"
        Android:layout_marginTop="58dp" >

        <TextView
            Android:id="@+id/textView"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_alignParentTop="true"
            Android:layout_centerInParent="true"
            Android:text="dynamic text" />

        <TextView
            Android:id="@+id/second"
            Android:layout_width="wrap_content"
            Android:layout_height="wrap_content"
            Android:layout_below="@+id/textView"
            Android:layout_centerInParent="true"
            Android:text="centered below text 1" />
    </RelativeLayout>

</RelativeLayout>
0
sockeqwe

Faites ceci->

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

    <TextView
        Android:id="@+id/textView"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_centerHorizontal="true"
        Android:text="dynamic text" />

    <TextView
        Android:id="@+id/second"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_below="@+id/textView"
        Android:layout_centerHorizontal="true" <!-- Is there a rule to center it? -->
        Android:text="centered below text 1" />

</RelativeLayout>
0
Vishal Pawale