wxHaskell レイアウト覚書

昨日からしばらくwxHaskellを触っています。

最初、GUIパーツの配置方法がわからずに悩んでいたので、
ここに覚え書き。

パーツはそれぞれ（ボタンやエディットボックスなど）、
IO型に包まれて返されます

なので、

btn <- button p
         [text := "ほげ"
         , on command := {-クリック時のアクション-}]

のようにオブジェクトを確保。

上に出てきたpは、パーツを配置していくパネル、
HTML/CSSでいうところのブロック要素のものだと認識しています。

次に、これを自分の思うように配置していきます。
これには

set :: w -> [Prop w] -> IO ()

を用います。
ちなみに、setを用いず、

gui = do btn <- button p [{-ほにゃらら-}]

と書くだけでもパーツは配置されますが、
これでは、自分の思う場所に配置することはできません。

position使えば可能なことは可能ですが、
レイアウトはレイアウトでまとめてしまった方が管理しやすいと思います。

で、set関数の中で。
以下のようなものを書いたとします。

  set f [ layout := container p $ column 0
           [(margin 10 $ row 2
               [ widget btn1
                ,widget btn2])
            ,minsize (sz 250 (height-50))
           ,(margin 10 $ row 2
               [ minsize (sz (width-250) (height-50))
                          $ widget bigBtn
                 minsize (sz 250 (height-50))
                          $ widget editBox ])]
         ,clientSize := Size width height]

ウィンドウの大きさやパーツの配置をしています。

margin  --周囲の余白を指定
row     --横に並べるパーツ数

上の例では、
まず余白10で、横方向にボタンを二つ並べています。
そして、その下段に、最小の大きさを指定した上で、
横方向に二つ、
ボタンとエディットボックスを配置しています。

構成は以下のよう。