在Haskell中使用光泽动画

Question

这是我的代码，看起来像这样的小模式。 （不是我所知道的最有效的代码）。现在，我想使用stars进行animate轮播。但我不确定如何在一个程序中一起使用display和animate。任何帮助，将不胜感激。感谢。

import Graphics.Gloss

main = display (InWindow "Gloss" (700,700) (0,0))
           black (picture 100)
picture :: Float -> Picture
picture 0 = text "Value cannot be 0"
picture number = scale 6.5 6.5 (color rose $ drawpicture number)

orangered, orangered2, orangered3 :: Color
orangered = makeColor 1.0 0.251 0.0 0.7
orangered2 = makeColor 1.0 0.251 0.0 0.5
orangered3 = makeColor 1.0 0.251 0.0 0.3

intervalsmall = [0,11.25,22.5,33.75,45,56.25,67.5,78.75]
intervalbig = [0,22.5,45,67.5,90,112.5,135,157.5,180,202.5,225,247.5,270,292.5,315,337.5]
xlist = [2,4..50]
ylist = [0,2..48]

squares = pictures[rotate x (line [(-50,0),(0,50),(50,0),(0,-50),(-50,0)]) | x <- intervalsmall]
stars = pictures[rotate x ((pictures [line [(-8.5,0),(0,50),(8.5,0)],line[(0,50),(0,0)]])) | x <- intervalbig]
grid = pictures[line [(0,y),(x,50)] | x <- xlist, y <- ylist, x-y==2]
insidegrid = pictures[
    translate 0 (-50) grid,
    rotate 90 (translate 0 (-50) grid),
    rotate 180 (translate 0 (-50) grid),
    rotate 270 (translate 0 (-50) grid)]

drawpicture :: Float -> Picture
drawpicture number = pictures [
    color red (pictures [circle 50,circle 8.5]),
    line [(-50,-50),(-50,50),(50,50),(50,-50),(-50,-50)],
    squares,
    scale 0.7 0.7 squares,
    scale 0.49 0.49 squares,
    scale 0.347 0.347 squares,
    scale 0.242 0.242 squares,
    color orange stars,
    color orange (scale 0.178 0.178 stars),
    rotate 11.25 (scale 0.178 0.178 stars), 
    translate (-50) 0 grid,
    rotate 90 (Translate (-50) 0 grid),
    rotate 180 (Translate (-50) 0 grid),
    rotate 270 (Translate (-50) 0 grid),
    color orangered insidegrid,
    color orangered2 (rotate 45 insidegrid),
    color orangered3 (rotate 22.5 insidegrid),
    color orangered3 (rotate 67.5 insidegrid)
    ]

Answer 1

如果你为每个视觉元素设置单独的绘图功能会更容易，但基本答案是：要使用animate函数和rotate想要“移动”的图像组件来设置动画：

import Graphics.Gloss

main = animate (InWindow "Gloss" (700,700) (0,0))
           black picture

picture :: Float -> Picture
picture 0 = text "Value cannot be 0"
picture number = scale 6.5 6.5 (color rose $ drawpicture number)

orangered, orangered2, orangered3 :: Color
orangered = makeColor 1.0 0.251 0.0 0.7
orangered2 = makeColor 1.0 0.251 0.0 0.5
orangered3 = makeColor 1.0 0.251 0.0 0.3

intervalsmall = [0,11.25,22.5,33.75,45,56.25,67.5,78.75]
intervalbig = [0,22.5,45,67.5,90,112.5,135,157.5,180,202.5,225,247.5,270,292.5,315,337.5]
xlist = [2,4..50]
ylist = [0,2..48]

squares = pictures[rotate x (line [(-50,0),(0,50),(50,0),(0,-50),(-50,0)]) | x <- intervalsmall]
stars = pictures[rotate x ((pictures [line [(-8.5,0),(0,50),(8.5,0)],line[(0,50),(0,0)]])) | x <- intervalbig]
grid = pictures[line [(0,y),(x,50)] | x <- xlist, y <- ylist, x-y==2]
insidegrid = pictures[
    translate 0 (-50) grid,
    rotate 90 (translate 0 (-50) grid),
    rotate 180 (translate 0 (-50) grid),
    rotate 270 (translate 0 (-50) grid)]

rotVal :: Float -> Float
rotVal x = x - (x / (2*pi))

drawpicture :: Float -> Picture
drawpicture number = pictures [
    rot $ color red (pictures [circle 50,circle 8.5]),
    line [(-50,-50),(-50,50),(50,50),(50,-50),(-50,-50)],
    rot $ squares,
    rot $ scale 0.7 0.7 squares,
    rot $ scale 0.49 0.49 squares,
    rot $ scale 0.347 0.347 squares,
    rot $ scale 0.242 0.242 squares,
    rot $ color orange stars,
    rot (color orange (scale 0.178 0.178 stars)),
    rot (rotate 11.25 (scale 0.178 0.178 stars)),
    translate (-50) 0 grid,
    rotate 90 (Translate (-50) 0 grid),
    rotate 180 (Translate (-50) 0 grid),
    rotate 270 (Translate (-50) 0 grid),
    rot $ color orangered insidegrid,
    rot $ color orangered2 (rotate 45 insidegrid),
    rot $ color orangered3 (rotate 22.5 insidegrid),
    rot $ color orangered3 (rotate 67.5 insidegrid)
    ]
  where rot = rotate (rotVal number)

Answer 2

为你写出所有内容太多了，但你只需要为你的图片函数添加另一个参数Float并代表时间。因此display将替换为animate。如此。

main = animate (InWindow "Gloss" (700,700) (0,0))
           black (picture 100)

picture :: Float -> Float -> Picture
picture number time = -- whatever you have to do

您必须更改帮助绘图功能才能使用此时间参数。假设您希望旋转整个思考一次5秒，您可以将此时间乘以并得到一个角度angle = time*(pi*2/5)然后您可以使用此角度的trig函数来计算中心的新x和y位置。