View
View is a general purpose container with no specific semantics that can be used for custom styling purposes. It supports Deephaven UI style props to ensure consistency with other components.
View is useful when adding padding, as flex only accepts margin.
Views accept theme colors such as accent-400. Theme colors adjust based on a user’s selected theme.
Example
from deephaven import ui
view = ui.view(
ui.text_field(label="Name"),
border_width="thin",
border_color="seafoam-800",
background_color="seafoam-300",
border_radius="medium",
padding="size-250",
)
UI recommendations
Recommendations for creating views:
- Views are analogous to HTML
<div>’s, and can be used in a similar regard to ensure consistency in styling across components. - Views lose their value when overused. Use them sparingly to avoid creating unnecessary complexity.
- A view’s height is flexible; it should accommodate the amount of content inside.
- Views should be used when a flexible layout container is needed that can handle various combinations of components (ie.,
text_fields,text_areas, or buttons).
API reference
View is a general purpose container with no specific semantics that can be used for custom styling purposes. It supports Spectrum style props to ensure consistency with other Spectrum components.
Returns: Element The rendered view.
| Parameters | Type | Default | Description |
|---|---|---|---|
| *children | Any | The content to render within the container. | |
| element_type | Literal['div', 'button', 'a'] | None | None | The type of element to render. |
| key | str | None | None | A unique identifier used by React to render elements in a list. |