Unstructured Graphics
collage : Int -> Int -> List Form -> Element |
Creating Forms
filled : Color -> Shape -> Form |
gradient : Gradient -> Shape -> Form |
outlined : LineStyle -> Shape -> Form |
textured : String -> Shape -> Form |
toForm : Element -> Form |
traced : LineStyle -> Path -> Form |
Grouping Forms
group : List Form -> Form |
groupTransform : Transform2D -> List Form -> Form |
Shapes
|
circle : Float -> Shape circle(radius)
|
|
ngon : Int -> Float -> Shape ngon(sides, radius)
|
|
oval : Float -> Float -> Shape oval(width, height)
|
|
polygon : List (Float, Float) -> Shape Specify a list of points of the polygon. Shape will automatically close.
|
|
rect : Float -> Float -> Shape rect(width, height)
|
|
square : Float -> Shape square(edge_length)
|
Images
|
image : Int -> Int -> String -> Element image(width, height, src)
|
|
fittedImage : Int -> Int -> String -> Element fittedImage(width, height, src)
|
|
croppedImage : (Int, Int) -> Int -> Int -> String -> Element croppedImage(origin, width, height, src)
|
|
tiledImage : Int -> Int -> String -> Element tiledImage(width, height, src)
|
Element Inspection
widthOf : Element -> Int |
heightOf : Element -> Int |
sizeOf : Element -> (Int, Int) |
Layout Aliases
|
layers : List ELement -> Element layers == flow outward
|
|
above : Element -> Element -> Element a above b
|
|
below : Element -> Element -> Element a below b
|
|
beside : Element -> Element -> Element a beside b
|
Layout
flow : Direction -> List Element -> Element |
right : Direction |
+X |
up : Direction |
+Y |
outward : Direction |
+Z |
left : Direction |
-X |
down : Direction |
-Y |
inward : Direction |
-Z |
|
|
Transforming Forms
alpha : Float -> Form -> Form |
move : (Float, Float) -> Form -> Form |
moveX : Float -> Form -> Form |
moveY : Float -> Form -> Form |
rotate : Float -> Form -> Form |
scale : Float -> Form -> Form |
Paths
segment : (Float, Float) -> (Float, Float) -> Path |
path : List (Float, Float) -> Path |
Line Style Types
type alias LineStyle = {
color:Color,
width:Float,
cap:LineCap,
join:LineJoin,
dashing:List Int,
dashOffset:Int
}
type LineCap
= Flat
| Round
| Padded
type LineJoin
= Smooth
| Sharp Float
| Clipped
|
Line Styles
dashed : Color -> LineStyle |
defaultLine : LineStyle |
dotted : Color -> LineStyle |
solid : Color -> LineStyle |
Element Styling
|
width : Int -> Element -> Element |
|
height : Int -> Element -> Element |
|
size : Int -> Int -> Element -> Element |
|
color : Color -> Element -> Element |
|
opacity : Float -> Element -> Element opacity (0.0:transparent - 1.0:opaque)
|
|
link : String -> Element -> Element create Element that is a hyper-link
|
|
tag : String -> Element -> Element similar to <a> with ID
|
Positioning Elements
|
empty : Element flow down [ img1, if showMore then img2 else empty ]
|
|
spacer : Int -> Int -> Element Empty Box
|
|
container : Int -> Int -> Position -> Element -> Element Put an element in a container. By setting the color of the container, you can create borders.
|
Named Positions
topLeft : Position
midTop : Position
topRight : Position
--------------------
midLeft : Position
middle : Position
midRight : Position
--------------------
bottomLeft : Position
midBottom : Position
bottomRight : Position
|
|
Created By
Metadata
Comments
No comments yet. Add yours below!
Add a Comment
Related Cheat Sheets
More Cheat Sheets by CITguy