Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/tarkah/roc-iced
https://github.com/tarkah/roc-iced
iced roc-lang
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/tarkah/roc-iced
- Owner: tarkah
- Created: 2024-07-05T18:11:04.000Z (7 months ago)
- Default Branch: master
- Last Pushed: 2024-07-15T21:06:05.000Z (7 months ago)
- Last Synced: 2024-10-25T10:38:52.640Z (3 months ago)
- Topics: iced, roc-lang
- Language: Rust
- Homepage:
- Size: 143 KB
- Stars: 12
- Watchers: 2
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- roc-awesome - tarkah/roc-iced
README
# Roc Iced
A [Roc](https://github.com/roc-lang/roc) plaform for building [Iced](https://github.com/iced-rs/iced) applications.
## Example
Run the basic example: `roc run examples/basic.roc`
![demo](./assets/demo.gif)
```elm
app [program, Model, Message] {
iced: platform "../platform/main.roc",
}import iced.Color
import iced.Element.Container as Container
import iced.Element.Container exposing [container]
import iced.Element exposing [Element]
import iced.Settings exposing [Settings]program = { init, update, view }
Model : { count : U64, isFooChecked : Bool, isBarChecked : Bool, input : Str }
Message : [
IncrementCount,
FooToggled Bool,
BarToggled Bool,
Input Str,
Submitted,
]init : { model : Model, settings : Settings }
init = {
model: { count: 0, isFooChecked: Bool.false, isBarChecked: Bool.true, input: "" },
settings: Settings.default |> Settings.size { width: 300, height: 300 },
}update : Model, Message -> Model
update = \model, message ->
when message is
IncrementCount -> { model & count: model.count + 1 }
FooToggled isFooChecked -> { model & isFooChecked }
BarToggled isBarChecked -> { model & isBarChecked }
Input input -> { model & input }
Submitted -> { model & input: "" }view : Model -> Element Message
view = \model ->
Column [
Text "Roc + Iced <3",
Button {
content: Text "Pressed $(Num.toStr model.count) times",
onPress: Active IncrementCount,
},
Checkbox {
label: "Foo",
isChecked: model.isFooChecked,
onToggle: Active FooToggled,
},
Checkbox {
label: "Bar",
isChecked: model.isBarChecked,
onToggle: Active BarToggled,
},
Checkbox {
label: "Baz",
isChecked: Bool.false,
onToggle: Disabled,
},
TextInput {
value: model.input,
width: Fixed 150,
onInput: Active Input,
onSubmit: Active Submitted,
},
]
|> boxed
|> centeredcentered = \elem ->
elem
|> container
|> Container.center Fillboxed = \elem ->
background = Some (Color.fromHex 0xcad4e0ff)
border = { width: 1, color: Color.black, radius: 3 }
style = { border, background }elem
|> container
|> Container.padding 8
|> Container.style style
```