View Source RectLayout (rect_layout v0.2.0)

Create and manipulate rectangular objects and groups of them

Use import RectLayout to import everything, or import only the methods you need.

Summary

Constructor

Creates an %RectLayout.Group{}, used to work with a group of graphical items. any modification of its x, y, width or height affects all of its children, proportionally.

Creates an %RectLayout.Rect{}, a primitive used to track info about rectangles. It does not have any other attributes except its x, y, width and height

Creates an %RectLayout.Sprite{}, which is used to track external data for a rect.

Transform

Align each item to the bottommost item

Align each item to a given y value

Align each item the leftmost item

Align each item to a given x value to the left

Align each item to the rightmost item

Align each item to a given x value to the right

Align each item to the topmost item

Align each item to a given y value

Set the height and modify the width to keep the aspect ratio For a list, apply the new height to each item in the list

Set the width and modify the height to keep the aspect ratio For a list, apply the new width to each item in the list

Distribute each item in the list vertically down to cover the assigned height with a consistent gap between items

Distribute each item in the list horizontally to the left to cover the assigned width with a consistent gap between items

Distribute each item in the list horizontally to the right to cover the assigned width with a consistent gap between items

Distribute each item in the list vertically up to cover the assigned height with a consistent gap between items

Extrude the edges of a rect outward (or inward) and keeping the position

Distribute each item in the list vertically down with a set gap

Distribute each item in the list horizontally to the left with a set gap

Distribute each item in the list horizontally to the right with a set gap

Distribute each item in the list vertically up with a set gap

Spread out each item in the list vertically down to cover the assigned height Items are spread evenly centered on their horizontal axis No overlap is allowed and items push each other down

Spread out each item in the list horizontally to the left cover the assigned width Items are spread evenly centered on their vertical axis No overlap is allowed and items push each other to the right

Spread out each item in the list horizontally to the right cover the assigned width Items are spread evenly centered on their vertical axis No overlap is allowed and items push each other to the right

Spread out each item in the list vertically up to cover the assigned height Items are spread evenly centered on their horizontal axis No overlap is allowed and items push each other down

Push item to the top of a given line. If the line is before it, don't do anything

Push item to the right of a given line. If the line is before it, don't do anything

Push item to the left of a given line. If the line is before it, don't do anything

Push item to the bottom of a given line. If the line is before it, don't do anything

Accessor

Get the bottommost y of an item or a list of items

Set the y so the bottommost part of the item is at y

Get the center x attribute of the item.

Set the center x attribute of the item. Position the item so that the new x is now its horizontal center

Get the center y attribute of the item.

Set the center y attribute of the item. Position the item so that the new y is now its vertical center

Get the children of a group

Update the children of a group When updating it will also will update the bounding rect of the group

Get the height attribute of the item. Shortcut for RectLayout.Object.height/1

Set the height attribute of the item. Shortcut for RectLayout.Object.height/2

Get the leftmost x of a list of items

Get the maximum height of a list of items

Get the maximum width of a list of items

Get the rightmost x of an item or a list of items

Set the x so the rightmost part of the item is at x

Get the content of a sprite.

Update the content of a sprite.

Create a rectangle that surrounds all the items in the list

Get the topmost y of a list of items

Get the width attribute of the item. Shortcut for RectLayout.Object.width/1

Set the width attribute of the item. Shortcut for RectLayout.Object.width/2

Get the x attribute of the item. Shortcut for RectLayout.Object.x/1

Set the x attribute of the item. Shortcut for RectLayout.Object.x/2

Get the y attribute of the item. Shortcut for RectLayout.Object.y/1

Set the y attribute of the item. Shortcut for RectLayout.Object.y/2

Constructor

@spec group([RectLayout.Object.t()]) :: RectLayout.Group.t()

Creates an %RectLayout.Group{}, used to work with a group of graphical items. any modification of its x, y, width or height affects all of its children, proportionally.

Examples

iex> group([rect(10,20),rect(5,5)])
%RectLayout.Group{
  rect: %RectLayout.Rect{x: 0, y: 0, width: 10, height: 20},
  children: [
    %RectLayout.Rect{x: 0, y: 0, width: 10, height: 20},
    %RectLayout.Rect{x: 0, y: 0, width: 5, height: 5}
  ]
}
Link to this function

rect(width, height, x \\ 0, y \\ 0)

View Source
@spec rect(width :: number(), height :: number(), x :: number(), y :: number()) ::
  RectLayout.Rect.t()

Creates an %RectLayout.Rect{}, a primitive used to track info about rectangles. It does not have any other attributes except its x, y, width and height

Examples

iex> rect(10, 20, 2, 5)
%RectLayout.Rect{x: 2, y: 5, width: 10, height: 20}

iex> rect(10, 20)
%RectLayout.Rect{x: 0, y: 0, width: 10, height: 20}
@spec sprite(RectLayout.Rect.t(), any()) :: RectLayout.Sprite.t()

Creates an %RectLayout.Sprite{}, which is used to track external data for a rect.

Examples

iex> image = "my image"
"my image"
iex> sprite(rect(10, 20), image)
%RectLayout.Sprite{
  rect: %RectLayout.Rect{x: 0, y: 0, width: 10, height: 20},
  content: "my image"
}

Transform

@spec align_bottom(items :: [RectLayout.Object.t()]) :: [RectLayout.Object.t()]

Align each item to the bottommost item

Visual

*--*
|  |
*--*         ->
      *---*      *--* *---*
      |   |      |  | |   |
      *---*     -*--*-*---*-

Examples

iex> align_bottom([rect(2, 2), rect(3, 3, 2, 2)])
[
  %RectLayout.Rect{x: 0, y: 3, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 2, width: 3, height: 3}
]
Link to this function

align_bottom(items, value)

View Source
@spec align_bottom(items :: [RectLayout.Object.t()], value :: number()) :: [
  RectLayout.Object.t()
]

Align each item to a given y value

Visual

*--*
|  |
*--*         ->
      *---*
      |   |      *--* *---*
      *---*      |  | |   |
------------    -*--*-*---*-

Examples

iex> align_bottom([rect(2, 2), rect(3, 3, 2, 2)], 6)
[
  %RectLayout.Rect{x: 0, y: 4, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 3, width: 3, height: 3}
]
@spec align_left([RectLayout.Object.t()]) :: [RectLayout.Object.t()]

Align each item the leftmost item

Visual

                  |
*--*              *--*
|  |              |  |
*--*              *--*
     *---*   ->   *---*
     |   |        |   |
     *---*        *---*
                  |

Examples

iex> align_left([rect(2, 2), rect(3, 3, 2, 2)])
[
  %RectLayout.Rect{x: 0, y: 0, width: 2, height: 2},
  %RectLayout.Rect{x: 0, y: 2, width: 3, height: 3}
]
Link to this function

align_left(items, value)

View Source
@spec align_left([RectLayout.Object.t()], value :: number()) :: [
  RectLayout.Object.t()
]

Align each item to a given x value to the left

Visual

|                    |
| *--*               *--*
| |  |               |  |
| *--*               *--*
|      *---*   ->    *---*
|      |   |         |   |
|      *---*         *---*
|                    |

Examples

iex> align_left([rect(2, 2), rect(3, 3, 2, 2)], -2)
[
  %RectLayout.Rect{x: -2, y: 0, width: 2, height: 2},
  %RectLayout.Rect{x: -2, y: 2, width: 3, height: 3}
]
@spec align_right(items :: [RectLayout.Object.t()]) :: [RectLayout.Object.t()]

Align each item to the rightmost item

Visual

                     |
*--*              *--*
|  |              |  |
*--*        ->    *--*
     *---*       *---*
     |   |       |   |
     *---*       *---*
                     |

Examples

iex> align_right([rect(2, 2), rect(3, 3, 2, 2)])
[
  %RectLayout.Rect{x: 3, y: 0, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 2, width: 3, height: 3}
]
Link to this function

align_right(items, value)

View Source
@spec align_right(items :: [RectLayout.Object.t()], value :: number()) :: [
  RectLayout.Object.t()
]

Align each item to a given x value to the right

Visual

           |            |
*--*       |         *--*
|  |       |         |  |
*--*       | ->      *--*
     *---* |        *---*
     |   | |        |   |
     *---* |        *---*
           |            |

Examples

iex> align_right([rect(2, 2), rect(3, 3, 2, 2)], 6)
[
  %RectLayout.Rect{x: 4, y: 0, width: 2, height: 2},
  %RectLayout.Rect{x: 3, y: 2, width: 3, height: 3}
]
@spec align_top([RectLayout.Object.t()]) :: [RectLayout.Object.t()]

Align each item to the topmost item

Visual

*--*            -*--*-*---*-
|  |             |  | |   |
*--*         ->  *--* *---*
      *---*
      |   |
      *---*

Examples

iex> align_top([rect(2, 2), rect(3, 3, 2, 2)])
[
  %RectLayout.Rect{x: 0, y: 0, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 0, width: 3, height: 3}
]
@spec align_top(items :: [RectLayout.Object.t()], value :: number()) :: [
  RectLayout.Object.t()
]

Align each item to a given y value

Visual

------------    -*--*-*---*-
*--*             |  | |   |
|  |             *--* *---*
*--*         ->
      *---*
      |   |
      *---*

Examples

iex> align_top([rect(2, 2), rect(3, 3, 2, 2)], -2)
[
  %RectLayout.Rect{x: 0, y: -2, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: -2, width: 3, height: 3}
]
Link to this function

constrain_height(item, value)

View Source
@spec constrain_height(items :: [RectLayout.Object.t()], value :: number()) :: [
  RectLayout.Object.t()
]
@spec constrain_height(item :: RectLayout.Object.t(), value :: number()) ::
  RectLayout.Object.t()

Set the height and modify the width to keep the aspect ratio For a list, apply the new height to each item in the list

Examples

iex> constrain_height(rect(4, 2), 4)
%RectLayout.Rect{x: 0, y: 0, width: 8.0, height: 4}

iex> constrain_height([rect(4, 2), rect(4, 8)], 4)
[
  %RectLayout.Rect{x: 0, y: 0, width: 8.0, height: 4},
  %RectLayout.Rect{x: 0, y: 0, width: 2.0, height: 4}
]
Link to this function

constrain_width(items, value)

View Source
@spec constrain_width(items :: [RectLayout.Object.t()], value :: number()) :: [
  RectLayout.Object.t()
]
@spec constrain_width(item :: RectLayout.Object.t(), value :: number()) ::
  RectLayout.Object.t()

Set the width and modify the height to keep the aspect ratio For a list, apply the new width to each item in the list

Examples

iex> constrain_width(rect(2, 4), 4)
%RectLayout.Rect{x: 0, y: 0, width: 4, height: 8.0}

iex> constrain_width([rect(2, 4), rect(8, 4)], 4)
[
  %RectLayout.Rect{x: 0, y: 0, width: 4, height: 8.0},
  %RectLayout.Rect{x: 0, y: 0, width: 4, height: 2.0}
]
Link to this function

distribute_bottom(items, height, opts \\ [])

View Source
@spec distribute_bottom(
  items :: [RectLayout.Object.t()],
  height :: number(),
  options :: distribute_bottom_option()
) :: [RectLayout.Object.t()]

Distribute each item in the list vertically down to cover the assigned height with a consistent gap between items

Visual

                   *---*      
                   |   |      |
                   *---*      |
                              |
*---*-*-*          *-----*    |
|   | | |          |     |    |
*---* | |    ->    |     |    |
|     | |          |     |  height
*-----* |          *-----*    |
|       |                     |
*-------*          *-------*  |
                   |       |  |
                   |       |  |
                   |       |  |
                   |       |  |
                   |       |  |
                   *-------*  

Examples

iex> distribute_bottom([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 12)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 4.0, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 9.0, width: 3, height: 3}
]

iex> distribute_bottom([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 12, y: 10)
[
  %RectLayout.Rect{x: 0, y: 10, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 14.0, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 19.0, width: 3, height: 3}
]
Link to this function

distribute_left(items, width, opts \\ [])

View Source
@spec distribute_left(
  items :: [RectLayout.Object.t()],
  width :: number(),
  options :: distribute_left_option()
) :: [RectLayout.Object.t()]

Distribute each item in the list horizontally to the left to cover the assigned width with a consistent gap between items

Visual

*---*-*-*         *-------*  *-----*  *---*
|   | | |         |       |  |     |  |   |
*---* | |    ->   |       |  |     |  *---*
*---*-*-*         *-------*  *-----*
                  <--------width---------->

Examples

iex> distribute_left([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 12)
[
  %RectLayout.Rect{x: -1, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: -6.0, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: -12.0, y: 2, width: 3, height: 3}
]

iex> distribute_left([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 12, x: 12)
[
  %RectLayout.Rect{x: 11, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 6.0, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 0.0, y: 2, width: 3, height: 3}
]
Link to this function

distribute_right(items, width, opts \\ [])

View Source
@spec distribute_right(
  items :: [RectLayout.Object.t()],
  width :: number(),
  options :: distribute_right_option()
) :: [RectLayout.Object.t()]

Distribute each item in the list horizontally to the right to cover the assigned width with a consistent gap between items

Visual

*---*-*-*         *---*  *-----*  *-------*
|   | | |         |   |  |     |  |       |
*---* | |    ->   *---*  |     |  |       |
*---*-*-*                *-----*  *-------*
                  <--------width---------->

Examples

iex> distribute_right([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 12)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 4.0, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 9.0, y: 2, width: 3, height: 3}
]

iex> distribute_right([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 12, x: 10)
[
  %RectLayout.Rect{x: 10, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 14.0, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 19.0, y: 2, width: 3, height: 3}
]
Link to this function

distribute_top(items, height, opts \\ [])

View Source
@spec distribute_top(
  items :: [RectLayout.Object.t()],
  height :: number(),
  options :: distribute_top_option()
) :: [RectLayout.Object.t()]

Distribute each item in the list vertically up to cover the assigned height with a consistent gap between items

Visual

                   *-------*  
                   |       |  |
                   |       |  |
                   |       |  |
*---*-*-*          |       |  |
|   | | |          |       |  |
*---* | |    ->    *-------*  |
|     | |                     |
*-----* |          *-----*    |
|       |          |     |  height
*-------*          |     |    |
                   |     |    |
                   *-----*    |
                              |
                   *---*      |
                   |   |      |
                   *---*      

Examples

iex> distribute_top([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 12)
[
  %RectLayout.Rect{x: 0, y: -1, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: -6.0, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: -12.0, width: 3, height: 3}
]

iex> distribute_top([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 12, y: 12)
[
  %RectLayout.Rect{x: 0, y: 11, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 6.0, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 0.0, width: 3, height: 3}
]
@spec extrude(item :: RectLayout.Object.t(), number()) :: RectLayout.Object.t()

Extrude the edges of a rect outward (or inward) and keeping the position

Visual

           *-------*
*---*      |       |
|   |  ->  |       |
*---*      |       |
           *-------*

Examples

iex> extrude(rect(2, 2), 1)
%RectLayout.Rect{x: -1, y: -1, width: 4, height: 4}

iex> extrude(rect(4, 4), -1)
%RectLayout.Rect{x: 1, y: 1, width: 2, height: 2}
Link to this function

flow_bottom(items, opts \\ [])

View Source
@spec flow_bottom(items :: [RectLayout.Object.t()], opts :: flow_bottom_option()) :: [
  RectLayout.Object.t()
]

Distribute each item in the list vertically down with a set gap

Options

  • :y where to start the flow from, default 0
  • :gap the gap between items, default 0

Visual

                   *---*      
                   |   |      |
                   *---*      |
*---*-*-*          *-----*    |
|   | | |          |     |    |
*---* | |    ->    |     |    |
|     | |          |     |  height
*-----* |          *-----*    |
|       |          *-------*  |
*-------*          |       |  |
                   |       |  |
                   |       |  |
                   |       |  |
                   |       |  |
                   *-------*  

Examples

iex> flow_bottom([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)])
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 3, width: 3, height: 3}
]

iex> flow_bottom([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], gap: 2)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 3, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 7, width: 3, height: 3}
]

iex> flow_bottom([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], gap: 2, y: 2)
[
  %RectLayout.Rect{x: 0, y: 2, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 5, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 9, width: 3, height: 3}
]
Link to this function

flow_left(items, opts \\ [])

View Source
@spec flow_left(items :: [RectLayout.Object.t()], opts :: flow_left_option()) :: [
  RectLayout.Object.t()
]

Distribute each item in the list horizontally to the left with a set gap

Options

  • :x where to start the flow from, default 0
  • :gap the gap between items, default 0

Visual

*---*-*-*         *-------**-----**---*
|   | | |         |       ||     ||   |
*---* | |    ->   |       ||     |*---*
*---*-*-*         *-------**-----*
                  <-------width------->

Examples

iex> flow_left([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)])
[
  %RectLayout.Rect{x: -1, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: -3, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: -6, y: 2, width: 3, height: 3}
]

iex> flow_left([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], gap: 2)
[
  %RectLayout.Rect{x: -1, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: -5, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: -10, y: 2, width: 3, height: 3}
]

iex> flow_left([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], gap: 2, x: 10)
[
  %RectLayout.Rect{x: 9, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 5, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 0, y: 2, width: 3, height: 3}
]
Link to this function

flow_right(items, opts \\ [])

View Source
@spec flow_right(items :: [RectLayout.Object.t()], opts :: flow_right_option()) :: [
  RectLayout.Object.t()
]

Distribute each item in the list horizontally to the right with a set gap

Options

  • :x where to start the flow from, default 0
  • :gap the gap between items, default 0

Visual

*---*-*-*         *---**-----**-------*
|   | | |         |   ||     ||       |
*---* | |    ->   *---*|     ||       |
*---*-*-*              *-----**-------*
                  <-------width------->

Examples

iex> flow_right([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)])
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 3, y: 2, width: 3, height: 3}
]

iex> flow_right([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], gap: 2)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 3, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 7, y: 2, width: 3, height: 3}
]

iex> flow_right([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], gap: 2, x: 2)
[
  %RectLayout.Rect{x: 2, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 5, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 9, y: 2, width: 3, height: 3}
]
Link to this function

flow_top(items, opts \\ [])

View Source
@spec flow_top(items :: [RectLayout.Object.t()], opts :: flow_top_option()) :: [
  RectLayout.Object.t()
]

Distribute each item in the list vertically up with a set gap

Options

  • :y where to start the flow from, default 0
  • :gap the gap between items, default 0

Visual

                   *-------*  
                   |       |  |
                   |       |  |
*---*-*-*          |       |  |
|   | | |          |       |  |
*---* | |    ->    |       |  |
|     | |          *-------*  |
*-----* |          *-----*    |
|       |          |     |  height
*-------*          |     |    |
                   |     |    |
                   *-----*    |
                   *---*      |
                   |   |      |
                   *---*      

Examples

iex> flow_top([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)])
[
  %RectLayout.Rect{x: 0, y: -1, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: -3, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: -6, width: 3, height: 3}
]

iex> flow_top([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], gap: 2)
[
  %RectLayout.Rect{x: 0, y: -1, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: -5, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: -10, width: 3, height: 3}
]

iex> flow_top([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], gap: 2, y: 10)
[
  %RectLayout.Rect{x: 0, y: 9, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 5, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 0, width: 3, height: 3}
]
Link to this function

spread_down(items, height, opts \\ [])

View Source
@spec spread_down(
  items :: [RectLayout.Object.t()],
  height :: number(),
  opts :: spread_down_option()
) :: [RectLayout.Object.t()]

Spread out each item in the list vertically down to cover the assigned height Items are spread evenly centered on their horizontal axis No overlap is allowed and items push each other down

Options:

  • :y from which y position to start the spread, default 0
  • :gap the minimum gap between items, default 0
  • :rows the number of rows to spread items in, you can select a bigger number than the number of items, default length(items)

Visual

                                       
                                       |
                        *---*          |
                    ----|   |------    |
                        *---*          |
                                       |
*---*-*-*                              |
|   | | |               *-----*        |
*---* | |    ->         |     |        |
|     | |           ----|     |----  height
*-----* |               |     |        |
|       |               *-----*        |
*-------*               *-------*      |
                        |       |      |
                        |       |      |
                    ----|       |--    |
                        |       |      |
                        |       |      |
                        *-------*      

Examples

iex> spread_down([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 9)
[
  %RectLayout.Rect{x: 0, y: 1.0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 3.5, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 6.0, width: 3, height: 3}
]

iex> spread_down([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 6, gap: 2)
[
  %RectLayout.Rect{x: 0, y: 0.5, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 3.5, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 7.5, width: 3, height: 3}
]

iex> spread_down([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 9, y: 2)
[
  %RectLayout.Rect{x: 0, y: 3.0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 5.5, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: 8.0, width: 3, height: 3}
]

iex(4)> spread_down([rect(1, 1, 0, 0), rect(2, 2, 1, 1)], 9, rows: 3)
[
  %RectLayout.Rect{x: 0, y: 1.0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: 3.5, width: 2, height: 2},
]
Link to this function

spread_left(items, width, opts \\ [])

View Source
@spec spread_left(
  items :: [RectLayout.Object.t()],
  width :: number(),
  opts :: spread_left_option()
) ::
  [RectLayout.Object.t()]

Spread out each item in the list horizontally to the left cover the assigned width Items are spread evenly centered on their vertical axis No overlap is allowed and items push each other to the right

Options:

  • :x from which x position to start the spread, default 0
  • :gap the minimum gap between items, default 0
  • :cols the number of columns to spread items in, you can select a bigger number than the number of items, default length(items)

Visual

                     |        |        |
*---*-*-*        *---|---* *--|--*   *-|-*
|   | | |        |   |   | |  |  |   | | |
*---* | |    ->  |   |   | |  |  |   *-|-*
*---*-*-*        *---|---* *--|--*     |
                     |        |        |
                     |        |        |
                <----------width---------->

Examples

iex> spread_left([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 9)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: -2.5, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: -6.0, y: 2, width: 3, height: 3}
]

iex> spread_left([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 6, gap: 2)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: -4, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: -9, y: 2, width: 3, height: 3}
]

iex> spread_left([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 9, x: 2)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: -2, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: -5, y: 2, width: 3, height: 3}
]

iex(4)> spread_left([rect(1, 1, 0, 0), rect(2, 2, 1, 1)], 9, cols: 3)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: -2.5, y: 1, width: 2, height: 2},
]
Link to this function

spread_right(items, width, opts \\ [])

View Source
@spec spread_right(
  items :: [RectLayout.Object.t()],
  width :: number(),
  opts :: spread_right_option()
) ::
  [RectLayout.Object.t()]

Spread out each item in the list horizontally to the right cover the assigned width Items are spread evenly centered on their vertical axis No overlap is allowed and items push each other to the right

Options:

  • :x from which x position to start the spread, default 0
  • :gap the minimum gap between items, default 0
  • :cols the number of columns to spread items in, you can select a bigger number than the number of items, default length(items)

Visual

                    |        |        |
*---*-*-*         *-|-*   *--|--* *---|---*
|   | | |         | | |   |  |  | |   |   |
*---* | |    ->   *-|-*   |  |  | |   |   |
*---*-*-*           |     *--|--* *---|---*
                    |        |        |
                    |        |        |
                <----------width---------->

Examples

iex> spread_right([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 9)
[
  %RectLayout.Rect{x: 1.0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 3.5, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 6.0, y: 2, width: 3, height: 3}
]

iex> spread_right([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 6, gap: 2)
[
  %RectLayout.Rect{x: 0.5, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 3.5, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 7.5, y: 2, width: 3, height: 3}
]

iex> spread_right([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 9, x: 2)
[
  %RectLayout.Rect{x: 3.0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 5.5, y: 1, width: 2, height: 2},
  %RectLayout.Rect{x: 8.0, y: 2, width: 3, height: 3}
]

iex(4)> spread_right([rect(1, 1, 0, 0), rect(2, 2, 1, 1)], 9, cols: 3)
[
  %RectLayout.Rect{x: 1.0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 3.5, y: 1, width: 2, height: 2},
]
Link to this function

spread_up(items, height, opts \\ [])

View Source
@spec spread_up(
  items :: [RectLayout.Object.t()],
  height :: number(),
  opts :: spread_up_option()
) :: [
  RectLayout.Object.t()
]

Spread out each item in the list vertically up to cover the assigned height Items are spread evenly centered on their horizontal axis No overlap is allowed and items push each other down

Options:

  • :y from which y position to start the spread, default 0
  • :gap the minimum gap between items, default 0
  • :rows the number of rows to spread items in, you can select a bigger number than the number of items, default length(items)

Visual

                        *-------*      
                        |       |      |
                        |       |      |
                    ----|       |--    |
                        |       |      |
                        |       |      |
*---*-*-*               *-------*      |
|   | | |               *-----*        |
*---* | |    ->         |     |        |
|     | |           ----|     |----  height
*-----* |               |     |        |
|       |               *-----*        |
*-------*                              |
                                       |
                        *---*          |
                    ----|   |------    |
                        *---*          |
                                       |
                                       

Examples

iex> spread_up([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 9)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: -2.5, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: -6.0, width: 3, height: 3}
]

iex> spread_up([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 6, gap: 2)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: -4, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: -9, width: 3, height: 3}
]

iex> spread_up([rect(1, 1, 0, 0), rect(2, 2, 1, 1), rect(3, 3, 2, 2)], 9, y: 2)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: -2, width: 2, height: 2},
  %RectLayout.Rect{x: 2, y: -5, width: 3, height: 3}
]

iex(4)> spread_up([rect(1, 1, 0, 0), rect(2, 2, 1, 1)], 9, rows: 3)
[
  %RectLayout.Rect{x: 0, y: 0, width: 1, height: 1},
  %RectLayout.Rect{x: 1, y: -2.5, width: 2, height: 2},
]
Link to this function

threshold_bottom(item, value)

View Source
@spec threshold_bottom(RectLayout.Object.t(), number()) :: RectLayout.Object.t()

Push item to the top of a given line. If the line is before it, don't do anything

Visual

 *---*      *---*
-|---|- ->  |   |
 *---*     -*---*-

Examples

iex> threshold_bottom(rect(2, 2), 5)
%RectLayout.Rect{x: 0, y: 0, width: 2, height: 2}

iex> threshold_bottom(rect(2, 2, 0, 5), 4)
%RectLayout.Rect{x: 0, y: 2, width: 2, height: 2}
Link to this function

threshold_left(item, value)

View Source
@spec threshold_left(RectLayout.Object.t(), number()) :: RectLayout.Object.t()

Push item to the right of a given line. If the line is before it, don't do anything

Visual

*|--*    |---*
||  | -> |   |
*|--*    |---*

Examples

iex> threshold_left(rect(2, 2), 1)
%RectLayout.Rect{x: 1, y: 0, width: 2, height: 2}

iex> threshold_left(rect(2, 2, 5), 1)
%RectLayout.Rect{x: 5, y: 0, width: 2, height: 2}
Link to this function

threshold_right(item, value)

View Source
@spec threshold_right(RectLayout.Object.t(), number()) :: RectLayout.Object.t()

Push item to the left of a given line. If the line is before it, don't do anything

Visual

   |         |
*--|*    *---*
|  || -> |   |
*--|*    *---*
   |         |

Examples

iex> threshold_right(rect(2, 2), 4)
%RectLayout.Rect{x: 0, y: 0, width: 2, height: 2}

iex> threshold_right(rect(2, 2, 5), 4)
%RectLayout.Rect{x: 2, y: 0, width: 2, height: 2}
Link to this function

threshold_top(item, value)

View Source
@spec threshold_top(RectLayout.Object.t(), number()) :: RectLayout.Object.t()

Push item to the bottom of a given line. If the line is before it, don't do anything

Visual

 *---*     -*---*-
-|---|- ->  |   |
 *---*      *---*

Examples

iex> threshold_top(rect(2, 2), 2)
%RectLayout.Rect{x: 0, y: 2, width: 2, height: 2}

iex> threshold_top(rect(2, 2, 0, 5), 2)
%RectLayout.Rect{x: 0, y: 5, width: 2, height: 2}

Accessor

@spec bottom(RectLayout.Object.t() | [RectLayout.Object.t()]) :: number()

Get the bottommost y of an item or a list of items

Visual

*---*
|   |
*---*
     *---*
     |   |
-----*---*-

Examples

iex> bottom(rect(2, 2)) 2 iex> bottom(rect(2, 2, 2, 2)) 4 iex> bottom([rect(2, 2), rect(2, 2, 2, 2)]) 4

Set the y so the bottommost part of the item is at y

Examples

iex> bottom(rect(2, 2), 4) %RectLayout.Rect{x: 0, y: 2, width: 2, height: 2}

@spec center_x(RectLayout.Object.t()) :: number()

Get the center x attribute of the item.

Visual

 *---*
-|---|-
 *---*

Examples

iex> center_x(rect(3, 5)) 1.5

@spec center_x(RectLayout.Object.t(), number()) :: RectLayout.Object.t()

Set the center x attribute of the item. Position the item so that the new x is now its horizontal center

Visual

 *---*
-|---|-
 *---*

Examples

iex> center_x(rect(3, 5), 5) %RectLayout.Rect{x: 3.5, y: 0, width: 3, height: 5}

@spec center_y(RectLayout.Object.t()) :: number()

Get the center y attribute of the item.

Visual

*-|-*
| | |
*-|-*

Examples

iex> center_y(rect(3, 5)) 2.5

@spec center_y(RectLayout.Object.t(), number()) :: RectLayout.Object.t()

Set the center y attribute of the item. Position the item so that the new y is now its vertical center

Visual

*-|-*
| | |
*-|-*

Examples

iex> center_y(rect(3, 5), 5) %RectLayout.Rect{x: 0, y: 2.5, width: 3, height: 5}

@spec group_children(RectLayout.Group.t()) :: [RectLayout.Object.t()]

Get the children of a group

Examples

iex> g = group([rect(10, 20), rect(5, 5)])
iex> group_children(g)
[
  %RectLayout.Rect{x: 0, y: 0, width: 10, height: 20},
  %RectLayout.Rect{x: 0, y: 0, width: 5, height: 5}
]
Link to this function

group_children(group, children)

View Source
@spec group_children(RectLayout.Group.t(), [RectLayout.Object.t()]) ::
  RectLayout.Group.t()

Update the children of a group When updating it will also will update the bounding rect of the group

Examples

iex> g = group([rect(10, 20), rect(5, 5)])
iex> group_children(g, [rect(2, 2)])
%RectLayout.Group{
  rect: %RectLayout.Rect{x: 0, y: 0, width: 2, height: 2},
  children: [
    %RectLayout.Rect{x: 0, y: 0, width: 2, height: 2}
  ]
}
@spec height(RectLayout.Object.t()) :: number()

Get the height attribute of the item. Shortcut for RectLayout.Object.height/1

Set the height attribute of the item. Shortcut for RectLayout.Object.height/2

@spec left([RectLayout.Object.t()]) :: number()

Get the leftmost x of a list of items

Visual

|
*---*
|   |
*---*
|    *---*
|    |   |
|    *---*

Examples

iex> left([rect(2, 2), rect(2, 2, 2, 2)]) 0

@spec max_height([RectLayout.Object.t()]) :: number()

Get the maximum height of a list of items

Examples

iex> max_height([rect(2, 1), rect(3, 5, 1, 1), rect(4, 4, 1, 1)]) 5

@spec max_width([RectLayout.Object.t()]) :: number()

Get the maximum width of a list of items

Examples

iex> max_width([rect(2, 1), rect(3, 5, 1, 1), rect(4, 4, 1, 1)]) 4

@spec right(RectLayout.Object.t() | [RectLayout.Object.t()]) :: number()

Get the rightmost x of an item or a list of items

Visual

--- | | | | --- |

  *---*
  |   |
  *---*
      |

Examples

iex> right(rect(2, 2)) 2 iex> right(rect(2, 2, 2, 2)) 4 iex> right([rect(2, 2), rect(2, 2, 2, 2)]) 4

Set the x so the rightmost part of the item is at x

Examples

iex> right(rect(2, 2), 4) %RectLayout.Rect{x: 2, y: 0, width: 2, height: 2}

@spec sprite_content(RectLayout.Sprite.t()) :: any()

Get the content of a sprite.

Examples

iex> s = sprite(rect(10, 20), "one")
iex> sprite_content(s)
"one"
Link to this function

sprite_content(sprite, content)

View Source
@spec sprite_content(RectLayout.Sprite.t(), any()) :: RectLayout.Sprite.t()

Update the content of a sprite.

Examples

iex> s = sprite(rect(10, 20), "one")
iex> sprite_content(s, "two")
%RectLayout.Sprite{
  rect: %RectLayout.Rect{x: 0, y: 0, width: 10, height: 20},
  content: "two"
}
@spec surrounding_rect([RectLayout.Object.t()]) :: RectLayout.Rect.t()

Create a rectangle that surrounds all the items in the list

Visual

*---*----*
|   |    |
*---*    |
|    *---*
|    |   |
*----*---*

Examples

iex> surrounding_rect([rect(2, 2), rect(2, 2, 2, 2)])
%RectLayout.Rect{x: 0, y: 0, width: 4, height: 4}
@spec top([RectLayout.Object.t()]) :: number()

Get the topmost y of a list of items

Visual

--------- | | ---

     *---*
     |   |
     *---*

Examples

iex> top([rect(2, 2), rect(2, 2, 2, 2)]) 0

@spec width(RectLayout.Object.t()) :: number()

Get the width attribute of the item. Shortcut for RectLayout.Object.width/1

Set the width attribute of the item. Shortcut for RectLayout.Object.width/2

@spec x(RectLayout.Object.t()) :: number()

Get the x attribute of the item. Shortcut for RectLayout.Object.x/1

Set the x attribute of the item. Shortcut for RectLayout.Object.x/2

@spec y(RectLayout.Object.t()) :: number()

Get the y attribute of the item. Shortcut for RectLayout.Object.y/1

Set the y attribute of the item. Shortcut for RectLayout.Object.y/2

Types

Link to this type

distribute_bottom_option()

View Source
@type distribute_bottom_option() :: [{:y, number()}]
Link to this type

distribute_left_option()

View Source
@type distribute_left_option() :: [{:x, number()}]
Link to this type

distribute_right_option()

View Source
@type distribute_right_option() :: [{:x, number()}]
Link to this type

distribute_top_option()

View Source
@type distribute_top_option() :: [{:y, number()}]
@type flow_bottom_option() :: [y: number(), gap: number()]
@type flow_left_option() :: [x: number(), gap: number()]
@type flow_right_option() :: [x: number(), gap: number()]
@type flow_top_option() :: [y: number(), gap: number()]
@type spread_down_option() :: [x: number(), gap: number(), cols: number()]
@type spread_left_option() :: [x: number(), gap: number(), cols: number()]
@type spread_right_option() :: [x: number(), gap: number(), cols: number()]
@type spread_up_option() :: [x: number(), gap: number(), cols: number()]