Module freya_elements::elements::rect

rect is a generic element that acts as a container for other elements.

You can specify things like width, padding or even in what direction the inner elements are stacked.

Example

fn app() -> Element {
    rsx!(
        rect {
            direction: "vertical",
            label { "Hi!" }
            label { "Hi again!"}
        }
    )
}

Constants

• a11y_access_key
• a11y_author_id
• a11y_auto_complete
• a11y_auto_focus
• a11y_busy
• a11y_color_value
• a11y_column_count
• a11y_column_index
• a11y_column_index_text
• a11y_column_span
• a11y_current
• a11y_default_action_verb
• a11y_description
• a11y_disabled
• a11y_expanded
• a11y_focusable
• a11y_has_popup
• a11y_hidden
• a11y_hovered
• a11y_id
• a11y_invalid
• a11y_is_grammar_error
• a11y_is_search_match
• a11y_is_spelling_error
• a11y_is_suggestion
• a11y_keyboard_shortcut
• a11y_language
• a11y_level
• a11y_linked
• a11y_list_style
• a11y_live
• a11y_live_atomic
• a11y_max_numeric_value
• a11y_member_of
• a11y_min_numeric_value
• a11y_modal
• a11y_multiselectable
• a11y_name
• a11y_numeric_value
• a11y_numeric_value_jump
• a11y_numeric_value_step
• a11y_orientation
• a11y_placeholder
• a11y_position_in_set
• a11y_read_only
• a11y_required
• a11y_role
• a11y_role_description
• a11y_row_count
• a11y_row_index
• a11y_row_index_text
• a11y_row_span
• a11y_scroll_x
• a11y_scroll_x_max
• a11y_scroll_x_min
• a11y_scroll_y
• a11y_scroll_y_max
• a11y_scroll_y_min
• a11y_selected
• a11y_size_of_set
• a11y_sort_direction
• a11y_state_description
• a11y_toggled
• a11y_tooltip
• a11y_touch_transparent
• a11y_url
• a11y_value
• a11y_vertical_offset
• a11y_visited
• background
  Specify a color as the background of an element.
• background_opacity
  Specify the opacity of an element’s background color.
• border
  Specify borders for an element.
• canvas_reference
  Attach a canvas reference created from the use_canvas or use_canvas_with_deps hooks to enable drawing to an element.
• color
  The color attribute lets you specify the color of the text.
• content
  Specify how you want the automatic (e.g width: auto) bounds in the cross axis to be constrained for the inner elements.
• corner_radius
  Round the corners of an element by a specified radius.
• corner_smoothing
  Control the smoothing effect for rounded corners to create a “squircle” effect.
• cross_align
  cross_align
• decoration
  Specify the decoration in a text.
• decoration_color
  Specify the decoration’s color in a text.
• decoration_style
  Specify the decoration’s style in a text.
• direction
  Control how the inner elements stack.
• font_family
  With the font_family you can specify what font you want to use for the inner text.
• font_size
  You can specify the size of the text using font_size.
• font_style
  You can choose a style for a text using the font_style attribute.
• font_weight
  You can choose a weight for text using the font_weight attribute.
• font_width
  You can choose a width for a text using the font_width attribute.
• height
  Specify the height for the given element.
• layer
  Controls the stacking order of elements on the z-axis.
• letter_spacing
  Specify the spacing between characters of the text.
• line_height
  line_height
• main_align
  main_align
• margin
  Specify the margin of an element. You can do so by four different ways, just like in CSS.
• max_height
  Specify a maximum height for the given element.
• max_lines
  Determines the amount of lines that the text can have. It has unlimited lines by default.
• max_width
  Specify a maximum width for the given element.
• min_height
  Specify a minimum height for the given element. This can be useful if you use it alongside a percentage for the target size.
• min_width
  Specify a minimum width for the given element. This can be useful if you use it alongside a percentage for the target size.
• offset_x
  Moves the content inside of the container horizontally by the specified pixel amount. This attribute only supports pixels.
• offset_y
  Moves the content inside of the container vertically by the specified pixel amount. This attribute only supports pixels.
• opacity
  Specify the opacity for this element.
• overflow
  Specify how overflow should be handled.
• padding
  Specify the inner paddings of an element. You can do so by four different ways, just like in CSS.
• position
  Specify how you want the element to be positioned inside it’s parent area.
• position_bottom
  Specify the bottom position of an element when using position: "absolute" or position: "global". This supports pixels only.
• position_left
  Specify the left position of an element when using position: "absolute" or position: "global". This supports pixels only.
• position_right
  Specify the right position of an element when using position: "absolute" or position: "global". This supports pixels only.
• position_top
  Specify the top position of an element when using position: "absolute" or position: "global". This supports pixels only.
• reference
  Attach a reference to an element to track its layout and metadata.
• rotate
  Specify the rotation for this element.
• scale
  Specify the scale for this element.
• shadow
  Draw a shadow of the element.
• spacing
  Specify a space between the inner elements. Think it as a margin for every element but defined by its parent. It only applies to the side of the direction.
• text_align
  You can change the alignment of the text using the text_align attribute.
• text_height
  Specify the text height behavior.
• text_overflow
  Determines how text is treated when it exceeds its max_lines count. By default uses the clip mode, which will cut off any overflowing text, with ellipsis mode it will show ... at the end.
• text_shadow
  Specify the shadow of a text.
• visible_height
  Specify the percentage of height to be visible.
• visible_width
  Specify the percentage of width to be visible.
• width
  Specify the width for the given element.
• word_spacing
  Specify the spacing between words of the text.