JavascriptProva

mercoledì 25 maggio 2016

Esercizi con il codice per muovere le immagini

Memorizzo qui il codice:

public class Immagine extends View{
 private float bordo=50f;
 private float X,Y;
 int activePointerIndex=0;;
 int activePointerId=0;
 private Drawable mImage;
 private float posX,posY;
 private float lastX,lastY;
 private ScaleGestureDetector SGD;
 private float scale=1;
 
 public Immagine(Context context) {
  super(context);
  setBackgroundColor(Color.BLACK);
  mImage=getResources().getDrawable(R.drawable.facciadaculo);
  mImage.setBounds(0, 0, mImage.getIntrinsicHeight(), mImage.getIntrinsicHeight());
  SGD=new ScaleGestureDetector(context,new ScaleListener());
 }
 
 @Override
 public boolean onTouchEvent(MotionEvent event){
  SGD.onTouchEvent(event);
  int action=event.getAction() & MotionEvent.ACTION_MASK;
  
  switch(action){
  case MotionEvent.ACTION_DOWN:
   X=event.getX();
   Y=event.getY();
   lastX=X;
   lastY=Y;
   activePointerId=event.getPointerId(0);
   break;
  case MotionEvent.ACTION_MOVE:
   activePointerIndex=event.findPointerIndex(activePointerId);
   X=event.getX(activePointerIndex);
   Y=event.getY(activePointerIndex);
   posX+=(X-lastX);
   posY+=(Y-lastY);
   invalidate();
   lastX=X;
   lastY=Y;
   break;
  case MotionEvent.ACTION_POINTER_UP:
   int oldPointerIndex=(event.getAction() & MotionEvent.ACTION_POINTER_INDEX_MASK)>>MotionEvent.ACTION_POINTER_INDEX_SHIFT;
   int oldPointerId=event.getPointerId(oldPointerIndex);
   if(oldPointerId==activePointerId){
    int newPointerIndex=oldPointerIndex==0? 1:0;
    lastX=event.getX(newPointerIndex);
    lastY=event.getY(newPointerIndex);
    activePointerId=event.getPointerId(newPointerIndex);
   }
   break;
  }

  
  
  return true;
 }
 
 

    @Override
    public void onDraw(Canvas canvas) {
        super.onDraw(canvas);
     
     
        canvas.save();
        canvas.translate(posX,posY);
        canvas.scale(scale, scale);
        mImage.draw(canvas);
        canvas.restore();
    }
    
    class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener{
     @Override
     public boolean onScale(ScaleGestureDetector SGD){
      scale*=SGD.getScaleFactor();
      invalidate();
   return true;
      
     }
    }

}
e mi esercito a riscriverlo da capo.

Ecco: primo punto di dubbio. Cosa si inserisce nel costruttore?
Ovviamente, la risorsa da caricare, più le dimensioni dell'immagine.
Ecco, si usa un Drawable.
public class Immagine extends View{

 private Drawable mImage;
 public Immagine(Context context) {
  super(context);
  mImage=getResources().getDrawable(R.drawable.facciadaculo);
  mImage.setBounds(0,0,mImage.getIntrinsicWidth(),mImage.getIntrinsicHeight());
  
 }
 
 
}
Tutto qui quello che è minimamente necessario.
Il resto sarà aggiunta di dopo.
Una volta fatto questo, si va all'evento onTouchEvent.

Ma manca una cosa fondamentale: l'evento onDraw!
Studiamocelo un po'...

Quello è il minimo necessario per mettere a video l'immagine.
 @Override
 public void onDraw(Canvas canvas){
  super.onDraw(canvas);
  canvas.save();
  mImage.draw(canvas);
  canvas.restore();
  
 }
E in effetti questo è sufficiente per mostrare l'immagine!
Mandala! Cancello e poi riscrivo.
public class Immagine extends View{

 private Drawable mImage;
 public Immagine(Context context) {
  super(context);
  mImage=getResources().getDrawable(R.drawable.facciadaculo);
  mImage.setBounds(0,0,mImage.getIntrinsicWidth(),mImage.getIntrinsicHeight());
 }
 
 @Override
 public void onDraw(Canvas canvas){
  super.onDraw(canvas);
  canvas.save();
  mImage.draw(canvas);
  canvas.restore();
 }
 
}
Ecco, il codice riscritto da me a memoria funziona!
Ora dobbiamo aggiungere onTouchEvent.

 @Override
 public boolean onTouchEvent(MotionEvent event){
  float X,Y;
  float lastX=0,lastY=0;
  int action=event.getAction() & MotionEvent.ACTION_MASK;
  switch(action){
  case MotionEvent.ACTION_DOWN:
   X=event.getX();
   Y=event.getY();
   lastX=X;
   lastY=Y;
   break;
  case MotionEvent.ACTION_MOVE:
   X=event.getX();
   Y=event.getY();
   posX+=(X-lastX);
   posY+=(Y-lastY);
   invalidate();
   lastX=X;
   lastY=Y;
   break;
  }
  
  return true;
  
 }
Questo è stato un codice fallimentare!
Non posso dichiarare le variabili come variabili locali nel contesto di un metodo.
Ottengo un'immagine che vola via a una velocità pazzesca!
Dichiarandole all'inizio, alla dichiarazione della classe Immagine, ottengo il risultato voluto:
public class Immagine extends View{

 private Drawable mImage;
 float X,Y;
 float lastX=0,lastY=0;
 float posX=0,posY=0;
 public Immagine(Context context) {
  super(context);
  mImage=getResources().getDrawable(R.drawable.facciadaculo);
  mImage.setBounds(0,0,mImage.getIntrinsicWidth(),mImage.getIntrinsicHeight());
 }

Un altro "mandala" lo facciamo?...

E dai!
public class Immagine extends View{

 float X,Y,lastX,lastY,posX,posY;
 Drawable mImage;
 public Immagine(Context context) {
  super(context);
  mImage=getResources().getDrawable(R.drawable.facciadaculo);
  mImage.setBounds(0,0,mImage.getIntrinsicWidth(),mImage.getIntrinsicHeight()); 
 }
 
 @Override
 public boolean onTouchEvent(MotionEvent event){
  
  switch(event.getAction() & MotionEvent.ACTION_MASK){
  case MotionEvent.ACTION_DOWN:
   X=event.getX();
   Y=event.getY();
   lastX=X;
   lastY=Y;
   break;
  case MotionEvent.ACTION_MOVE:
   X=event.getX();
   Y=event.getY();
   posX+=(X-lastX);
   posY+=(Y-lastY);
   invalidate();
   lastX=X;
   lastY=Y;
   break;
  }
  return true;
  
 }
 
 
 @Override
 public void onDraw(Canvas canvas){
  super.onDraw(canvas);
  
  canvas.save();
  canvas.translate(posX,posY);
  mImage.draw(canvas);
  canvas.restore();
 }
}
Perfetto... qualche piccola dimenticanza, come quella del metodo translate del canvas, ma niente di più!

Nessun commento:

Posta un commento