For the detailed examples, see Tron.Build
, it contains the same functions and types.
The difference is that Tron msg
is the Tree (Control.Value -> Maybe msg)
and so it produces messages in response to anything, but Tree a
just
stores the given a
values along with the components.
To map over and manipulate such trees in different ways, use Tron.Tree
module.
Using Tron.lift
any Tree a
may be lifted to Tron a
(i.e. Tree (Control.Value -> Maybe a)
).
List ( Label
, Tree a
}
Set a
is just the list of components' definitions together with their labels.
It is what Build.root
, Build.nest
and Build.choice
get as an argument.
Set a
is exposed as a separate type to help you in the cases where you build your GUI from several modules,
but want to join them in a single panel rather than nesting every module separately.
mapSet : (a -> b) -> Set a -> Set b
map all the items in the set with one function.
toSet : (a -> Label) -> List (Tree a) -> Set a
root : Set a -> a -> Tree a
none : a -> Tree a
int : { min : Basics.Int, max : Basics.Int, step : Basics.Int } -> Basics.Int -> a -> Tree a
float : Axis -> Basics.Float -> a -> Tree a
number : Axis -> Basics.Float -> a -> Tree a
xy : ( Axis, Axis ) -> ( Basics.Float, Basics.Float ) -> a -> Tree a
coord : ( Axis, Axis ) -> ( Basics.Float, Basics.Float ) -> a -> Tree a
color : Color -> a -> Tree a
text : String -> a -> Tree a
input : (x -> String) -> x -> a -> Tree a
button : a -> Tree a
buttonWith : Face -> a -> Tree a
toggle : Basics.Bool -> a -> Tree a
bool : Basics.Bool -> a -> Tree a
nest : Set a -> a -> Tree a
choice : Set comparable -> comparable -> Tree ( Basics.Int, comparable )
choiceBy : Set a -> a -> (a -> a -> Basics.Bool) -> Tree ( Basics.Int, a )
strings : List String -> String -> Tree ( Basics.Int, String )
labels : (a -> Label) -> List a -> a -> Tree ( Basics.Int, Label )
palette : List ( Label, Color ) -> Color -> Tree ( Basics.Int, Color )
buttons : List a -> List (Tree a)
useColor : Color -> Face
face : Face -> Tree a -> Tree a
Tron.Control.Impl.Button.Face
Button face
Tron.Control.Impl.Button.Icon
Button icon
icon : Url -> Face
iconAt : List String -> Face
themedIcon : (Tron.Style.Theme.Theme -> Maybe Url) -> Face
themedIconAt : (Tron.Style.Theme.Theme -> List String) -> Face
expand : Tree a -> Tree a
collapse : Tree a -> Tree a
shape : Tron.Style.PanelShape.PanelShape -> Tree a -> Tree a
Changes panel shape for nest
and choice
panels:
Build.nest ... |> Buidler.shape (cols 2)
Build.choice ... |> Buidler.shape (rows 1)
Build.choice ... |> Buidler.shape (by 2 3)
cells : Tron.Style.CellShape.CellShape -> Tree a -> Tree a
Changes cell shape for nest
and choice
panels:
Build.nest ... |> Buidler.cells single
Build.choice ... |> Buidler.shape halfByTwo
Build.choice ... |> Buidler.shape halfByHalf
Usually in your for
function you set the default value to the control, but if you change the control with live
, then you'll be able to pass some dynamic value from your model to it.
live : Tree a -> Tree a
toChoice : Tree a -> Tree a
toKnob : Tree msg -> Tree msg
Convert choice control to a switch by click form:
Build.choice ... |> Build.toSwitch
toSwitch : Tree msg -> Tree msg
Convert choice control to a switch by click form:
Build.choice ... |> Build.toSwitch