onClickイベントハンドラーをに追加することは可能Graphics.Collage.square
ですか?
クリックの相対位置を知りたいのですが。
JavaScriptでは、私のような何かを行うことができ、これを:
var canvas = document.getElementById('canvas');
var canvasPosition = {
x: canvas.offsetLeft,
y: canvas.offsetTop
};
canvas.addEventListener('click', function(event) {
console.log(event.x - canvasPosition.x, event.y - canvasPosition.y);
}, false);
Elmで同様のことをすることは可能ですか?
例をいただければ幸いです。
Elmでは、Canvasレンダリングを使用して、Mouse.clicks
信号を使用し、信号の変化に反応する必要があります。これがどのように機能するかについての実行可能な例を次に示します。
import Graphics.Element exposing (Element, show)
import Mouse
clicks : Signal (Int, Int)
clicks =
Signal.sampleOn Mouse.clicks Mouse.position
main : Signal Element
main =
Signal.map show clicks
本質的に、Mouse.clicks
私たちが関心を持っている実際の「イベント」であるため、発生するたびに、Mouse.position
信号を「サンプリング」してクリック位置を取得します。
Signal.sampleOn
最初のパラメータ信号(ここではマウスクリック)に変化があるたびに、2番目のパラメータ信号(ここではマウスの位置)の値で更新される信号を生成します。
ここで、結果を表示するために、位置をのshow
関数にマッピングしていますmain
。
このコードをhttp://elm-lang.org/tryに貼り付け、コンパイルして右側をクリックしてみて、機能することを確認することもできます。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加