Transition Android Disegnabile con più elementi

Question

Voglio creare un pulsante in Android con un testo e un'immagine di sfondo. L'immagine di sfondo dovrebbe dissolvenza incrociata ogni volta X.

Ho questo lavoro utilizzando un TransitionDrawable con 2 immagini.

Ma non riesco a farlo funzionare con più di 2 immagini.

quello che ho:

Nel codice Java ho creare un pulsante e impostare uno sfondo (che è un TransitionDrawable definita in XML). E inizio la transizione.

final Button b = new Button(getApplicationContext()); 
b.setTextColor(getResources().getColor(R.color.white)); 
b.setText("Some text"); 
b.setBackgroundDrawable(getResources().getDrawable(R.drawable.tile)); 
StateListDrawable background = (StateListDrawable) b.getBackground(); 
TransitionDrawable td = (TransitionDrawable) background.getCurrent(); 
td.startTransition(2000); 

In XML mi definiscono in tile.xml

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:state_pressed="true" > 
     <shape> 
      <solid 
       android:color="#449def" /> 
     </shape> 
    </item> 
    <item android:drawable="@drawable/transition"> 
     <shape> 
      <solid 
       android:color="#0000ff" /> 
     </shape> 
    </item> 
</selector> 

E infine una transition.xml

<?xml version="1.0" encoding="utf-8"?> 
<transition xmlns:android="http://schemas.android.com/apk/res/android"  android:oneshot="false"> 
    <item android:drawable="@drawable/desert"/> 
    <item android:drawable="@drawable/hydrangeas" /> 
    <item android:drawable="@drawable/jellyfish" /> 
</transition> 

ora è che quando inizio l'applicazione viene mostrata l'immagine del deserto l'effetto . Questa immagine incrocia l'immagine delle ortensie come dovrebbe. Ma l'immagine delle meduse non viene mai mostrata.

Nel documento per TransitionDrawables è indicato che è possibile specificare più di 2 drawable ma non riesco a farlo funzionare.

Ho provato anche questo senza alcun XML, ma in puro Java, ma questo ha dato esattamente lo stesso problema :-(

Answer 1

È possibile farlo utilizzando un gestore

mAnimateImage is your button 

int DrawableImage[] = {R.drawable.back_red, R.drawable.back_green, R.drawable.back_purple}; 

final Handler handler = new Handler(); 
    final int[] i = {0}; 
    final int[] j = {1}; 
    handler.postDelayed(new Runnable() { 
     @Override 
     public void run() { 
      runOnUiThread(new Runnable() { 
       @Override 
       public void run() { 
        Resources res = getApplicationContext().getResources(); 
        TransitionDrawable out = new TransitionDrawable(new Drawable[]{res.getDrawable(DrawableImage[i[0]]), res.getDrawable(DrawableImage[j[0]])}); 
        out.setCrossFadeEnabled(true); 
        mAnimateImage.setBackgroundDrawable(out); 
        out.startTransition(4000); 
        i[0]++; 
        j[0]++; 
        if (j[0] == DrawableImage.length) { 
         j[0] = 0; 
        } 
        if (i[0] == DrawableImage.length) { 
         i[0] = 0; 
        } 
        handler.postDelayed(this, 8000); 
       } 
      }); 
     } 
    }, 0); 

Answer 2

Secondo la documentazione ufficiale, TransitionDrawable può solo dissolvenza incrociata tra 2 strati, citando l'androide ufficiale riferimento.

un'estensione LayerDrawables che è destinato a dissolvenza incrociata tra il primo e secondo strato. per avviare la transizione, chiamare startTransition (int). per visualizzare solo il primo strato, chiamare resetTransition (

Se non lo leggete attentamente, poiché estende LayerDrawables, che può avere più livelli, ci si potrebbe aspettare che si possa dissolvenza incrociata da N livelli. Ma è molto chiaro, startTransition mostra il secondo livello, resetTransition mostra il primo.

Suggerisco di eseguire la propria implementazione per più transizioni. Quello che farei è avere 2 immagini e animarle. Potrebbe essere necessario impostare i drawable a mano, ma dovrebbe essere una parte di codice piuttosto semplice.

Answer 3

in tempo di funzionamento appendice è possibile cambiare le immagini in modo dinamico

Usa td.setDrawableByLayerId (td.getId (1), drawable) sul TransitionDrawable

TransitionDrawable transitionDrawable = (TransitionDrawable) myImage 
          .getDrawable(); 
transitionDrawable.setDrawableByLayerId(transitionDrawable.getId(1), getResources() 
          .getDrawable(R.drawable.c)); 

Answer 4

Si può solo massimo di transizione due immagini con TransitionDrawable. Per lavorare con più di due immagini è possibile estendere LayerDrawable e implementare il proprio TransitionDrawable.

Here's l'implementazione pronta di custom TransitionDrawable per lavorare con più di due immagini.

È possibile visualizzare il campione completo insieme alla demo gif here on Github.