Partage
  • Partager sur Facebook
  • Partager sur Twitter

[Android] Centrer image en haut (LinearLayout)

Sujet résolu
18 juillet 2014 à 9:56:21

Bonjour,

Voilà, je suis débutante en programmation Android et je suis entrain de réaliser l'interface graphique de mon application. Sur la page que je suis entrain de réaliser, je voudrais centrer une image en haut mais voilà, j'ai beau tout essayer, cela ne marche pas du tout...

Voici le code XML de ma page :

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#313131" >

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/imageView_accueil"
        android:layout_gravity="top|center_horizontal" />

</LinearLayout>

Malheureusement, avec le code ci-dessous, elle est centré au milieu de la page et non pas en haut comme je le souhaite...

-
Edité par Aiimilin 18 juillet 2014 à 14:25:29

  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 10:38:22

Bonjour,

C'est étrange, après avoir copié/collé ton code il n'y a aucun problème, ton image est bien centré en haut au milieu. Est-ce bien ton layout entier? 

Sinon ce que je te propose:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#313131" >
    
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@+id/imageView_accueil"
            android:layout_gravity="top|center_horizontal"
            android:src="@drawable/ici_la_source_du_bouton"/>


    </LinearLayout>
        
</LinearLayout>



-
Edité par ur86 18 juillet 2014 à 10:42:02

  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 10:50:21

Bonjour,

Plusieurs choses.

Tout d'abord, privilégie l'utilisation de match_parent à la place de fill_parent, ce dernier étant déprécié depuis l'API 8.

Ensuite, la méthode de ur86 est vraiment mauvaise, imbriquer des ViewGroup dans des ViewGroup est une très mauvaise pratique ! Dans ton cas, tu peux toujours remplacer ton LinearLayout par un RelativeLayout puis tu peux préciser la position de l'ImageView dans le parent via les attributs ALIGN_PARENT_TOP et CENTER_HORIZONTAL.

  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 11:35:37

En fait, je pense que c'est mon image qui pose problème...

Voici son lien : http://www.webcam-hd.com/Images/dunkerque_malo-plage/zooms/dunkerque_malo-plage6.jpg

-
Edité par Aiimilin 18 juillet 2014 à 11:35:49

  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 12:19:56

Bonjour,

Effectivement ton image est un peu grande. Dans ton XML, ajoute le android:adjustViewBounds ="true" dans les attributs de ton ImageView, ça devrait régler le problème ;)

  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 13:42:51

Merci beaucoup, problème résolu !
  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 13:56:06

N'oublie pas d'indiquer le sujet comme tel alors ;)

  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 14:04:11

Une dernière petite question avant de clôturer définitivement ce sujet, est-il possible de mettre une autre image au dessus de mon image que j'alignerais en haut à droite ?
  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 14:10:28

Bien sûr ;)

Tu peux placer tes 2 images dans un LinearLayout en précisant que son orientation est verticale, ou tu peux placer les 2 éléments dans un RelativeLayout en précisant la position de tes ImagesView les unes par rapport aux autres via - par exemple - les attributs android:layout_below et android:layout_above.

Quelques liens utiles :

-
Edité par rolandl 18 juillet 2014 à 14:10:52

  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 14:25:04

Voici mon code XML mais ça ne rends pas le résultat que j'attends...

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#313131" >

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@+id/imageView_accueil"
            android:adjustViewBounds="true"
            android:layout_gravity="center_horizontal|top"/>

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@+id/imageView_temps"
            android:layout_below="@id/imageView_accueil"
            android:layout_gravity="right|top" />

</LinearLayout>



  • Partager sur Facebook
  • Partager sur Twitter
18 juillet 2014 à 17:12:51

Vu que j'ai absolument la flemme d'ouvrir un IDE pour taper du code, peux-tu poster une capture d'écran de ce que tu veux et une capture d'écran de ce que tu obtiens ?

  • Partager sur Facebook
  • Partager sur Twitter
20 juillet 2014 à 11:49:14

En fait, je voudrais avoir comme ci-dessous :

Sauf que moi, j'ai la photo avec en dessous, l'image de la météo alors que j'ai normalement bien positionné les deux images comme il fallait...

  • Partager sur Facebook
  • Partager sur Twitter
20 juillet 2014 à 20:29:59

Si je comprends bien tu veux une photo en arrière plan (l'espèce de plage) et en haut à droite une autre photo genre le soleil ?

Tu ne risques pas d'arriver à ce résultat avec 2 ImageView. Il faut une seule ImageView pour le soleil. L'image en arrière plan doit-être le background de ton LinearLayout.

  • Partager sur Facebook
  • Partager sur Twitter
21 juillet 2014 à 10:14:40

Je viens d'essayer, l'image du soleil apparaît donc maintenant bien au dessus de la plage mais quand je dis au soleil d'être en right|top avec la propriété layout_gravity, ça ne marche pas, une idée ?
  • Partager sur Facebook
  • Partager sur Twitter
21 juillet 2014 à 10:18:52

Remplace ton LinearLayoutpar un RelativeLayout et dans ton ImageView précise les attributs android:alignParentTop="true" et android:alignParentRight="true".

  • Partager sur Facebook
  • Partager sur Twitter
21 juillet 2014 à 10:32:57

Je viens de tester avec le code XML ci-dessous et l'image du soleil, n'est toujours pas en haut à droite...

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#313131" >

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="200dip"
            android:id="@+id/layout_meteo"
            android:background="#313131"
            android:adjustViewBounds="true">

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:id="@+id/imageView_temps"
                android:layout_alignParentTop="true"
                android:layout_alignParentRight="true" />
        </RelativeLayout>
</LinearLayout>



  • Partager sur Facebook
  • Partager sur Twitter
21 juillet 2014 à 11:02:59

Double post car j'ai trouvé la solution, il faut juste mettre les propriétés de l'image à wrap_content pour layout_width et layout_height !
  • Partager sur Facebook
  • Partager sur Twitter
24 mars 2020 à 23:33:44

comment alligner plusieurs textviews, ie , les mettre sur plusieurs lignes?

-
Edité par cheblatouati 24 mars 2020 à 23:35:31

  • Partager sur Facebook
  • Partager sur Twitter
25 mars 2020 à 9:23:47

Bonjour,

Déterrage

Citation des règles générales du forum :

Avant de poster un message, vérifiez la date du sujet dans lequel vous comptiez intervenir.

Si le dernier message sur le sujet date de plus de deux mois, mieux vaut ne pas répondre.
En effet, le déterrage d'un sujet nuit au bon fonctionnement du forum, et l'informatique pouvant grandement changer en quelques mois il n'est donc que rarement pertinent de déterrer un vieux sujet.

Au lieu de déterrer un sujet il est préférable :

  • soit de contacter directement le membre voulu par messagerie privée en cliquant sur son pseudonyme pour accéder à sa page profil, puis sur le lien "Ecrire un message"
  • soit de créer un nouveau sujet décrivant votre propre contexte
  • ne pas répondre à un déterrage et le signaler à la modération

Je ferme ce sujet. En cas de désaccord, me contacter par MP.

  • Partager sur Facebook
  • Partager sur Twitter

Pas d'aide concernant le code par MP, le forum est là pour ça :)