Как преобразовать элемент в форму?

Как преобразовать Mouse.position в Form, чтобы отобразить его в коллаже? Следующий код отображает <Signal> вместо фактических координат мыши:

render (x, y) =
    let mousePos = toForm (show Mouse.position)
    in collage 400 400 [mousePos]

Любопытно, что в этом примере http://elm-lang.org/examples/mouse-position, функция show на самом деле преобразует Mouse.position в строку с координатами, но это потому, что функция show используется для фильтрации Signal(Int, Int) в кортеж значений Signal.

Итак, мой вопрос: как мне преобразовать Signal(Int, Int) в Form, чтобы он отображал значения кортежа?


elm
person miniml    schedule 20.08.2015    source источник

Ответы (1)


arrow_upward
4
arrow_downward

Вы ищете Graphics.Collage.toForm, который имеет тип Element -> Form.

Также похоже, что вы не совсем понимаете, что делает Signal.map. Требуется функция, которая будет применена к каждому значению Signal. Я пытался использовать его в нескольких контекстах в следующем примере.

import Graphics.Element exposing (..)
import Graphics.Collage
import Graphics.Collage exposing (Form)
import Mouse

--This is the function you are trying to construct.
--It takes in a position, converts it to an element,
--using show and then converts it to a Form.
formPosition : (Int, Int) -> Form
formPosition pos = 
  let element = show pos -- element : Element 
  in Graphics.Collage.toForm element

-- We now want to apply our formPosition function to the
-- Signal containing all mouse position changes.
-- So we use Signal.map to apply formPosition to all values
-- of Mouse.position
formSignal : Signal Form
formSignal = Signal.map formPosition Mouse.position

-- Eventually we want to render this on the screen and the
-- function to do this requires a List Form not just a single
-- Form. So we write a function which returns a Singleton list
-- and apply it to each value in our formSignal.
formListSignal : Signal (List Form)
formListSignal = Signal.map (\n -> [n]) formSignal


-- Finally, we must turn that into a Signal Element to render
-- on the screen. We partially apply Graphics.Collage.collage
-- to return an element of size 400x400 and apply it to the 
-- values of formListSignal by using Signal.map again
elementSignal : Signal Element
elementSignal = Signal.map (Graphics.Collage.collage 400 400) formListSignal

-- Finally we hand this off to main and it renders
main : Signal Element
main = elementSignal

Более простая версия, скорее всего, объединила бы все преобразования в одну функцию. Я просто хотел подчеркнуть, как работает Signal.map. Надеюсь, это поможет!

person Joe    schedule 20.08.2015
comment
Спасибо! Это сработало. И да, ты был прав. Я не совсем понял, что делал Signal.map. - person miniml; 21.08.2015