Bir el kartını nasıl eşit olarak havalandırabilirim?

Bir dizi oyun kartı (genişlik ve yükseklikteki dikdörtgen görüntüler) göz önüne alındığında, her birini bir 'fan' deseninde görünecek şekilde nasıl döndürebilirim ve konumlandırabilirim, tıpkı gerçek hayatta bir elinizi tutacağınız gibi. Bunu yapmak için hangi matematik gereklidir?

GÜNCELLEME

JavaScript tarayıcı uygulamasında son nokta: https://cosmicrealms.com/blog/2013/03/16/hand-of-cards/ ve http://jsfiddle.net/tyyvk/108/

teori

Bunu hangi platformda uyguladığınızı belirtmediğiniz için, algoritmanın dile agnostik bir şekilde bir açıklamasını vereceğim:

1. Önce aynı başlangıç ​​pozisyonunu vererek her kartı üst üste istifleyin .
2. Daha sonra her kart için bir rotasyon uygulayın (genellikle alt köşelerden birinin etrafında ortalanır , ancak bu orijini hareket ettirmek aslında fanın görünümünü değiştirmenize izin verir).
3. Kart sayısına ve ne kadar yayılmasını istediğinize bağlı olarak her arama arasındaki dönüş açısını artırın.

Bu rotasyon kartın alt köşelerinden birinde etrafında merkezli (ya da köşesine yakın) bakarak gelen belirgin olmalıdır:

uygulama

Bunu nasıl uygulayacağınıza gelince, platformunuza bağlıdır. XNA'da SpriteBatch.Draw, rotasyonunuzun merkezini değiştirmek için konumunda Origin parametresini kullanabilirsiniz .

İşte aşağıdaki kod ile ne var (daha iyi görünmesini sağlamak için kökeni birkaç tweaks ile - temelde kökeni sağ köşede başlar ve sol köşede biter):

int cards = 20;
float range = MathHelper.ToRadians(90);
float initialAngle = MathHelper.ToRadians(-45);
float increment = range / cards;
Vector2 leftCorner = new Vector2(0, texture.Height * 0.9f);
Vector2 rightCorner = new Vector2(texture.Width, texture.Height * 0.9f);
Vector2 fanPosition = new Vector2(400, 300);
spriteBatch.Begin();
for (float angle = 0; angle < range; angle+=increment)
{
    float cardAngle = initialAngle + angle;
    Vector2 cardOrigin = Vector2.Lerp(rightCorner, leftCorner, angle / range);
    spriteBatch.Draw(texture, fanPosition, null, Color.White, cardAngle, cardOrigin, 1f, SpriteEffects.None, 0f);
}
spriteBatch.End();

Ve sonuç: