[RelativeLayout] Problème de positionnement

Version imprimable

Bonsoir,

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

http://img594.imageshack.us/img594/5746/sansreid.png

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:

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>

08/06/2011, 23h13
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é.

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:

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 ?

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:

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.

09/06/2011, 12h11
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

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 :

http://img685.imageshack.us/img685/1189/sansre2tm.png

Uploaded with ImageShack.us

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

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.

09/06/2011, 14h08
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 http://img121.imageshack.us/img121/3637/homech.png

Uploaded with ImageShack.us
09/06/2011, 14h26
toshiro92

J'ai maintenant la configuration que je souhaitais, en revanche, Je ne peux pas mettre la taille que je souhaite sur mes images-bouton, vu que le texte est effacé ou coupé si je ne met pas une taille minimum (ici 120dip, alors que j'aimerais plutôt du 80 90). Quelle est la solution pour que cela reste fixe, ou mieux, que la taille réelle de l'image reste d'origine ?
09/06/2011, 14h48
Feanorin

Bonjour,

Citation:

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.

Si tu utilises TableLayout, c'est pour éviter d'avoir à imbriquer les LinearLayout que t'as proposé Aerinder .
09/06/2011, 16h50
toshiro92

C'est vrai que les deux solutions sont bonnes, après il est vrai que cela m'embete de ne pas pouvoir mieux gérer la taille des boutons sans poser un conflit (méthode d'Aerinder). J'essayerai le TableLayout après pourquoi pas.