1
votes

Android LinearLayout n'a pas la même apparence sur un appareil réel

Je crée un pavé numérique personnalisé pour une application Android. J'ai utilisé plusieurs LinearLayout horizontaux pour cela.

Voici le code lié à cette partie de l 'activité :

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="67dp">

    <ImageView
        android:id="@+id/digit1"
        android:layout_width="117dp"
        android:layout_height="67dp"
        app:srcCompat="@drawable/rsz_untitled_3" />

    <ImageView
        android:id="@+id/digit2"
        android:layout_width="118dp"
        android:layout_height="67dp"
        app:srcCompat="@drawable/digit_2" />

    <ImageView
        android:id="@+id/digit3"
        android:layout_width="100dp"
        android:layout_height="67dp"
        android:layout_weight="1"
        app:srcCompat="@drawable/digit_3" />

</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="70dp">

    <ImageView
        android:id="@+id/digit4"
        android:layout_width="117dp"
        android:layout_height="67dp"
        app:srcCompat="@drawable/digit_4" />

    <ImageView
        android:id="@+id/digit5"
        android:layout_width="118dp"
        android:layout_height="67dp"
        app:srcCompat="@drawable/digit_5" />

    <ImageView
        android:id="@+id/digit6"
        android:layout_width="100dp"
        android:layout_height="67dp"
        android:layout_weight="1"
        app:srcCompat="@drawable/digit_6" />

</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="64dp">

    <ImageView
        android:id="@+id/digit7"
        android:layout_width="117dp"
        android:layout_height="67dp"
        app:srcCompat="@drawable/digit_7" />

    <ImageView
        android:id="@+id/digit8"
        android:layout_width="118dp"
        android:layout_height="67dp"
        app:srcCompat="@drawable/digit_8" />

    <ImageView
        android:id="@+id/digit9"
        android:layout_width="100dp"
        android:layout_height="67dp"
        android:layout_weight="1"
        app:srcCompat="@drawable/digit_9" />

</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="64dp">

    <ImageView
        android:id="@+id/digitvoid"
        android:layout_width="117dp"
        android:layout_height="67dp" />

    <ImageView
        android:id="@+id/digit0"
        android:layout_width="118dp"
        android:layout_height="67dp"
        app:srcCompat="@drawable/digit_0" />

    <ImageView
        android:id="@+id/digitdelete"
        android:layout_width="100dp"
        android:layout_height="67dp"
        android:layout_weight="1"
        app:srcCompat="@drawable/digit_delete" />

</LinearLayout>

Ici, vous pouvez voir à quoi cela ressemble dans Studio Android , et à quoi il ressemble sur un appareil réel. Je ne comprends pas pourquoi cela se produit. J'utilise dp (qui, d'après ce que je comprends, devraient être des pixels dynamiques), ils devraient donc bien s'adapter sur chaque appareil.

android android-layout android-linearlayout

2 commentaires

essayez d'utiliser ConstraintLayout vous résolvez simplement ce problème

donnez simplement tout width = 0dp

6 Réponses :

1
votes

Évidemment, vous faites cela pour la troisième ligne:

android:layout_weight="1"

Et cela pose des problèmes - si votre écran n'est pas assez large pour suivre votre instruction de largeur, vous indiquez que tous les boutons ne sont pas les mêmes afin que seuls les derniers boutons soient redimensionnés.

0 commentaires

0
votes

veuillez remplacer votre 4 LinearLayout par ceci:

android:orientation="vertical"
android:weightSum="1.0"

et ajoutez la mise en page parent à ces deux attributs:

  <LinearLayout
    android:orientation="horizontal"
    android:weightSum="3"
    android:layout_weight="0.2"
    android:layout_width="match_parent"
    android:layout_height="0dip">

    <ImageView
        android:layout_weight="1"
        android:id="@+id/digit1"
        android:layout_width="0dip"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/rsz_untitled_3" />

    <ImageView
        android:id="@+id/digit2"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_2" />

    <ImageView
        android:id="@+id/digit3"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_3" />

</LinearLayout>

<LinearLayout
    android:orientation="horizontal"
    android:weightSum="3"
    android:layout_weight="0.2"
    android:layout_width="match_parent"
    android:layout_height="0dip">

    <ImageView
        android:id="@+id/digit4"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_4" />

    <ImageView
        android:id="@+id/digit5"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_5" />

    <ImageView
        android:id="@+id/digit6"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_6" />

</LinearLayout>

<LinearLayout
    android:orientation="horizontal"
    android:weightSum="3"
    android:layout_weight="0.2"
    android:layout_width="match_parent"
    android:layout_height="0dip">

    <ImageView
        android:id="@+id/digit7"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_7" />

    <ImageView
        android:id="@+id/digit8"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_8" />

    <ImageView
        android:id="@+id/digit9"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_9" />

</LinearLayout>

<LinearLayout
    android:orientation="horizontal"
    android:weightSum="3"
    android:layout_weight="0.2"
    android:layout_width="match_parent"
    android:layout_height="0dip">

    <ImageView
        android:id="@+id/digitvoid"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent" />

    <ImageView
        android:id="@+id/digit0"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_0" />

    <ImageView
        android:id="@+id/digitdelete"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/digit_delete" />

</LinearLayout>

NB: Si vous souhaitez réduire la hauteur du carré, réduisez simplement la valeur de: android: layout_weight = "0.2" à android:layout_weight="0.15"

0 commentaires

1
votes

Voici la mise en page dont vous avez besoin pour faire fonctionner cette chose. Le dp est traduit en tailles approximatives. Cependant, si vous souhaitez propager vos éléments avec la taille de l'écran, vous pouvez envisager d'utiliser le poids tout le temps.

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="67dp"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/digit1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/rsz_untitled_3" />

        <ImageView
            android:id="@+id/digit2"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_2" />

        <ImageView
            android:id="@+id/digit3"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_3" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/digit4"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_4" />

        <ImageView
            android:id="@+id/digit5"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_5" />

        <ImageView
            android:id="@+id/digit6"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_6" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="64dp"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/digit7"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_7" />

        <ImageView
            android:id="@+id/digit8"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_8" />

        <ImageView
            android:id="@+id/digit9"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_9" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="64dp"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/digitvoid"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1" />

        <ImageView
            android:id="@+id/digit0"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_0" />

        <ImageView
            android:id="@+id/digitdelete"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/digit_delete" />
    </LinearLayout>
</LinearLayout>

0 commentaires

1
votes

Veuillez vérifier le code ci-dessous. Cela peut résoudre votre problème. Si vous rencontrez un problème, veuillez me le faire savoir dans la section des commentaires.

Utilisez vos propres tirages et assests.

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="67dp">

        <ImageView
            android:id="@+id/digit1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

        <ImageView
            android:id="@+id/digit2"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

        <ImageView
            android:id="@+id/digit3"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="67dp">

        <ImageView
            android:id="@+id/digit4"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

        <ImageView
            android:id="@+id/digit5"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

        <ImageView
            android:id="@+id/digit6"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="67dp">

        <ImageView
            android:id="@+id/digit7"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

        <ImageView
            android:id="@+id/digit8"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

        <ImageView
            android:id="@+id/digit9"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="67dp">

        <ImageView
            android:id="@+id/digitvoid"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1" />

        <ImageView
            android:id="@+id/digit0"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

        <ImageView
            android:id="@+id/digitdelete"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            app:srcCompat="@drawable/add_more_icon" />

    </LinearLayout>
</LinearLayout>

Veuillez approuver la réponse si cela fonctionne pour vous. Merci!

0 commentaires

0
votes

essayez ceci

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:padding="2dp">

        <ImageView
            android:id="@+id/digit1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/rsz_untitled_3" />

        <ImageView
            android:id="@+id/digit2"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_2" />

        <ImageView
            android:id="@+id/digit3"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_3" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:padding="2dp">

        <ImageView
            android:id="@+id/digit4"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_4" />

        <ImageView
            android:id="@+id/digit5"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_5" />

        <ImageView
            android:id="@+id/digit6"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_6" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:padding="2dp">

        <ImageView
            android:id="@+id/digit7"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_7" />

        <ImageView
            android:id="@+id/digit8"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_8" />

        <ImageView
            android:id="@+id/digit9"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_9" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="70dp"
        android:padding="2dp">

        <ImageView
            android:id="@+id/digitvoid"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_margin="5dp"
            android:layout_weight="1" />

        <ImageView
            android:id="@+id/digit0"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_0" />

        <ImageView
            android:id="@+id/digitdelete"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:layout_margin="5dp"
            app:srcCompat="@drawable/digit_delete" />

    </LinearLayout>
</LinearLayout>

0 commentaires

1
votes

Vous utilisez une taille fixe sur vos vues, car différents téléphones ont une taille d'écran différente qui rendra votre écran non réactif.

Si vous souhaitez utiliser LinearLayout , vous voudrez probablement utiliser Attributs android: layout_weight et android: weightSum afin de donner à vos vues une certaine taille par rapport à votre écran. Vous pouvez le faire et cela fonctionnera, mais toutes les vues imbriquées affecteront très probablement les performances de vos mises en page.

Si vous voulez une mise en page qui réponde à toutes les tailles d'écran, vous pouvez utiliser ConstraintLayout avec chains , voici un exemple:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="match_parent">

<Button
    android:id="@+id/button"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="1"
    app:layout_constraintBottom_toBottomOf="@+id/button10"
    app:layout_constraintEnd_toStartOf="@+id/button10"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintHorizontal_chainStyle="packed"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@+id/button10" />

<Button
    android:id="@+id/button2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="0"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toStartOf="@+id/button11"
    app:layout_constraintStart_toEndOf="@+id/button5"
    app:layout_constraintTop_toBottomOf="@+id/button4" />

<Button
    android:id="@+id/button11"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="x"
    app:layout_constraintBottom_toBottomOf="@+id/button2"
    app:layout_constraintEnd_toEndOf="@+id/button3"
    app:layout_constraintStart_toEndOf="@+id/button4"
    app:layout_constraintTop_toTopOf="@+id/button2" />

<Button
    android:id="@+id/button3"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="8"
    app:layout_constraintBottom_toBottomOf="@+id/button4"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/button4"
    app:layout_constraintTop_toTopOf="@+id/button4" />

<Button
    android:id="@+id/button4"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="8"
    app:layout_constraintBottom_toTopOf="@+id/button2"
    app:layout_constraintEnd_toStartOf="@+id/button3"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/button5"
    app:layout_constraintTop_toBottomOf="@+id/button7" />

<Button
    android:id="@+id/button5"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="7"
    app:layout_constraintBottom_toBottomOf="@+id/button4"
    app:layout_constraintEnd_toStartOf="@+id/button4"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintHorizontal_chainStyle="packed"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@+id/button4" />

<Button
    android:id="@+id/button6"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="6"
    app:layout_constraintBottom_toBottomOf="@+id/button7"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/button7"
    app:layout_constraintTop_toTopOf="@+id/button7" />

<Button
    android:id="@+id/button7"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="5"
    app:layout_constraintBottom_toTopOf="@+id/button4"
    app:layout_constraintEnd_toStartOf="@+id/button6"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/button8"
    app:layout_constraintTop_toBottomOf="@+id/button10" />

<Button
    android:id="@+id/button8"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="4"
    app:layout_constraintBottom_toBottomOf="@+id/button7"
    app:layout_constraintEnd_toStartOf="@+id/button7"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintHorizontal_chainStyle="packed"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@+id/button7" />

<Button
    android:id="@+id/button9"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="3"
    app:layout_constraintBottom_toBottomOf="@+id/button10"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/button10"
    app:layout_constraintTop_toTopOf="@+id/button10" />

<Button
    android:id="@+id/button10"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="2"
    app:layout_constraintBottom_toTopOf="@+id/button7"
    app:layout_constraintEnd_toStartOf="@+id/button9"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/button"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_chainStyle="packed" />
 </android.support.constraint.ConstraintLayout>

Cela ressemblera à ceci:

0 commentaires