Nasıl bir Dünya Şifa Dalgası efekti yaratabilirim?


14

Ben değiştirmek istiyorum karanlık ve iç karartıcı arka plan a mutlu çimenli arka mutlu arka plan bir oyun karakteri etrafında bir yarıçap gösterilmektedir öyle ki, gerçek zamanlı olarak,.

Bir mutluluk ForceField , eğer olacaktır.

Bir tuvalde özel görünümde oluştururken bu mümkün olduğunca performansla nasıl yapılabilir?


GÜNCELLEME: İşte kafamda şu şekilde çalışır:

    private int hModeX, hModeY;
    private float hModeRadius = 0.1f;
    private float hModeStart = 0;
    happyModeBg = Bitmap.createScaledBitmap(happyModeBg, getWidth(),getHeight(), true);
    hModeX = getWidth()/2;
    hModeY = getHeight()/2;

private void initHappyMode(Canvas canvas){
    hModeRadius = 75 * thread.getDelta();

    if(hModeRadius > 500) {
        hModeStart = timestep; //What is timestep?
    }

    //context.arc(x, y, radius, 0, 2 * Math.PI, false); <- your version
    canvas.save();
    canvas.drawArc(oval, startAngle, sweepAngle, useCenter, paint) // <- my version
    //context.clip(); <- dont know what this does or if there is an equivilant
    canvas.drawBitmap(happyModeBg, 0, 0, null);
    canvas.restore();
    //requestAnimationFrame(step); <- dont know what this does since I cant seem to find it for android

}

canvas.drawArc()Bir daire yapmak için kullanıyorum , ama kesinlikle bir şeyleri kaçırıyorum.



Sadece kendi oyun
döngüm tarafından 60 fps'de

Sahneyi iki kez oluşturabilir misiniz? İyileştirilmiş versiyon için bir kez, ölü versiyon için bir kez ve daha sonra daire tüm ekranı kaplayana kadar iyileşen ölünün üzerine giderek artan bir daire çizin.
Wolfgang Skyler

Bu benim düşündüğüm şey. Sadece bir bitmap ile nasıl gidileceğini bilmiyorum. Ve belki de daha iyi bir yol var çünkü 2 bg'yi aynı anda render etmek çok maliyetli
Green_qaue

2
Sanırım karışıklığın ne hakkında olduğunu görüyorum - Android'ler , düşündüğünü düşündüğüm CanvasHTML'den biraz farklı şeyler yapıyor <canvas>! Cevabımı, Android'e özgü bazı bağlantılar ve örnek kodlarla genel olarak kırpmanın nasıl çalıştığını açıklamak için düzenledim.
Anko

Yanıtlar:


20

gösteri

GameDev Şifa Dalgası

GameDev Meta : Henshin Ana !! : D

Kod , bir kullanan canvas clipbölge ve requestAnimationFrameyüksek kalite ve verim. (Daha iyi yaşamak .)

HTML demek istediğini sanıyordum canvas! Yapmasanız bile, diğer oluşturma motorları (demek isteyebilirsiniz ki Android'in 2D işleme hattı gibi) donanım hızlandırmalı klip bölgelerini de destekler . Kod büyük olasılıkla benzer görünecektir.

requestAnimationFrame(Veya başka bir platformun sağladığı çözüm) ile animasyon kareleri istemek , motorun oluşturma zamanlamasını belirlemesine izin vererek daha yüksek kalitede animasyonla sonuçlanır.

Bu, düşük menzilli bir netbook ve Android telefonumda sorunsuz bir şekilde işlemektedir.

açıklama

Bunu daha kullanışlı hale getirmek için kırpmayı gerçekten anlayalım .

Diyelim ki bu iki dikdörtgene sahibiz:

iki dikdörtgen, biri üst üste biniyor

Kırpma, çizgiler, noktalar, görüntüler veya oluşturmak istediğiniz başka herhangi bir şey üzerinde de işe yarar. Sadece basitlik için dikdörtgenlere yapışıyorum.

Kırmızı dikdörtgenin burada (siyah daire) hiç görünmesini istemiyoruz.

iki dikdörtgen, kırmızı dikdörtgenin istenen kesim alanı siyah

Bu yüzden render talimat verebilirsiniz klibi o daireye tarafından kırmızı dikdörtgen.

iki dikdörtgen;  kırmızı olan kırpılmış

Başka bir deyişle, kırmızı dikdörtgen çizildiğinde, o siyah dairenin nerede olduğu dışında her yere çizilir.

Farklı oluşturucular hangi bölgenin kırpılacağını belirtmenin farklı yollarına sahiptir. JavaScript'te, HTML ile <canvas>,

// Draw the blue rectangle

context.save(); // Save the current state of the graphics context,
                // so we can go back to it.

// Draw the black circle
context.clip(); // Tell the renderer that was our clip region,
                // since the last `context.save()`.

// Draw the red rectangle.
// It will appear clipped by the black circle.

context.restore(); // Tell the renderer we should restore all
                   // the clipping settings back to what they were
                   // `context.save`d as.

// From here on, nothing is clipped anymore.

Şimdi, bir Android'de Canvasbenzer bir şey yapmak isteyeceksiniz, ancak oluşturucu biraz farklı kod bekliyor:

// Draw the blue rectangle

canvas.save(); // Same idea as above -- just setting a point we can
               // restore to later.

// Now, `canvas.clipPath` expects a `Path` object.
// Let's create one that contains a circle.
Path path = new Path();
path.addCircle(100, 100, 100, Direction.CW); 
canvas.clipPath(path);

// Draw the red rectangle
// It will be clipped by the circle defined in the `path` that we
// used as the `clipPath`.

canvas.restore(); // Aaaand restore the state.

// Things drawn here won't be clipped anymore.

Konuyla ilgili Android belgeleri kullanışlı olabilir. StackOverflow'da denemek isteyebileceğiniz daha fazla şey hakkında bunun gibi iyi sorular var.


3

Ankos yöntemi ile çalışma uygulaması:

canvas.drawBitmap(depressingBg, 0, 0, null);
canvas.save();
radius += 400*thread.getDelta(); // expansion speed
Path path = new Path();
// draw around player position
path.addCircle(player.x, player.y, radius, Direction.CW);
canvas.clipPath(path);
canvas.drawBitmap(happyBg, 0, 0, null);
canvas.restore();

Anko'ya tüm yardım için teşekkürler!

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.