2013-03-27 31 views
12

Chcę utworzyć przycisk w Androidzie z tekstem i obrazem tła. Obraz tła powinien przemieszać się co X czas.Android TransitionDrawdopodobne z wieloma elementami

Mam to działa przy użyciu TransitionDrawable z 2 obrazów.

Ale nie mogę tego zrobić z więcej niż 2 obrazami.

Co mam:

W kodzie Java utworzyć przycisk i ustawić tło (co jest TransitionDrawable zdefiniowane w formacie XML). I zaczynam przejście.

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); 

W XML zdefiniować w 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> 

i wreszcie 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> 

Teraz efekt jest, że kiedy uruchomić aplikację obraz pustyni pokazano . Ten obrazek przenosi się do obrazu hortensji tak, jak powinien. Ale obraz meduzy nigdy nie jest pokazywany.

W dokumencie dla TransitionDrawables stwierdza się, że można podać więcej niż 2 rysunki, ale nie mogę tego uruchomić.

Próbowałem też to bez XML, ale w czystej JAVA ale to dało dokładnie ten sam problem :-(

+0

* W doc dla TransitionDrawables stwierdzono, że można podać więcej niż 2 kanału alfa * - można podać link do miejsca, gdzie to jest powiedziane? – Luksprog

+0

http://developer.android.com/reference/android/graphics/drawable/TransitionDrawable.html#TransitionDrawable (android.graphics.drawable.Drawable []) Oznacza to, że "co najmniej 2 warstwy są wymagane do tego losowania do działa poprawnie. ". Tak jak napisano w moim oryginalnym wpisie, wypróbowałem również wszystko w czystym kodzie Java (w ten sposób działając w sposób zgodny z tym konstruktorem), ale miał dokładnie ten sam problem. – Knarf

+1

Zły wybór słów. Właśnie patrzyłem na kod 'TransitionDrawable' i tylko znika między dwoma rysunkami, każda druga warstwa jest ignorowana. – Luksprog

Odpowiedz

3

Można to zrobić za pomocą funkcji obsługi

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); 
+0

Idealny! Tylko jedno - z powodu przestarzałości, rozważ zastąpienie getDrawable przez ContextCompat.getDrawable –

+0

yes thanx @MohitSingh –

6

Według oficjalnej dokumentacji, TransitionDrawable może tylko cross-Fade między 2 warstwy, cytując z oficjalnego Androida odniesienie.

przedłużenie LayerDrawables, który jest przeznaczony do sieciowania przejść między pierwszej i drugiej warstwy. aby uruchomić przejścia wywołać startTransition (int). aby wyświetlać tylko pierwsza warstwa, połączenia resetTransition ()

Jeśli nie przeczytasz go uważnie, ponieważ rozszerza LayerDrawables, który może mieć wiele warstw, można oczekiwać, że możesz przejść z N warstw. Ale jest bardzo jasne, startTransition pokazuje drugą warstwę, resetTransition pokazuje pierwszą.

Sugeruję wykonanie własnej implementacji dla wielu przejść. Chciałbym mieć 2 obrazy i animować je. Może być konieczne ręczne ustawienie rysunków, ale powinien to być całkiem prosty fragment kodu.

+0

Właściwie to, co dzieje się dla mnie, to to, że gra pierwszą karę przejściową, a kiedy ponownie zadzwonię do startTransition, przeskakuje do pierwszego losowania i przechodzi z powrotem do drugiego. – CaseyB

+2

Masz rację! Przejrzałem dokumentację i zaktualizowałem odpowiedź. Udokumentowano, że działa tylko z 2 warstwami. – shalafi

4

w dodatku czas pracy można dynamicznie zmieniać obrazki

Zastosowanie td.setDrawableByLayerId (td.getId (1), rozciągliwej) na TransitionDrawable

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

można tylko maksymalnie przejściowy dwa obrazy z TransitionDrawable. Aby pracować z więcej niż dwoma obrazami, możesz rozszerzyć LayerDrawable i zaimplementować własny TransitionDrawable.

Here's Gotowa wersja niestandardowa TransitionDrawable do pracy z więcej niż dwoma obrazami.

Możesz zobaczyć pełną próbkę wraz z demo gif here on Github.

Powiązane problemy