Implémentation d'une grille

Version imprimable

12/01/2011, 12h29
Simon MARQUIS

Implémentation d'une grille
Bonjour, voici mon problème, ou plutôt ma question :
Pour ma future application, j'aimerais implémenter une grille.
Je m'explique :
Mon programme me fournit une matrice (de booléens) d'une taille prédéfinie (100 cases * 100 cases) dont je modifierais les valeurs par la suite.
Je voudrais pouvoir afficher cette matrice, et "colorier" les cases true d'une couleur, et les cases fasle d'une autre, et actualiser les couleurs quand bon me semble.

Le seul "petit" problème, c'est que je ne sais pas comment m'y prendre ...
- Créer 100*100 boutons et les colorier ?
- Créer 100*100 vues et les colorier ?
- Existe-t-il un widget grille facilement utilisable ?
- Un Canvas avec un Paint ?
Je pense que ce n'est vraiment pas des bonnes méthodes, alors pouvez-vous m'aider ?
Si possible, j'aimerais que cette implémentation ne soit pas fixe...

Avez vous des idées d'implémentation ?
12/01/2011, 13h13
Feanorin

Salut,

Tu peux utiliser l'objet GridView

http://developer.android.com/resourc...-gridview.html
12/01/2011, 13h22
Simon MARQUIS

Merci de ta réponse rapide.
J'y avais déjà pensé, mais le problème c'est que l'objet gridView est, je crois, "statique".
Je voudrais pouvoir changer la taille de la matrice quand bon me semble, et aussi j'aimerais ne pas avoir à déclarer toutes les cases ...
12/01/2011, 14h01
Feanorin

Citation:

J'y avais déjà pensé, mais le problème c'est que l'objet gridView est, je crois, "statique".

Statisque ??? tu peux définir le layout de la gridview (c'est une grille personnalisable) !

Après tu aura toute la gestion de base des élements graphiques avec cet
objet .

Maintenant si tu veux vraiment personnaliser ton affichage (sans passer par la gridview), tu peux passer par le Canvas et le OnDraw ou tu devras dessiner toute ta grille ainsi que la gestion des évenements lors d'un click de l'utilisateur et l'intéraction avec la grille dessinée.
Tu crées une class qui a une extends de View , et tu pourras dessiner ce que tu veux dans la procédure onDraw via le canvas donnée par celle-ci.

http://developer.android.com/referen...cs/Canvas.html
http://developer.android.com/referen...hics.Canvas%29
12/01/2011, 14h01
MrDuChnok

Salut,

Personnellement, je serais plutôt partit sur le Canvas avec zone "cliquable".
Tu auras ainsi la pleine maitrise de ton espace de dessin, des zones, etc.
12/01/2011, 14h07
Feanorin

Citation:

Personnellement, je serais plutôt partit sur le Canvas avec zone "cliquable".
Tu auras ainsi la pleine maitrise de ton espace de dessin, des zones, etc.

C'est ce que j'aurais fait aussi , mais c'était pour répondre à la question

Citation:

Existe-t-il un widget grille facilement utilisable ?

L'utilisation des canvas implique toute la gestion des Gesture alors que la gridview l'implique directement .
12/01/2011, 14h13
MrDuChnok

Pas de soucis, j'avais compris ta réponse comme ça aussi.:ccool:

L'utilisation des Canvas a l'air de pleinement correspondre à ton besoin initiale (dessin d'une grille de 100x100 cases cliquable). De plus, si tu souhaites la rendre dynamique, cela est faisable.
L'inconvénient majeur de cette solution, c'est qu'elle ne répond peut être pas à ton besoin de "facilement faisable". ;)

Mais on est là pour te filer un coup de main et te guider si tu as besoin.
12/01/2011, 19h27
Simon MARQUIS
Bonsoir, et merci beaucoup pour toutes vos réponses.
Tout d'abord, j'aimerais préciser que je ne suis qu'un débutant sous Android.
J'ai déjà 3ans de java derrière moi, mais je commence seulement avec Android, et apprendre tout seul, c'est pas forcément évident :?

Voila mon avancement :
- 1 Classe Environment qui gère ma grille et ses modifications
- 1 classe Panel extends SurfaceView implements SurfaceHolder.Callback (j'ai trouvé ca sur internet, il parait que la gestion des dessin est améliorée avec ce extends et ce implements)
méthode onDraw() qui dessine les rectangles correspondants aux cases de la grille
- 1 Classe CanvasThread extends Thread (aussi trouvée sur le net, mais je ne sais pas trop à quoi elle sert...)
méthode run()
méthode setRunning()
- 1 Classe main extends Activity implements OnClickListener
méthode onCreate() qui créé les liens avec le fichier xml
- 1 fichier XML main.xml
<RelativeLayout
<package.Panel>
<Button> (Start et Stop)
...
/>

Et voila à quoi ça ressemble pour l'instant, c'est à dire le design auquel j'ai pensé :
Un grille, et toutes sortes de boutons en dessous pour interagir avec la grille

http://data.imagup.com/5/1109529018.jpg

Et voici mes nouvelles questions :P
1. Tout d'abord, ou doit etre stockée la grille, ou plutot l'objet Environment contenant la grille ? (dans la classe main, ou dans Panel ?)
1. La classe CanvasThread est-elle vraiment utile ? et à quoi sert-elle vraiment ?
1. La classe Panel doit elle etre extends de SurfaceView et implements de SurfaceHolder.Callback ? et à quoi servent ces arguments ?
1. L'agencement du fichier XML est-il correct ?
1. Comment mettre en pause le onDraw() lorsque je clique sur le bouton pause ? et le relancer en cliquant sur resume ?
  Car avec ma méthode, j'arrive à mettre en pause et reprendre en ajoutant un if dans le onDraw(). Cependant, lorsqu'il est en pause, l'image "clignote" entre la grille au temps t et la grille au temps t-1... (c'est très gênant)
1. Qu'entendez vous par cases "cliquables" ?
Je sais que ça fait beaucoup de questions d'un coup, mais je ne trouve pas les réponses ni sur internet, ni sur les forums... et vu que votre forum a l'air très réactif
alors j'en profite ;)
13/01/2011, 10h24
Feanorin

Citation:

Tout d'abord, ou doit etre stockée la grille, ou plutot l'objet Environment contenant la grille ? (dans la classe main, ou dans Panel ?)

Euh , dans l'environnent ...

Citation:

Classe CanvasThread extends Thread (aussi trouvée sur le net, mais je ne sais pas trop à quoi elle sert...)

Ca il faut voir ce qui se passe dans le run du thread .

Citation:

La classe Panel doit elle etre extends de SurfaceView et implements de SurfaceHolder.Callback ? et à quoi servent ces arguments ?

Cela te permet de gérer l'interface , si tu veux meiux comprendre l'utilité de ces objets regarde du coté de l'objet Camera

http://developer.android.com/resourc...raPreview.html

Citation:

L'agencement du fichier XML est-il correct ?

Compliqué comme ça sans voir le code !!! regarde des exemples.

http://developer.android.com/guide/t...-resource.html

Citation:

Comment mettre en pause le onDraw() lorsque je clique sur le bouton pause ? et le relancer en cliquant sur resume ?
Car avec ma méthode, j'arrive à mettre en pause et reprendre en ajoutant un if dans le onDraw(). Cependant, lorsqu'il est en pause, l'image "clignote" entre la grille au temps t et la grille au temps t-1... (c'est très gênant)

clignote ??? , il te suffit de figer l'écran soit de dessiner la même chose lorsque tu es en pause . il me semble .

Citation:

Qu'entendez vous par cases "cliquables" ?

Ben comme tu utilises les canvas il va falloir que tu créer ces zones cliquables . Pour cela il faut que tu implementes les Gestures sur ta View , et en fonction de la zone cliqué que tu la fasses correspondre avec le bouton associé avec cette zone .

Citation:

Envoyé par Feanorin

Euh , dans l'environnent ...

^^ je pense que je me suis mal exprimé... Dans la classe Environment, j'ai un attribut qui correspond à la grille. Du coup, pour créer qqch, je créé tout d'abord un Environment (qui contient la grille). Mais où dois-je déclarer cette création ? (le new Environment()), dans la classe main, (qui correspond à mon Activity, ou dans la classe View ?

Citation:

Envoyé par Feanorin

Ca il faut voir ce qui se passe dans le run du thread .
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 public void run() { Canvas c; while (_run) { c = null; try { c = _surfaceHolder.lockCanvas(null); synchronized (_surfaceHolder) { _panel.onDraw(c); } } finally { if (c != null) { _surfaceHolder.unlockCanvasAndPost(c); } } } }
D'après ce que je comprend, c'est elle qui commande à Panel de se mettre à jour en continu.
Mais cette classe est-elle vraiment utile pour ce que je veux faire ?

Citation:

Envoyé par Feanorin

Cela te permet de gérer l'interface , si tu veux meiux comprendre l'utilité de ces objets regarde du coté de l'objet Camera

Je ne pense pas avoir besoin de gérer l'interface... je me trompe peut être, mais ça m'a l'air compliqué pour pas grand chose finalement.

Citation:

Envoyé par Feanorin

clignote ??? , il te suffit de figer l'écran soit de dessiner la même chose lorsque tu es en pause . il me semble .

Oui Oui quand je met en pause ça clignote :mouarf:! Enfin ça clignote sur l'émulateur, et quand je teste sur mon tél, la grille courante est affichée normalement, mais la grille suivant ou précédente vient aussi s'afficher (mais en bleu à moitié transparent :?)
Bizarre, vous avez dis bizarre ? Peut être que je m'y prend mal pour mettre en pause.

Ma méthode pour mettre en pause est la suivante :

J'ai deux boutons avec listeners. Lors d'un clique sur l'un d'eux, la méthode suivante est appelée :

Code:

surface.setRunning(true/false);

surface correspond à la vue décrite dans la classe Panel
Code:

1 2 3 public void setRunning(boolean b){ isRunning=b; }
isRunning est un attribut de la vue.
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 public void onDraw(Canvas canvas) { if(isRunning){ // dessine les cases de la grille for (int h = 0; h < NB_CELLS; h++) { for (int w = 0; w < NB_CELLS; w++) { if (environment.grid[h][w]) { //dessine la case en bleu canvas.drawRect(w * CELL_SIZE + 1, h * CELL_SIZE + 1, (w * CELL_SIZE) + (CELL_SIZE - 1), (h * CELL_SIZE) + (CELL_SIZE - 1), cell); } else{ //dessine la case en noir canvas.drawRect(w * CELL_SIZE + 1, h * CELL_SIZE + 1, (w * CELL_SIZE) + (CELL_SIZE - 1), (h * CELL_SIZE) + (CELL_SIZE - 1), background); } } } environment.suivant(); //modifie la grille contenue dans l'objet environment } }

17/01/2011, 15h34
Feanorin

Citation:

^^ je pense que je me suis mal exprimé... Dans la classe Environment, j'ai un attribut qui correspond à la grille. Du coup, pour créer qqch, je créé tout d'abord un Environment (qui contient la grille). Mais où dois-je déclarer cette création ? (le new Environment()), dans la classe main, (qui correspond à mon Activity, ou dans la classe View ?

Je dirais dans la view , il me semble que l'objet est lié à celle ci .

Citation:

D'après ce que je comprend, c'est elle qui commande à Panel de se mettre à jour en continu.
Mais cette classe est-elle vraiment utile pour ce que je veux faire ?

Oui il appelle la procédure onDraw , ce qui permet de faire un update.

Est ce utile ? cela te permet d 'avoir l'affichage dans un thread ce qui ne bloquera pas l'application, maintenant , tu peux toujours passer dans la view est faire un refresh() , la meilleure solution dépendra du rythme de rafraichissement que tu fera , si le rythme est trop important (style camera) je te conseille de rester sur le thread avec le surfaceholder .

Citation:

Je ne pense pas avoir besoin de gérer l'interface... je me trompe peut être, mais ça m'a l'air compliqué pour pas grand chose finalement.

(voir ci dessus)
Désolé ma précision était un peu trop succincte , mais le surface holder est un bon moyen de gérer les rafraîchissement d'une vue , essaye de voir si tu le souhaites par la view , mais la je ne sais pas ce que cela va donner , le mieux est d'essayer les deux et de voir le meilleur rendement .

Citation:

Oui Oui quand je met en pause ça clignote ! Enfin ça clignote sur l'émulateur, et quand je teste sur mon tél, la grille courante est affichée normalement, mais la grille suivant ou précédente vient aussi s'afficher (mais en bleu à moitié transparent )
Bizarre, vous avez dis bizarre ? Peut être que je m'y prend mal pour mettre en pause.

C'est bien ce que j'expliquais , quand tu met en pause l'affichage , le onDraw ne doit pas être bloquer , mais il doit dessiner le même canvas qu' ultérieurement .

Euh juste pour savoir la méthode onDraw appartient à _onpanel , cet objet est bien extends de View non ? si c'est le cas tu dois faire un super.onDraw(canvas) .

C'est tout bon, j'ai réussi à stopper le clignotement.

Mais plus j'avance, plus je me retrouve face à des nouveaux problèmes.
Et je pense pas que re-créer un post serait utile...donc je vais poster ici :

Mon activity principale fonctionne bien.
J'ai créé un optionsMenu avec des éléments, jusque ici tout va bien.
Lorsque je clique sur un élément, je démarre une nouvelle activity

Code:

1
2
Intent i = new Intent(this, PatternsActivity.class);
			this.startActivity(i);

Cette nouvelle activity correspond à une listView personalisée, avec une image et deux TextView.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
public class PatternsActivity extends Activity {
 
	private ListView maListViewPerso;
 
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.patterns_layout);
 
        maListViewPerso = (ListView) findViewById(R.id.listviewperso);
 
//Puis tout le bla bla de création des éléments
//et un setOnItemClickListener
//et puis enfin un SimpleAdapter utilisant le layout pattern_item.xml
 
 SimpleAdapter mSchedule = new SimpleAdapter (this.getBaseContext(), listItem, R.layout.pattern_item,
               new String[] {"img", "titre", "description"}, new int[] {R.id.img, R.id.titre,R.id.description});
}
}

Avec ce XML :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
 
    <ListView
        android:id="@+id/listviewperso"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
      />
 
</LinearLayout>

Et celui ci

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
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    >
 
    <ImageView
		android:id="@+id/img"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
	   	android:layout_gravity="center_vertical"
	   	android:padding="10px"
		/>
 
	<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	    android:orientation="vertical"
	    android:layout_width="fill_parent"
	    android:layout_height="wrap_content"
	   	android:layout_gravity="center_vertical"
	   	android:paddingLeft="10px"
	    android:layout_weight="1"
	    >
 
	    <TextView android:id="@+id/titre"
	         android:layout_width="fill_parent"
	         android:layout_height="fill_parent"
	         android:textSize="16px"
	         android:textStyle="bold"
	         />
 
	    <TextView android:id="@+id/description"
	         android:layout_width="fill_parent"
	         android:layout_height="fill_parent"
	         />
 
    </LinearLayout>
 
</LinearLayout>

Mais ce que je n'arrive pas à faire c'est que :
- lorsque je clique sur le bouton retour dans la listView, j'aimerais retourner à l'activité principale (le problème c'est que l'application bug et quitte)

- lorsque je clique sur un élément, j'aimerai retourner à l'activity principale en lui passant le nom de l'élément en paramètre. (Mais lorsque je le fais, la listView ne disparait pas...) il faut certainement utiliser startActivityForResult() mais je n'y arrive pas

- une derniere : la création de la listView est très lente, est-ce normal ?

24/01/2011, 10h57
MrDuChnok

Salut,

Pour fermer ton activité courante tu peux utiliser le "finish". Cette méthode ferme ton activité en cours, et remet au premier plan la dernière activité (donc la précédente dans ton cas).
Tu peux également utilisé le setResult si tu veux stocker des valeurs à retransmettre à l'activité appelante.

Si tu n'arrives pas à l'implémenter, poste ici le code que tu as déjà réalisé pour appeler / attendre le retour de ton activité fille.

Sinon concernant les lenteurs sur les listview, il faudrait en savoir plus :
- c'est un adapter perso ou générique que tu utilises ?
- ta liste est grande ?
- etc.

Finalement j'ai changé d'optique :

J'ai créé une nouvelle activity simple avec un xml du style :
Et le onClick() qui fait le boulot, suivit du finish()
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 <?xml version="1.0" encoding="utf-8"?> <ScrollView> <TableLayout> <TableRow> <ImageView></ImageView> <Button></Button> </TableRow> <TableRow> <ImageView></ImageView> <Button></Button> </TableRow> ... ... </ScrollView>
Je trouve que c'est plutôt facile de rajouter ou changer des items avec ce style d'organisation.
Est-ce déconseillé ?

Autre chose, voici comment est déclarée l'activity dans le manifest :
Code:

1 2 3 <activity android:name=".AboutActivity" android:label="@string/about_text" android:theme="@android:style/Theme.Dialog"> </activity>
J'utilise par défaut le style Theme.Dialog
Mais en existe-t-il d'autres ? Je n'ai pas trouvé d'info là dessus sur le net