Module widget

The COSMIC widget library

This module contains a wide variety of widgets used throughout the COSMIC app ecosystem.

Overview

Add widgets to your application view by calling the modules and functions below. Widgets are constructed by chaining their property methods using a functional paradigm. Modules may contain additional functions for constructing different variations of a widget. Each module will typically have one widget with the same name as the module, which will be re-exported here.

use cosmic::prelude::*;
use cosmic::{cosmic_theme, theme, widget};

const REPOSITORY: &str = "https://github.com/pop-os/libcosmic";

let cosmic_theme::Spacing { space_xxs, .. } = theme::active().cosmic().spacing;

let link = widget::button::link(REPOSITORY)
    .on_press(Message::LaunchUrl(REPOSITORY))
    .padding(0);

let content = widget::column()
    .push(widget::icon::from_name("my-app-icon"))
    .push(widget::text::title3("My App Name"))
    .push(link)
    .align_items(Alignment::Center)
    .spacing(space_xxs);

Widgets may borrow data from your application struct, and should do so to avoid allocating.

let text = widget::text::body(&self.cached_text);

Use the cosmic::Apply trait to embed widgets into other widgets which accept them.

let button = widget::icon::from_name("printer-symbolic")
    .apply(widget::button::icon)
    .on_press(Message::Print);

Modules

• aspect_ratio
  A container which constraints itself to a specific aspect ratio.
• button
  Button widgets for COSMIC applications.
• calendar
  A widget that displays an interactive calendar.
• canvas
  Canvases can be leveraged to draw interactive 2D graphics.
• card
• checkbox
  Checkboxes can be used to let users make binary choices.
• color_picker
  Widgets for selecting colors with a color picker.
• column
  A container which aligns its children in a column.
• combo_box
  Combo boxes display a dropdown list of searchable and selectable options.
• container
  Containers let you align a widget inside their boundaries.
• context_drawer
  An overlayed widget that attaches a toggleable context drawer to the view.
• context_menu
  A context menu is a menu in a graphical user interface that appears upon user interaction, such as a right-click mouse operation.
• dialog
• divider
  An element to distinguish a boundary between two elements.
• dnd_destination
• dnd_source
• dropdown
  Displays a list of options in a popover menu on select.
• flex_row
  Responsively generates rows of widgets based on the dimensions of its children.
• grid
  Arrange widgets with a grid layout.
• icon
  Lazily-generated SVG icon widget for Iced.
• id_container
• image
  Images display raster graphics in different formats (PNG, JPG, etc.).
• layer_container
• list
• menu
  A MenuBar widget for displaying [MenuTree]s
• nav_bar
  Navigation side panel for switching between views.
• nav_bar_toggle
  A button for toggling the navigation side panel.
• pane_grid
  Pane grids let your users split regions of your application and organize layout dynamically.
• popover
  A widget showing a popup in an overlay positioned relative to another widget.
• progress_bar
  Progress bars visualize the progression of an extended computer operation, such as a download, file transfer, or installation.
• radio
  Create choices using radio buttons.
• rectangle_tracker
• row
  A container which aligns its children in a row.
• segmented_button
  A widget providing a conjoined set of linear items that function in conjunction as a single button.
• segmented_control
  A selection of multiple choices appearing as a conjoined button.
• settings
• slider
  Sliders let users set a value by moving an indicator.
• spin_button
  A control for incremental adjustments of a value.
• style
• svg
  Svg widgets display vector graphics in your application.
• tab_bar
  A collection of tabs for developing a tabbed interface.
• text
• text_editor
  Text editors display a multi-line text input for text editing.
• text_input
  A text input widget from iced widgets plus some added details.
• toaster
  A widget that displays toasts.
• tooltip
• vertical_slider
  Sliders let users set a value by moving an indicator.
• warning

Structs

• Button
  A generic button which emits a message when pressed.
• Calendar
• Canvas
  A widget capable of drawing 2D graphics.
• Checkbox
  A box that can be checked.
• ColorPicker
• ColorPickerModel
• ComboBox
  A widget for searching and selecting a single value from a list of options.
• Container
  A widget that aligns its contents inside of its boundaries.
• ContextDrawer
• ContextMenu
  A context menu is a menu in a graphical user interface that appears upon user interaction, such as a right-click mouse operation.
• Dialog
• DndDestination
• DndSource
• Dropdown
  A widget for selecting a single value from a list of selections.
• FlexRow
  Responsively generates rows and columns of widgets based on its dimensions.
• Grid
  Responsively generates rows and columns of widgets based on its dimmensions.
• HeaderBar
• Icon
  An image which may be an SVG or PNG.
• Id
  The identifier of a generic widget.
• IdContainer
  An element decorating some content.
• Image
  A frame that displays an image while keeping aspect ratio.
• LayerContainer
  An element decorating some content.
• Lazy
  A widget that only rebuilds its contents when necessary.
• ListColumn
• MouseArea
  Emit messages on mouse events.
• NavBarToggle
• PaneGrid
  A collection of panes distributed using either vertical or horizontal splits to completely fill the space available.
• Popover
• ProgressBar
  A bar that displays progress.
• Radio
  A circular button representing a choice.
• RectangleTracker
• Responsive
  A widget that is aware of its dimensions.
• Slider
  An horizontal bar and a handle that selects a single value from a range of values.
• Space
  An amount of empty space.
• SpinButton
• Svg
  A vector graphics image.
• TextEditor
  A multi-line text input.
• TextInput
  A field that can be filled with text.
• Toast
  Represent the data used to display a Toast
• ToastId
• Toasts
• VerticalSlider
  An vertical bar and a handle that selects a single value from a range of values.
• Warning

Traits

• Operation
  A piece of logic that can traverse the widget tree of an application in order to query or update some widget state.
• Widget
  A component that displays information and allows interaction.

Functions

• calendar
  A widget that displays an interactive calendar.
• canvas
  Creates a new Canvas.
• checkbox
  Creates a new Checkbox.
• column
  A container which aligns its children in a column.
• combo_box
  Creates a new ComboBox.
• container
  Creates a new Container with the provided content.
• context_drawer
  An overlayed widget that attaches a toggleable context drawer to the view.
• context_menu
  A context menu is a menu in a graphical user interface that appears upon user interaction, such as a right-click mouse operation.
• dialog
• dnd_destination
• dnd_source
• dropdown
  Displays a list of options in a popover menu on select.
• editable_input
  A text label whiich can transform into a text input on activation.
• flex_row
  Responsively generates rows of widgets based on the dimensions of its children.
• grid
  Arrange widgets with a grid layout.
• header_bar
• horizontal_space
  Creates a new Space widget that fills the available horizontal space.
• icon
  Create an Icon from a pre-existing Handle
• id_container
• image
  Creates a new Image.
• inline_input
  Creates a new inline TextInput.
• layer_container
• lazy
  Creates a new Lazy widget with the given data Dependency and a closure that can turn this data into a widget tree.
• list_column
• mouse_area
  A container intercepting mouse events.
• nav_bar
  Navigation side panel for switching between views.
• nav_bar_dnd
  Navigation side panel for switching between views. Can receive drag and drop events.
• nav_bar_toggle
• pane_grid
  Creates a PaneGrid with the given pane_grid::State and view function.
• popover
• progress_bar
  Creates a new ProgressBar.
• radio
• rectangle_tracking_container
• responsive
  Creates a new Responsive widget with a closure that produces its contents.
• row
  A container which aligns its children in a row.
• scrollable
• search_input
  Creates a new search TextInput.
• secure_input
  Creates a new secure TextInput.
• slider
  Creates a new Slider.
• spin_button
  Horizontal spin button widget.
• svg
  Creates a new Svg widget from the given Handle.
• text
  Creates a new Text widget with the provided content.
• text_editor
  Creates a new TextEditor.
• text_input
  Creates a new TextInput.
• toaster
  Create a new Toaster widget.
• toggler
• tooltip
• vertical_slider
  Creates a new VerticalSlider.
• vertical_space
  Creates a new Space widget that fills the available vertical space.
• vertical_spin_button
  Vertical spin button widget.
• warning
• warning_container

Type Aliases

• Column
• IconButton
• JustifyContent
  Sets the distribution of space between and around content items For Flexbox it controls alignment in the main axis For Grid it controls alignment in the inline axis
• LinkButton
• Row
• Text
  A bunch of text.
• TextButton
• Tooltip