Animierte Shader

Chrisomat · 22. November 2016

Hallo Community,

ich habe zwei Bilder, eine ColorMap und eine MaskMap.
Die ColorMap soll sich dabei um den Mittelpunkt drehen und
danach mit Hilfe eines Maskshaders die AlphaWerte der MaskMap übernehmen.
Die Animation soll so lange laufen wie die Activity angezeigt wird und hat keine Benutzerinteraktion.

Die einzelen Schritte bekomme ich schon hin (Rotationsanimation über xml und den MaskSchader mit Paint.Xfermode)
Mein Problem liegt darin diese Methoden zu verbinden.

Am liebsten wäre mir eine reine xml-Lösung.

Danke für eure Hilfe

Gruß Chrisomat

Ben · 24. November 2016

mh davon hab ich leider noch gar keine ahnung, aber ich vermute eine reine xml lösung wird schwierig. hab auf die schnelle gerade auch nichts über google gefunden. Bist du schon weitergekommen? Wenn nicht les ich mich da morgen mal ein bisschen ein.

Chrisomat · 24. November 2016

Ich suche schon seit ca. 2 Wochen nach einer Lösung oder Teillösungen und habe auch schon 2 Methoden gefunden,
die das so dar zu stellen, aber diese bringen nur mein Handy zum schwitzen aber keine schöne Animation.

Methode 1:

XML

&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false"&gt;
    &lt;item android:drawable="@drawable/bild_0_grad" android:duration="100"/&gt;
    &lt;item android:drawable="@drawable/bild_18_grad" android:duration="100"/&gt;
    &lt;item android:drawable="@drawable/bild_36_grad" android:duration="100"/&gt;
    &lt;item android:drawable="@drawable/bild_54_grad" android:duration="100"/&gt;
    &lt;item android:drawable="@drawable/bild_72_grad" android:duration="100"/&gt;
    &lt;item android:drawable="@drawable/bild_90_grad" android:duration="100"/&gt;
    &lt;item android:drawable="@drawable/bild_108_grad" android:duration="100"/&gt;
    &lt;item android:drawable="@drawable/bild_126_grad" android:duration="100"/&gt;
    &lt;item android:drawable="@drawable/bild_144_grad" android:duration="100"/&gt;
    &lt;item android:drawable="@drawable/bild_162_grad" android:duration="100"/&gt;
&lt;/animation-list&gt;

Alles anzeigen

Methode 2:

Java

Runnable rot = new Runnable() {
            int grad = 0;
            @Override
            public void run() {
                Bitmap colormap = BitmapFactory.decodeResource(getBaseContext().getResources(), R.drawable.colorMap);
                Bitmap mask = BitmapFactory.decodeResource(getBaseContext().getResources(), R.drawable.mask);


                if(grad &gt;= 360)
                    grad = 0;


                Matrix matrix = new Matrix();
                matrix.postRotate(grad);


                colormap = Bitmap.createBitmap(colormap, 0, 0, colormap.getWidth(), colormap.getHeight(), matrix, true);


                Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(), Bitmap.Config.ARGB_8888);
                Canvas tmpCanvas = new Canvas(result);
                Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
                paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
                tmpCanvas.drawBitmap(colormap, 0, 0, null);
                tmpCanvas.drawBitmap(mask, 0, 0, paint);
                paint.setXfermode(null);


                tmpCanvas.drawBitmap(result, 0, 0, new Paint());


                IMV.setImageBitmap(result);


                grad += 8;


                if(weiter)
                    mHandler.postDelayed(this, 20);
            }
        };

Alles anzeigen

IMV ist das Imageview in dem die Animation angezeigt werden soll.

Die zweite Methode ist denke ich besser, da die Bild auf 1/3 des Bildschirmes angezeigt wird und daher eine minmale Auflösung 150x150 Pixel haben muss.

Befor die Frage der Sinnhaftigkeit auf kommt will ich dazu sagen dass das Desing nicht mein Teil des Projektes ist .

Ben · 29. Dezember 2016

also für mich sieht jetzt variante 1 am saubersten aus. Auch in der android doku wird das so beschrieben. bist du sicher dass es an diese animation liegt bzw. das du nur eine animation startest?

Animierte Shader

Jetzt mitmachen!

Teilen

Tags