Safe Haskell | None |
---|---|
Language | Haskell98 |
- type Canvas = Element
- type Vector = Point
- type Point = (Double, Double)
- data Color
- type ColorStop = (Double, Color)
- data Gradient
- data FillStyle
- drawImage :: Element -> Vector -> Canvas -> UI ()
- clearCanvas :: Canvas -> UI ()
- solidColor :: Color -> FillStyle
- htmlColor :: String -> FillStyle
- linearGradient :: Point -> Double -> Double -> [ColorStop] -> FillStyle
- horizontalLinearGradient :: Point -> Double -> Color -> Color -> FillStyle
- verticalLinearGradient :: Point -> Double -> Color -> Color -> FillStyle
- fillRect :: Point -> Double -> Double -> Canvas -> UI ()
- fillStyle :: WriteAttr Canvas FillStyle
- strokeStyle :: Attr Canvas String
- lineWidth :: Attr Canvas Double
- textFont :: Attr Canvas String
- data TextAlign
- = Start
- | End
- | LeftAligned
- | RightAligned
- | Center
- textAlign :: Attr Canvas TextAlign
- beginPath :: Canvas -> UI ()
- moveTo :: Point -> Canvas -> UI ()
- lineTo :: Point -> Canvas -> UI ()
- closePath :: Canvas -> UI ()
- arc :: Point -> Double -> Double -> Double -> Canvas -> UI ()
- arc' :: Point -> Double -> Double -> Double -> Bool -> Canvas -> UI ()
- fill :: Canvas -> UI ()
- stroke :: Canvas -> UI ()
- fillText :: String -> Point -> Canvas -> UI ()
- strokeText :: String -> Point -> Canvas -> UI ()
Synopsis
Partial binding to the HTML5 canvas API.
Documentation
drawImage :: Element -> Vector -> Canvas -> UI () Source
Draw the image of an image element onto the canvas at a specified position.
clearCanvas :: Canvas -> UI () Source
Clear the canvas
solidColor :: Color -> FillStyle Source
creates a solid-color fillstyle
:: Point | The upper-left coordinate of the gradient |
-> Double | The width of the gradient |
-> Double | The height of the gradient |
-> [ColorStop] | the color-stops for the gradient |
-> FillStyle |
creates a linear gradient fill style
horizontalLinearGradient Source
:: Point | The upper-left coordinate of the gradient |
-> Double | The width of the gradient |
-> Color | The starting color of the gradient |
-> Color | The ending color of the gradient |
-> FillStyle |
creates a simple horizontal gradient
:: Point | The upper-left coordinate of the gradient |
-> Double | The height of the gradient |
-> Color | The starting color of the gradient |
-> Color | The ending color of the gradient |
-> FillStyle |
creates a simple vertical gradient
Draw a filled rectangle.
The fillStyle
attribute determines the color.
fillStyle :: WriteAttr Canvas FillStyle Source
The Fillstyle to use inside shapes. write-only as I could not find how to consistently read the fillstyle
strokeStyle :: Attr Canvas String Source
The color or style to use for the lines around shapes.
Default is #000
(black).
textFont :: Attr Canvas String Source
The font used for fillText
and strokeText
.
Default is 10px sans-serif
.
textAlign :: Attr Canvas TextAlign Source
The alignment for fillText
and strokeText
. Default is Start
.
beginPath :: Canvas -> UI () Source
Starts a new path by resetting the list of sub-paths. Call this function when you want to create a new path.
moveTo :: Point -> Canvas -> UI () Source
Moves the starting point of a new subpath to the (x,y)
coordinate.
lineTo :: Point -> Canvas -> UI () Source
Connects the last point in the subpath to the (x,y)
coordinates
with a straight line.
closePath :: Canvas -> UI () Source
Draw a straight line from the current point to the start of the path. If the shape has already been closed or has only one point, this function does nothing.
:: Point | Center of the circle of which the arc is a part. |
-> Double | Radius of the circle of which the arc is a part. |
-> Double | Starting angle, in radians. |
-> Double | Ending angle, in radians. |
-> Canvas | |
-> UI () |
Add a circular arc to the current path.
strokeText :: String -> Point -> Canvas -> UI () Source
Render the outline of a text at a certain point on the canvas.
The strokeStyle
attribute determines the color of the outline.
The textFont
attribute determines the font used.
The textAlign
attributes determines the position of the text
relative to the point.