Discussion :

[toshiro92]

Bonsoir,

J'essaye depuis quelques heures de positionner 4 boutons, avec 1 textView sous chaque bouton.
J'ai réussi à faire ceci :



Uploaded with ImageShack.us

J'ai essayé de le centrer et de les placer en carré, mais le problème, c'est qu'il coupe le texte "Enseignement" en ne laissant que "Ens", et m'écrase son îcone. De plus, le bouton "Documentation" n'est pas centré. Comment faire ?

Voici mon code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
	android:id="@+id/relativeLayout1" 
	android:layout_width="fill_parent" 
	android:layout_height="fill_parent"
	android:background="@color/backgroundColor" 
	xmlns:android="http://schemas.android.com/apk/res/android">
 
	<include
        layout="@layout/barreprinc"
        android:id="@+id/barreprinc"
        android:layout_alignParentTop="true" 
	/>
	<LinearLayout 
		android:layout_centerInParent="true"
		android:gravity="center_horizontal"
		android:layout_height="wrap_content"
		android:layout_width="fill_parent">
		<include
			layout="@layout/accueil"
		    android:id="@+id/milieu"
		/>
	</LinearLayout>
    <SlidingDrawer 
    	android:layout_width="fill_parent" 
    	android:id="@+id/slidingDrawer1" 
    	android:layout_height="250dip" 
    	android:handle="@+id/handle" 
    	android:content="@+id/content" 
    	android:layout_alignParentBottom="true"
    	>
        <Button 
        	android:layout_width="fill_parent" 
        	android:text="@string/txtButtonNameSliders" 
        	android:layout_height="wrap_content" 
        	android:id="@+id/handle"
        	android:background="@+drawable/buttonactu">
        </Button>
  		<LinearLayout 
	  		android:id="@+id/content" 
	  		android:layout_width="fill_parent" 
	  		android:layout_height="fill_parent"
	  		android:background="@color/backgroundActu"
  		/>
    </SlidingDrawer>
 
</RelativeLayout>

[Aerinder]

Bonsoir,

Pourquoi ne pas utiliser l'attribut "android:drawableTop" de Button qui permet de placer un drawable au dessus du texte ?

Ensuite pour faire simple un LinearLayout en vertical puis dedans deux LinearLayout en horizontal contenant chacun 2 Button puis jouer sur gravity et layout_gravity des boutons pour les centrer et obtenir le carré.

[toshiro92]

En fait, ce sont les images qui sont les boutons dans cette image, et drawableTop ne fonctionne pas avec. La seule solution serait de mettre des LinearLayout un peu partout en fait avec :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<linearlayout vertical>
   <LinearLayout horizontal>
      <LinearLayout vertical>
       bouton
       texte
      </LinearLayout>
      <LinearLayout vertical>
       bouton
       texte
       </LinearLayout>
    </LinearLayout>
    <LinearLayout horizontal>
      <LinearLayout vertical>
       bouton
       texte
      </LinearLayout>
      <LinearLayout vertical>
       bouton
       texte
       </LinearLayout>
    </LinearLayout>
</LinearLayout>

Un linearlayout dans un linearlayout encore dans un linearlayout, ça ne va pas alourdir l'interface ? Ou réduire les performances ?

[Aerinder]

Que les images soit les boutons ça ne pose pas de problème c'est ce que je disais, l'image de la loupe en drawableTop sur Button et "Recherche" en text, en plus ça alignera le texte sous les images (je prends pour exemple documentation).

Ensuite il suffirait de faire (j'ai pas construit le xml correctement, c'est pour montrer)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<LinearLayout vertical>
    <LinearLayout horizontal>
        <Button drawableTop:loupe text:Recherche />
        <Button drawableTop:libre text:Documentation />
    </LinearLayout>
    <LinearLayout horizontal>
        <Button drawableTop:reunion text:Ens />
        <Button drawableTop:stylo text:Presse />
    </LinearLayout>
</LinearLayout>

Pour la question des LinearLayout en imbrication il suffit de ne pas faire un imbrication de profondeur supérieure à 10 (pas sûr du chiffre), c'est toujours mieux d'alléger mais là ça passe encore.

[Feanorin]

Bonjour,


En supplément de ce que t'as rajouter déjà Aerinder.

Tu peux essayer de regarder du côté des TableLayout et TableRow
http://developer.android.com/referen...bleLayout.html

[toshiro92]

Ta solution est intéressante Aerinder, mais le problème est que cela fait apparaître le bouton gris par défaut d'android, le texte a disparu, et l'icône s'est décuplé, comme ceci :



Uploaded with ImageShack.us

Je n'ai modifié que recherche pour tester, le code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<Button
	android:id="@+id/ButtonRecherche" 
	android:layout_margin="10dip"
	android:drawableTop="@drawable/noun_project_95_loupe"
	android:layout_width="70dip" 
	android:layout_height="70dip" 
	android:text="Recherche"
/>

Je vais voir du côté de TableLayout Feanorin, ça a l'air intéressant, mais c'est vrai que ta solution peut être intéressante Aerinder pour éviter de créer un TextView à chaque fois.

[Aerinder]

Il faut jouer sur les propriétés pour améliorer l'affichage, pour le bouton, il faut mettre background à null.

Pour infos j'ai déjà utilisé ce principe (1 LinearLayout horizontal + 2 LinearLayout vertical contenant chacun 3 Button).
Rendu

Uploaded with ImageShack.us