2010-08-25 22 views
14

Come si crea un bordo animato tratteggiato o tratteggiato di una forma arbitraria in Android? In XML (preferito) o programmaticamente.Bordo tratteggiato animato in Android

Vedere l'immagine sotto per un esempio.

alt text

+0

È auspicabile in un dispositivo mobile? Oltre ad essere interessante quanto il tag BLINK, consumerà la carica della batteria. Se si tratta di annunci, non è questo il modo per ottenere clienti felici. –

+0

È auspicabile per il mio caso d'uso. È per un'app di grafica e il bordo di animazione tratteggiato è un simbolo universale per una maschera. Inoltre, non penso che questo mangerà più energia della batteria che dire, uno sfondo dal vivo. – hpique

+0

OK, sospettavo scopi pubblicitari nefandi. Questo è uno scopo ragionevole. –

risposta

18

Hai visto la demo dell'API PathEffects? http://developer.android.com/resources/samples/ApiDemos/src/com/example/android/apis/graphics/PathEffects.html

Produce precisamente una linea animata e puoi semplicemente regolare il percorso fino al bordo della vista per creare un bordo. Ad esempio:

definire un percorso per la forma parametri di visualizzazione/arbitraria:

Path path = new Path(); 
path.addRect(view.getLeft(), view.getTop(), view.getRight(), view.getBottom(), Path.Direction.CW); 

quindi creare una PathEffect tratteggiata con:

PathEffect pe = new DashPathEffect(new float[] {10, 5, 5, 5}, phase); 

Poi impostare collegata con un oggetto Paint e disegnare :

mPaint.setPathEffect(pe); 
canvas.drawPath(path, mPaint); 

MODIFICA: L'effetto animato deriva dal continuo cambiamento della fase e ridisegno. Nella demo API chiama invalidate() nel metodo onDraw() (che attiva onDraw() ...)

+0

Grazie antonyt!Questo e 'esattamente quello che stavo cercando. Peccato che non possa essere definito in xml. – hpique

+1

Un problema con questo è che assegna un sacco di oggetti che attiverà la garbage collection e potrebbe causare la balbuzie dell'animazione. Puoi evitare parte del problema allocando il float [] come membro della classe da qualche parte. Non sei sicuro di come evitare l'allocazione di DashPathEffect ogni volta che la fase cambia, anche se ovviamente puoi gestire l'animazione da solo traducendo le linee. – mwd

+0

È possibile creare un array di DashPathEffects (di dimensioni pari al numero più alto nell'array float, 10 in questo caso) e riutilizzare questi effetti. Almeno questo è quello che sto facendo, ma per l'effetto 'PathDashPathEffect'. –

0

XML ... Io non immagino possibile. Ma puoi usare una vista personalizzata o un SurfaceView e gestire il disegno da solo. Divertiti con questo :)

+0

Eventuali puntatori per implementarlo con una vista personalizzata o SurfaceView? – hpique

+0

è possibile disegnare linee su ogni tela e l'oggetto Paint utilizzato può avere stili diversi. Se cambi tra linea bianca con una linea tratteggiata nera sopra e linea nera con linea tratteggiata bianca sopra ogni fotogramma, dovresti ottenere l'effetto desiderato. – WarrenFaith

0

Potresti usare qualche forma di due immagini a 9patch come cornice per lo sfondo del file immagine che vuoi presentare, una in ciascuno dei due layout. Le immagini differirebbero in termini di posizionamento degli elementi tratteggiati. Scambia rapidamente le viste (potrebbe essere necessario un ritardo) e potresti ottenere l'effetto desiderato. Non so davvero quanto sarebbe efficace in termini di poter consentire all'utente di continuare a utilizzare l'app e masticare la batteria ...

+0

Due 9 immagini patch in un'animazione disegnabile. Potrebbe funzionare, ed è fattibile via XML. Ci proveremo. – hpique

+0

No. Non funziona 9 immagini patch non ripetono i pattern, semplicemente allungano una parte dell'immagine. – hpique

+0

Scusa, quello che stavo ottenendo è che si creano due immagini in formato 9patch. Dovrai creare i modelli da solo ma in modo tale che se tu dovessi passare rapidamente da uno all'altro, creerebbe l'illusione che i trattini si muovessero. – Adriaan

Problemi correlati