Raxol.Core.Renderer.View (Raxol v0.5.0)
View SourceProvides view-related functionality for rendering UI components.
Summary
Types
Style options for a view. Typically a list of atoms, e.g., [:bold, :underline].
See Raxol.Core.Renderer.View.Types.style/0
for details.
Functions
Wraps a view with a border using a block style.
Wraps a view with a border using a bold style.
Creates a new border around a view.
Macro for creating a border around a view with a do-block for children.
Creates a new box view with padding and optional border.
Creates a simple box element with the given options.
Creates a button element.
Creates a checkbox element.
Creates a new column layout.
Wraps a view with a border using a double line style.
Calculates flex layout dimensions based on the given constraints. Returns a map with calculated width and height.
Creates a new flex container.
Creates a grid layout with the given options and block.
Applies layout to a view, calculating absolute positions for all elements. Delegates to Raxol.Renderer.Layout.apply_layout/2.
Creates a new view with the specified type and options.
Creates a new panel view (box with border and children).
Wraps a view with a border using a rounded style.
Creates a new row layout.
Macro for creating a row layout with a do-block for children.
Creates a new scrollable view.
Macro for creating a scrollable view with a do-block for children.
Wraps a view with a border using a simple style.
Creates a new text view.
Creates a text input element.
Renders a view with the given options.
Wraps a view with a border, optionally with a title and style.
Types
@type style() :: Raxol.Core.Renderer.View.Types.style()
Style options for a view. Typically a list of atoms, e.g., [:bold, :underline].
See Raxol.Core.Renderer.View.Types.style/0
for details.
Functions
Wraps a view with a border using a block style.
Parameters
view
- The view to wrap with a borderopts
- Options for the border:title
- Optional title to display in the border:align
- Title alignment (:left
,:center
,:right
)
Examples
View.block_border(view)
View.block_border(view, title: "Title")
Wraps a view with a border using a bold style.
Parameters
view
- The view to wrap with a borderopts
- Options for the border:title
- Optional title to display in the border:align
- Title alignment (:left
,:center
,:right
)
Examples
View.bold_border(view)
View.bold_border(view, title: "Title")
Creates a new border around a view.
Options
:style
- Border style:title
- Title for the border:fg
- Foreground color:bg
- Background color
Examples
View.border(view, style: :single)
View.border(view, title: "Title", style: :double)
Macro for creating a border around a view with a do-block for children.
Examples
View.border_wrap style: [:bold] do
[View.text("A"), View.text("B")]
end
View.border_wrap :single, style: [:bold] do
[View.text("A"), View.text("B")]
end
Creates a new box view with padding and optional border.
Parameters
opts
- Options for the box:padding
- Padding around the content (default: 0):border
- Border style (:none
,:single
,:double
,:rounded
,:bold
,:block
,:simple
):children
- Child views to place inside the box:size
- Size of the box {width, height}:style
- Style options for the box
Examples
View.box(padding: 2)
View.box(padding: 2, border: :single)
View.box(style: [border: :double, padding: 1], children: [text("Hello")])
Creates a simple box element with the given options.
Creates a button element.
Options
:on_click
- Event handler for click events:aria_label
- Accessibility label:aria_description
- Accessibility description:style
- Style options for the button
Examples
View.button("Click Me", on_click: {:button_clicked})
View.button("Submit", aria_label: "Submit form")
Creates a checkbox element.
Options
:checked
- Whether the checkbox is checked (default: false):on_toggle
- Event handler for toggle events:aria_label
- Accessibility label:aria_description
- Accessibility description:style
- Style options for the checkbox
Examples
View.checkbox("Enable Feature", checked: true)
View.checkbox("Accept Terms", on_toggle: {:terms_toggled})
Creates a new column layout.
Options
:children
- Child views:align
- Alignment of children:justify
- Justification of children:gap
- Gap between children
Examples
View.column do
[text("Hello"), text("World")]
end
View.column align: :center, gap: 2 do
[text("A"), text("B")]
end
Wraps a view with a border using a double line style.
Parameters
view
- The view to wrap with a borderopts
- Options for the border:title
- Optional title to display in the border:align
- Title alignment (:left
,:center
,:right
)
Examples
View.double_border(view)
View.double_border(view, title: "Title")
Calculates flex layout dimensions based on the given constraints. Returns a map with calculated width and height.
Creates a new flex container.
Options
:direction
- Flex direction (:row or :column):children
- Child views:align
- Alignment of children:justify
- Justification of children:gap
- Gap between children:wrap
- Whether to wrap children
Examples
View.flex(direction: :column, children: [text("Hello"), text("World")])
View.flex(align: :center, gap: 2, wrap: true)
Creates a grid layout with the given options and block.
Options
:columns
- Number of columns in the grid:rows
- Number of rows in the grid:gap
- Gap between grid items:align
- Alignment of grid items:justify
- Justification of grid items
Examples
View.grid(columns: 2, gap: 2) do
[text("A"), text("B"), text("C"), text("D")]
end
Applies layout to a view, calculating absolute positions for all elements. Delegates to Raxol.Renderer.Layout.apply_layout/2.
Creates a new view with the specified type and options.
Options
:type
- The type of view to create:position
- Position of the view {x, y}:z_index
- Z-index for layering:size
- Size of the view {width, height}:style
- Style options for the view:fg
- Foreground color:bg
- Background color:border
- Border style:padding
- Padding around the view:margin
- Margin around the view:children
- Child views:content
- Content for the view
Examples
View.new(:box, size: {80, 24})
View.new(:text, content: "Hello", fg: :red)
Creates a new panel view (box with border and children).
Options
:children
- Child views:border
- Border style (default: :single):padding
- Padding inside the panel (default: 1):style
- Additional style options:title
- Optional title for the panel:fg
- Foreground color:bg
- Background color
Examples
View.panel(children: [View.text("Hello")])
View.panel(border: :double, title: "Panel")
NOTE: Only panel/1 (with a keyword list) is supported. Update any panel/2 usages to panel/1.
Wraps a view with a border using a rounded style.
Parameters
view
- The view to wrap with a borderopts
- Options for the border:title
- Optional title to display in the border:align
- Title alignment (:left
,:center
,:right
)
Examples
View.rounded_border(view)
View.rounded_border(view, title: "Title")
Creates a new row layout.
Options
:children
- Child views:align
- Alignment of children:justify
- Justification of children:gap
- Gap between children
Examples
View.row do
[text("Hello"), text("World")]
end
View.row align: :center, gap: 2 do
[text("A"), text("B")]
end
Macro for creating a row layout with a do-block for children.
Examples
View.row style: [:bold] do
[View.text("A"), View.text("B")]
end
Creates a new scrollable view.
Options
:viewport
- Viewport size {width, height}:offset
- Initial scroll offset {x, y}:scrollbars
- Whether to show scrollbars:fg
- Foreground color:bg
- Background color
Examples
View.scroll(view, viewport: {80, 24})
View.scroll(view, offset: {0, 10}, scrollbars: true)
Macro for creating a scrollable view with a do-block for children.
Examples
View.scroll_wrap viewport: {80, 24} do
[View.text("A"), View.text("B")]
end
Wraps a view with a border using a simple style.
Parameters
view
- The view to wrap with a borderopts
- Options for the border:title
- Optional title to display in the border:align
- Title alignment (:left
,:center
,:right
)
Examples
View.simple_border(view)
View.simple_border(view, title: "Title")
Creates a new text view.
Options
:content
- The text content:fg
- Foreground color:bg
- Background color:style
- Text style options:align
- Text alignment:wrap
- Text wrapping mode
Examples
View.text("Hello", fg: :red)
View.text("World", style: [bold: true, underline: true])
Creates a text input element.
Options
:value
- Current value of the input (default: ""):placeholder
- Placeholder text:on_change
- Event handler for change events:aria_label
- Accessibility label:aria_description
- Accessibility description:style
- Style options for the input
Examples
View.text_input(placeholder: "Enter your name...")
View.text_input(value: "John", on_change: {:name_changed})
Renders a view with the given options.
Parameters
- _options: A keyword list of rendering options
- _block: A block containing the view content
Returns
- A rendered view
Wraps a view with a border, optionally with a title and style.
Parameters
view
- The view to wrap with a borderopts
- Options for the border:title
- Optional title to display in the border:style
- Border style (:single
,:double
,:rounded
,:bold
,:block
,:simple
):align
- Title alignment (:left
,:center
,:right
)
Examples
View.border_wrap(view, style: :single)
View.border_wrap(view, title: "Title", style: :double)