JavascriptProva

sabato 25 giugno 2016

Disegnare forme con il Canvas e il Paint

Per cercare di rifare l'immagine di un bersaglio sulla mia App, devo vedere come sia possibile disegnare forme sul display e come eventualmente far sì che siano associate ad eventi.
Vediamo un po' come si fa, al solito modo estremamente pratico.

Si crea una classe che estende View. Provo a crearla come classe nidificata nell'Act.
 public class CustomView extends View{

  public CustomView(Context context) {
   super(context);
  }
  
 }


Per prima cosa, dobbiamo creare un Paint, dichiarato come variabile privata:
 public class CustomView extends View{

  private Paint paint;
  public CustomView(Context context) {
   super(context);
   paint=new Paint();
  }
  
 }
Quindi al Paint si attribuisce un colore:
 public class CustomView extends View{

  private Paint paint;
  public CustomView(Context context) {
   super(context);
   paint=new Paint();
   paint.setColor(Color.GREEN);
  }
  
 }
Non ho risolto nulla, finora, però.
Vediamo il resto...

C'è lo "sfondo", adesso: Paint è solo il pennello, mentre in onDraw si definisce lo sfondo.
onDraw ha per parametro questo sfondo, che è il Canvas:
  @Override
  protected void onDraw(Canvas canvas){
   super.onDraw(canvas);
  }
Praticamente questo sarebbe l'evento mediante il quale la View viene disegnata, e ha come parametro la tela su cui si esegue il disegno.
Viene disegnato lo sfondo tramite un colore, mentre per ciò che sta sullo sfondo si usa il pennello paint.
Questa descrizione...pittoresca dovrebbe essere abbastanza adeguata, ammesso che abbia capito bene.
  @Override
  protected void onDraw(Canvas canvas){
   super.onDraw(canvas);
   canvas.drawColor(Color.RED);
   canvas.drawCircle(200, 200, 100, paint);
  }
Ecco, adesso monto la view dandole delle dimsneioni precise:
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  RelativeLayout mainLayout=(RelativeLayout)findViewById(R.id.mainLayout);
  View v=new CustomView(this);
  mainLayout.addView(v);
  v.getLayoutParams().width=300;
  v.getLayoutParams().height=300;

  

 }
Ed ecco:



Non difficile, in fondo.
Ora elimino il colore di sfondo e vediamo se ottengo solo un cerchio verde:
  @Override
  protected void onDraw(Canvas canvas){
   super.onDraw(canvas);
   
   canvas.drawCircle(100, 100, 100, paint);
  }




Perfetto!

Nessun commento:

Posta un commento