Jump to content

Manipulation MultiTouch d'images


romain31

Recommended Posts

Bonjour,

Nous sommes en train de développer une application android avec en autre la possibilité de manipuler des images avec des actions multi touch (plus d'une pression de doigts sur l'écran).

Notre probleme est que nous ne pouvons pas faire ce que nous voulons avec le widget ImageView car il n'est pas prévu de fonctions pour zoomer ou naviger sur une image.

Nous avons besoin de :

  • Zoom
  • Dezoom
  • Naviguer
  • Rotationner
  • ...

Un peu comme un aperçu standard d'image sous android, mais ce dernier inséré dans notre application.

Quelqu'un sait t-il s'il existe un widget ou une fonction qui permet ces manipulations d'images sous Android ?

Merci d'avance

Link to comment
Share on other sites

Mon besoin exact c'est d'avoir cette manipulation d'image DANS mon application. Il me semble que ta proposition nécéssite d'ouvrir l'application Galerie (pas de l'utiliser dans mon app).

Ce n'est pas le but recherché

Mais merci tout de même de ta contribution

Link to comment
Share on other sites

Qu'entends tu par manipulation d'image?

Si tu as juste besoin de visualiser une image, un appel à l'application Galerie est suffisant.

Et elle paraitra "intégrée" à ton application (un "retour arrière" te ramènera dans ton appli)

Si tu en as besoin très rapidement, tu peux toujours utiliser une ImageView qui occupe la totalité de l'écran.

Mais tu n'aura pas de "contrôle".

C'est déjà bien pour un prototype.

Si tu veux un truc plus complexe... je pense que tu va devoir le faire "à la main" :/

Il n'y a pas à ma connaissance de classe toute faite pour ce genre de chose.

Link to comment
Share on other sites

Bonjour,

J'ai parcouru google et j'ai trouvé cette page j'ai lu seulement la 1ere ligne :

A tween animation can perform a series of simple transformations (position, size, rotation, and transparency) on the contents of a View object.

ICI

Dit moi si cela ta été utile ;)

Link to comment
Share on other sites

Je pense avoir exactement ce que tu recherches. Permet de bouger l'image, la zommer/dézommer avec le multitouch.

package com.android.proto;

import android.app.Activity;
import android.graphics.Matrix;
import android.os.Bundle;
import android.util.FloatMath;
import android.view.MotionEvent;
import android.widget.ImageView;
import android.widget.TextView;

public class Main extends Activity{
/** Called when the activity is first created. */
TextView txtProto;
ImageView view;

static final int NONE = -1;
static final int DRAG = 0;
static final int ZOOM = 1;
int mode = NONE;
float startX = 0;
float startY = 0;

float spacing = 0;
float oldSpacing = 0;

float imgX = 0;
float imgY = 0;

float translateX = 0;
float translateY = 0;

Matrix matrix = new Matrix();
Matrix savedMatrix = new Matrix();
@Override
public void onCreate(Bundle savedInstanceState) {
	super.onCreate(savedInstanceState);
	setContentView(R.layout.main);
	txtProto = (TextView)findViewById(R.id.txtProto);       
	view = (ImageView)findViewById(R.id.imgProto);  
	view.setBackgroundResource(R.drawable.protobc);
}

@Override
public boolean onTouchEvent(MotionEvent event) {
	switch (event.getAction() & MotionEvent.ACTION_MASK) {

	case MotionEvent.ACTION_DOWN:
		savedMatrix.set(matrix);
		startX = event.getX();
		startY = event.getY();
		translateX= 0;
		translateY=0;
		mode = DRAG;
		txtProto.setText("DOWN : "+imgX+";"+imgY);
		break;

	case MotionEvent.ACTION_MOVE:

		if(mode == DRAG){

			matrix.set(savedMatrix);

			translateX = event.getX() - startX;
			translateY = event.getY() - startY;

			matrix.postTranslate(translateX, translateY);

			txtProto.setText("MOVE 1 : "+imgX+";"+imgY);
		}


		if(mode == ZOOM){

			matrix.set(savedMatrix);
			spacing = spacing(event);	
			float scale = spacing/oldSpacing;

			matrix.postScale(scale, scale, imgX, imgY);

			txtProto.setText("MOVE 2 : " + (int)scale+";"+imgX+";"+imgY);
		}

		view.setImageMatrix(matrix);
		break;

	case MotionEvent.ACTION_POINTER_DOWN:		
		startX = event.getX();
		startY = event.getY();

		imgX = imgX+translateX;
		imgY = imgY+translateY;
		oldSpacing = spacing(event);
		mode = ZOOM;
		txtProto.setText("P_DOWN : "+imgX+";"+imgY);
		break;

	case MotionEvent.ACTION_UP:
		savedMatrix.set(matrix);
		imgX = imgX+translateX;
		imgY = imgY+translateY;
		mode = NONE;
		txtProto.setText("UP : ");
		break;

	case MotionEvent.ACTION_POINTER_UP:	
		startX = event.getX(0);
		startY = event.getY(0);
		translateX= 0;
		translateY=0;
		mode = NONE;
		txtProto.setText("P_UP : "+imgX+";"+imgY);
		break;
	default:
		break;
	}


	return super.onTouchEvent(event);
}

private float spacing(MotionEvent event) {
	float x = event.getX(0) - event.getX(1);
	float y = event.getY(0) - event.getY(1);
	return FloatMath.sqrt(x * x + y * y);
}
}

Link to comment
Share on other sites

Bonjour,

je suis un collègue de Romain31. J'ai essayé ton bout de code avec le listener d'events. J'ai relevé 2 petits problèmes :

- je ne peux pas tester le multitouch parce que je suis avec l'émulateur. Alors j'ai essayé de le simuler en mettant des valeurs manuellement au 2ème pointeur mais bon c'est pas très pratique parce que du coup c'est soit je me déplace soit je zoom. Car dès que je maintient le clic, j'insère le 2ème.

- j'ai toujours un problème d'affichage. C'est à dire que j'ai l'impression que les opérations sur la matrice de l'image se fait, mais que l'affichage ne le prend pas en compte.

Dois-je continuer sur cette voie ou connaissez-vous une façon plus simple ?

Merci de ton aide.

Link to comment
Share on other sites

Juste pour vous dire que c'est bon j'y suis arrivé. Merci beaucoup à vous et plus particulièrement à "Cuillère". J'ai utilisé le code que tu m'as passé. J'ai dû faire quelques modifications pour que ça fonctionne dans mon cas mais ça fonctionne pafaitement.

Bonne soirée.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...