Orange.Component.VerticalScrollableRect (orange v0.3.0)

A component that renders a vertical scrollable rectangle. When the container is overflown, a scrollbar is rendered.

Attributes

  • :height - The height of the container rect. This attribute is required.
  • :content_height - The height of the inner content. This attribute is required.
  • :scroll_offset - The vertical scroll offset. This attribute is required.
  • :children - The children of the container rect. This attribute is required.
  • :title - The title of the scrolling box. This attribute is optional.

Examples

defmodule Example do
  @behaviour Orange.Component

  import Orange.Macro

  @impl true
  def init(_attrs), do: %{state: nil}

  @impl true
  def render(_state, attrs, _update) do
    total_items = 30

    rect style: [width: 20, height: 20, border: attrs[:highlight]] do
      {
        Orange.Component.VerticalScrollableRect,
        height: 20,
        content_height: total_items,
        scroll_offset: 5,
        children: for(i <- 1..total_items, do: "Item #{i}")
      }
    end
  end
end

rendered result

For more examples, see examples/scrollable_rect.exs.