Haskell ile web animasyonu için en basit paket

Question

Haskell'i öğreniyorum ve onunla oynamak için bir bebek projesi geliştirmek istiyorum. Model ve kontrolör bileşenleri ile ilerliyorum ama görüş ile zor bir zaman geçiriyorum. Web tabanlı animasyonlar oluşturmak istiyorum (fare tıklamaları tanıyan, nesneleri hareket ettiren vb.) Çeşitli paketlere baktım (Spock, Reflex, vb.). ya daha fazla çaba gerektirdiklerini (çünkü bunlar ilk önce bu kavramları öğrenmemi gerektiren RFP'dir) ya da basit (Spock gibi) görünmekle birlikte, basit bir web animasyon öğreticisi bulamıyorum (sadece bir "Merhaba Dünya").

Herkes basit bir yaklaşım önerebilir mi? Yine, sadece işleri işlemek için hızlı ve kolay bir yol istiyorum. Benim odaklandığım web programlama değil, Haskell temellerini öğrenmektir.

Answer 1

Benim için çalışan yaklaşım, SVG oluşturmak için Reflex kullanmaktır. Reflex, DOM nesnelerini bir web sayfasına işlemek ve bu nesnelerdeki fare tıklamaları ile yanıtlamayı oldukça kolaylaştırır. SVG (canvas yerine) kullanmak, hem seçim hem de düzenleme (yeniden boyutlandırma, taşıma, rengi değiştirme, silme) için ilk ekrandan sonra oluşturulmuş nesnelere erişim sağlar.

Refleks/svg kullanan üç "başlangıç" örnekleri. Bunların her biri çalışan bir demo içerir (benioku dosyasına bağlı). bu örneklerin refleks dayandığını, hepsi bir FRP kodlama stilini kullanarak yazılır ancak Verilen

Render circles in locations determined by the circle-packing package

Interactive knight's tour animation.

Rotating 3D cube

Ben bu programların her birinin kısmını o spesifik olarak en aza indirmek için çalıştı FRP tekniklerini kullanır. Örneğin, şövalyenin turu ve dönen küpünün her ikisi de yalnızca görüntülenmek üzere aramaları içeren ve bunları içeren bir özyineleme kodu bloğuna sahiptir. şövalye tur örnekten

rec 
    view modelOrientation 
    modelOrientation <- foldDyn update initialOrientation tick 

: Her iki durumda da bu kod bloğu dönen küp örnek itibaren devlet değişikliklerin birikimi (foldDyn güncelleme)

manzaralı geribildirim sağlayan

rec 
    startEvent <- view width height rowCount colCount board tour 
    tour <- foldDyn (update board) [] $ leftmost [startEvent, advanceEvent] 

Refleks kullanmaya başladığım en kolay yol, reflex-platform github repository klonlanması ve bu depoda bulunan try-refleks komut dosyasının çalıştırılmasıdır - tam olarak refleks platformunda

Daire paketleme örneği, circle-packing package gerektirir. Döner 3d küp örneği, matrix package gerektirir. Bu paketlerin kullanımını etkinleştirmek için, refleks platformu readme'de belirtildiği gibi, bunları yeniden-refleksi çalıştırmadan önce refleks platformunda package.nix içine dahil edin.