1
votes

Problème d'alignement des textViews avec leurs bords inférieurs en ligne droite

Je suis nouveau sur Android et lors de la création d'une mise en page de départ, je suis juste resté coincé avec l'alignement des bords inférieurs des deux textViews en une seule ligne droite sans codage en dur (comme définir des valeurs de sp fixes pour aligner les deux) . Voici mon code:

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context=".MainActivity">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/time_text_view"
        android:text="2:10"
        android:textStyle="bold"
        android:textSize="40sp"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/time_text_view"
        android:text="PM"
        android:textSize="20sp"
        android:textStyle="bold" />
</RelativeLayout>

Et voici à quoi ressemble le fichier après la compilation:

Je veux aligner 'PM' et l'heure sur la même base mais pas sur la base de la mise en page.

android xml

3 commentaires

Vous voulez que PM soit centré sur l'heure?

Pas de centrage mais imaginez dessiner une ligne où se trouve la base du temps, puis écrire PM au-dessus de la même ligne que la base.

Mon conseil est de démarrer votre Android avec la dernière bibliothèque. Par exemple, au lieu d'utiliser RelativeLayout et LinearLayout , utilisez ConstraintLayout .

5 Réponses :

1
votes

Vous pouvez le faire facilement avec ConstraintLayout en attribuant:

Contrainte horizontale gauche / début de "PM" à droite / fin de "2:10"

Contrainte verticale du bas de "PM" au bas de "2:10"

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:context=".MainActivity">

 <TextView
    android:id="@+id/timeTextView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/time_text_view"
    android:text="2:10"
    android:textStyle="bold"
    android:textSize="40sp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"/>

<TextView
    android:id="@+id/timePostfixTextView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toRightOf="@id/time_text_view"
    android:text="PM"
    android:textSize="20sp"
    android:textStyle="bold"
    app:layout_constraintStart_toEndOf="@id/timeTextView"
    app:layout_constraintBottom_toBottomOf="@id/timeTextView" />
</androidx.constraintlayout.widget.ConstraintLayout>

0 commentaires

2
votes

Vous pouvez utiliser ConstraintLayout comme:

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/time_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="2:10"
        android:textSize="40sp"
        android:textStyle="bold" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/time_text_view"
        android:layout_toEndOf="@+id/time_text_view"
        android:text="PM"
        android:textSize="20sp"
        android:textStyle="bold" />
</RelativeLayout>

Ou avec RelativeLayout comme:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    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:gravity="bottom"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/time_text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="2:10"
        android:textSize="40sp"
        android:textStyle="bold"
        app:layout_constraintStart_toStartOf="parent" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="PM"
        android:textSize="20sp"
        android:textStyle="bold"
        app:layout_constraintBaseline_toBaselineOf="@+id/time_text_view"
        app:layout_constraintStart_toEndOf="@+id/time_text_view" />
</androidx.constraintlayout.widget.ConstraintLayout>

5 commentaires

Il affiche le texte en bas de la mise en page mais n'aligne pas le texte PM avec la base du texte qui représente le temps. Je veux que ces deux soient alignés mais pas avec la base de la mise en page, plutôt en commençant par le coin supérieur gauche lui-même. Merci!

Cela fonctionne parfaitement bien. Je n'ai aucune connaissance de la disposition des contraintes jusqu'à présent, je veux donc vous demander si je peux le faire avec une disposition relative de quelque manière que ce soit?

Oui, nous pouvons également le faire avec RelativeLayout. @VaibhavDixit

Pouvez-vous me dire comment le faire alors, j'apprécierais l'aide!

Merci j'ai eu la solution!

0
votes

Code mis à jour

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="horizontal"
    android:gravity="bottom"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="2:10"
        android:textStyle="bold"
        android:textSize="40sp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="PM"
        android:textSize="20sp"
        android:textStyle="bold" />
</LinearLayout>

Faites-moi savoir si cela fonctionne.

2 commentaires

cela ne fonctionne pas car ce code ne modifie que la hauteur en match_parent et cela ne fera rien avec l'alignement du texte.

Désolé mon mauvais, mon code fonctionne avec une mise en page linéaire. Modifier la réponse en conséquence.

0
votes

utilisez simplement la ligne ci-dessous dans votre deuxième TextView

<TextView
       ....
        android:layout_alignBottom="@+id/time_text_view"
       ......../>

0 commentaires

0
votes

Enveloppez-les dans un LinerarLayout comme ci-dessous:

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context=".MainActivity">


    <LinearLayout
        android:orientation="horizontal"
        android:gravity="bottom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/time_text_view"
            android:text="2:10"
            android:textStyle="bold"
            android:textSize="40sp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/time_text_view"
            android:text="PM"
            android:textSize="20sp"
            android:textStyle="bold" />
    </LinearLayout>
</RelativeLayout>

0 commentaires