Riempimento di due immagini sovrapposte come la barra di ricerca sull'evento di tocco della vista immagine

Question

Ci sono due immagini in nero e blu mentre si tocca sull'immagine blu dovrebbe riempirsi come il progresso, ho ottenuto utilizzando più immagini senza usare la tela ma non ottenendo smoothness al tocco, come 100 Pushups application.

In realtà sto cercando di ottenere un'applicazione simile a 100 Pushups, come ho detto sopra, ho ottenuto uno link ma ho ottenuto utilizzando la tela e voglio ottenere utilizzando Immagini, io Google ma senza fortuna, qualsiasi link o tutorial simili a quella applicazione (100 push-up)?

Answer 1

Ecco qualcosa che ho trovato usando il percorso della clip. Sto usando le seguenti immagini (colori codificatore) da cui lo sfondo è solido e quello in primo piano contiene solo un cerchio blu su sfondo trasparente. La prima immagine di sfondo viene disegnata sullo schermo, quindi il percorso della clip viene impostato in modo tale che l'immagine progressiva, quella in primo piano, sia disegnata correttamente sopra di essa.

Immagine di sfondo; http://i.imgur.com/Sf6kg.png
Immagine in primo piano; http://i.imgur.com/Svtoh.png

E il codice;

private class ProgressView extends View { 

    private Bitmap bgBitmap; 
    private Bitmap fgBitmap; 
    private RectF fullRect = new RectF(); 
    private Path clipPath = new Path(); 

    public ProgressView(Context context) { 
     super(context); 
     bgBitmap = BitmapFactory.decodeResource(
            context.getResources(), R.drawable.bg); 
     fgBitmap = BitmapFactory.decodeResource(
            context.getResources(), R.drawable.fg); 
    } 

    @Override 
    public void onDraw(Canvas c) { 
     fullRect.right = getWidth(); 
     fullRect.bottom = getHeight(); 

     c.drawBitmap(bgBitmap, null, fullRect, null); 

     float angle = SystemClock.uptimeMillis() % 3600/10.0f; 

     clipPath.reset(); 
     clipPath.setLastPoint(getWidth()/2, getHeight()/2); 
     clipPath.lineTo(getWidth()/2, getHeight()); 
     clipPath.arcTo(fullRect, -90, angle); 
     clipPath.lineTo(getWidth()/2, getHeight()/2); 
     c.clipPath(clipPath); 

     c.drawBitmap(fgBitmap, null, fullRect, null); 

     invalidate(); 
    } 
} 

Non dovrebbe essere troppo difficile sostituire le mie immagini temporanee con quelle decenti e aggiornare l'angolo in un modo più appropriato.

Answer 2

Sarà una vista personalizzata, e vi sarà gestire il metodo onTouchEvent() e ridisegna quando l'utente tocca la vista.

Il metodo onDraw() sarà controllando qualcosa di simile:

if(mIsBeingTouched){ 
    //set colour to touched 
} 
doDraw(canvas); 
///.... 

Così, quando l'utente tocca la vista, vorrei incrementare un conteggio e quindi aumentare il numero di arco.

final float arcDistance = mCurrentCount * 3.6; //Based on a max of 100 
canvas.drawArc(mBoundsRectF, 0f, mCurrentCount, mPaint); 

Quindi ciò si basa sul conteggio.