Avis jeux grattage

Version imprimable

26/11/2012, 09h56
jojo_ol76

Avis jeux grattage

Bonjour,

Je souhaiterais afficher des cases dont lesquels on devra gratter dessus pour afficher les symboles et savoir si on a gagné mais je ne sais pas quel biais technique dois je passer.

Est-ce avec des boutons puis une animation qui fait apparaitre ce qu'il a dedans ou une view avec la gestuelle qui est gérer sur cette vue?

Merci pour vos idées.
26/11/2012, 10h13
Hephaistos007
A vue de nez, je dirais :
- Une View redéfinissant onDraw() pour dessiner les cases et les symboles dans ces cases
- Une SurfaceView par dessus qui dessine des rectangles opaques uniquement aux niveaux des cases (transparent pour le reste).
- Un GestureOverlayView pour que les mouvements du doigt de l'utilisateur efface les rectangles opaques (avec un truc du genre Canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR))
Il y a aussi des notions de synchronisation et de verrouillage/déverrouillage du Canvas.

Bref, du travail en perspective... :ccool:
26/11/2012, 12h28
hotcryx

ouep des calques et la gestion de la transparence.

J'ai utilisé ce code pour déterminer la couleur de chaque pixel puis de changer sa valeur lors de l'appuie sur l'écran mais aucun effet visuel, d'où pourrais venir le problème?

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
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
 
 
public class TouchView extends ImageView {
 
 
	Bitmap bitmap;
	 double bmWidth, bmHeight; 
 
	 public TouchView(Context context) {
	  super(context);
	  // TODO Auto-generated constructor stub
	  init();
	 }
 
	 public TouchView(Context context, AttributeSet attrs) {
	  super(context, attrs);
	  // TODO Auto-generated constructor stub
	  init();
	 }
 
	 public TouchView(Context context, AttributeSet attrs, int defStyle) {
	  super(context, attrs, defStyle);
	  // TODO Auto-generated constructor stub
	  init();
	 }
 
	 private void init(){
 
	  bitmap = ((BitmapDrawable)getBackground()).getBitmap();
	  bmWidth = (double)bitmap.getWidth();
	  bmHeight = (double)bitmap.getHeight();
	 }
 
	 @Override
	 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
	  // TODO Auto-generated method stub
	  setMeasuredDimension(MeasureSpec.getSize(widthMeasureSpec),
	       MeasureSpec.getSize(heightMeasureSpec));
	 }
 
	 @Override
	 public boolean onTouchEvent(MotionEvent event) {
	  // TODO Auto-generated method stub
 
 
	  switch(event.getAction()){
	  case MotionEvent.ACTION_DOWN:
	  case MotionEvent.ACTION_MOVE:
	   float x = event.getX();
	   float y = event.getY();
 
	   int color = getColor(x, y);
	      ((ALessonsArabicMainActivity)getContext()).updateMsg("Touched@" + x + " : " + y, color);
 
	   break;
	  case MotionEvent.ACTION_UP:
	   ((ALessonsArabicMainActivity)getContext()).updateMsg("", 0);
	   break;
	  }
 
	  return true;
	 }
 
	 private int getColor(float x, float y){
 
	  if ( x < 0 || y < 0 || x > (float)getWidth() || y > (float)getHeight()){
	   return 0; //Invalid, return 0
	  }else{
	   //Convert touched x, y on View to on Bitmap
	   int xBm = (int)(x * (bmWidth / (double)getWidth()));
	      int yBm = (int)(y * (bmHeight / (double)getHeight()));
	      Bitmap mutableBitmap = Bitmap.createBitmap(bitmap.getWidth(),
	    		  bitmap.getHeight(), Bitmap.Config.ARGB_8888);
	      mutableBitmap.setPixel(xBm, yBm, 255);
 
	      setImageBitmap(mutableBitmap);
	   return bitmap.getPixel(xBm, yBm);
	  }
 
	 }
}

J'ai testé avec les calques mais la transparence ne marche pas lors de l'appuie sur la view, en fait j'affiche l'image qui s'affichera dès lors qu'on aura gratté, puis par dessus une image dont lequel on peut dessinner, ainsi lors du grattage je souhaiterais vérifier que lorsque un certain nombre de pixel apparaissent en clair je peux effectuer une action Y:

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
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
 
private Bitmap mBitmap;
	private Canvas mCanvas;
	private Path mPath;
	private Paint mBitmapPaint;
	private Paint mPaint;
 
	public CaseView(Context c) {
		super(c);
 
		mPaint = new Paint();
		mPaint.setAntiAlias(true);
		mPaint.setDither(true);
		mPaint.setStyle(Paint.Style.STROKE);
		mPaint.setStrokeWidth(40);
 
		// creation d'un carré de couleur grisatre
		mBitmap = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
		for (int i = 0; i < 100; i++) {
			for (int j = 0; j < 100; j++) {
				mBitmap.setPixel(i, j, Color.GRAY);
			}
 
		}
		mCanvas = new Canvas(mBitmap);
		mPath = new Path();
		mBitmapPaint = new Paint(Paint.DITHER_FLAG);
 
	}
 
	@Override
	protected void onSizeChanged(int w, int h, int oldw, int oldh) {
		super.onSizeChanged(0, 0, oldw, oldh);
 
	}
 
	@Override
	protected void onDraw(Canvas canvas) {
 
		canvas.drawRect(100, 100, 200, 200, mBitmapPaint);
		canvas.drawPath(mPath, mPaint);
 
		Bitmap _scratch = BitmapFactory.decodeResource(getResources(),
				R.drawable.ic_launcher);
		canvas.drawColor(Color.WHITE);
 
		// logo
		canvas.drawBitmap(_scratch, 0, 100, null);
 
 
//affichage des pixels en clair lors de l'appuie sur pixel x/y
		for (int i = 0; i < 100; i++) {
			for (int j = 0; j < 100; j++) {
				if ((mX < 100 && mX >= 0) && (mY < 100 && mY >= 0)) {
 
					mBitmap.setPixel((int) mY,(int) mX,  Color.TRANSPARENT);
				}
			}
 
		}
		canvas.drawBitmap(mBitmap, 0, 100, mBitmapPaint);
 
		Bitmap mutableBitmap = Bitmap.createBitmap(_scratch.getWidth(),
				_scratch.getHeight(), Bitmap.Config.ARGB_8888);
		mutableBitmap.setPixel(50, 50, 124);
		canvas.drawBitmap(mutableBitmap, 0, 100, null);
		int pixelColor = mBitmap.getPixel(50, 50);
		int red = Color.red(pixelColor);
		int green = Color.green(pixelColor);
		Log.v("red", "red:" + red + " /green:" + green);
 
 
	}
 
 
	private float mX, mY;
	private static final float TOUCH_TOLERANCE = 4;
 
	private void touch_start(float x, float y) {
		mPath.reset();
		mPath.moveTo(x, y);
		mX = x;
		mY = y;
	}
 
	private void touch_move(float x, float y) {
		float dx = Math.abs(x - mX);
		float dy = Math.abs(y - mY);
		if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
			mPath.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
			mX = x;
			mY = y;
		}
	}
 
	private void touch_up() {
		mPath.lineTo(mX, mY);
		// commit the path to our offscreen
		mCanvas.drawPath(mPath, mPaint);
		// kill this so we don't double draw
		mPath.reset();
	}
 
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		float x = event.getX();
		float y = event.getY();
		Log.v("onTouchEvent", "x:" + x + "/y:" + y);
 
		switch (event.getAction()) {
		case MotionEvent.ACTION_DOWN:
			touch_start(x, y);
			invalidate();
			break;
		case MotionEvent.ACTION_MOVE:
			touch_move(x, y);
			invalidate();
			break;
		case MotionEvent.ACTION_UP:
			touch_up();
			invalidate();
			break;
		}
		return true;
	}

11/12/2012, 14h19
jojo_ol76

Je souhaiterais mettre 3 View (CaseView) sur un Layout, comment faire?

Merci.
18/12/2012, 15h30
jojo_ol76

Je souhaite afficher 9 cases dont lequel on pourra gratter, comment faire?
19/12/2012, 16h14
hotcryx

Citation:

Envoyé par jojo_ol76

Je souhaite afficher 9 cases dont lequel on pourra gratter, comment faire?

Tu dois utiliser un TableLayout pour aligner les colonnes
23/12/2012, 21h35
jojo_ol76
Oui mais le bitmap s'affiche avec
Code:

1 2 canvas.drawBitmap(mBitmap, 0, positionTop, mBitmapPaint);
Comment faire à ce qu'il ne tienne pas compte de la positionTop dans un tablelayout?
07/01/2013, 23h28
Feanorin

Citation:

Comment faire à ce qu'il ne tienne pas compte de la positionTop dans un tablelayout?

Il te suffit de pas mettre le paramètre lors de l'appel ou alors j'ai pas compris la question :roll:

Code:

canvas.drawBitmap(mBitmap, 0, positionTop, mBitmapPaint);