cosmic::widget

Module segmented_button

source
Expand description

A widget providing a conjoined set of linear items that function in conjunction as a single button.

§Example

Add the model and a message variant in your application for handling selections.

ⓘ
use iced_core::Length;
use cosmic::theme;
use cosmic::widget::segmented_button;

enum AppMessage {
    Selected(segmented_button::Key)
}

struct App {
    model: segmented_button::SingleSelectModel,
}

Then add choices to the model, while activating the first.

ⓘ
application.model = segmented_button::Model::builder()
    .insert(|b| b.text("Choice A").data(0u16))
    .insert(|b| b.text("Choice B").data(1u16))
    .insert(|b| b.text("Choice C").data(2u16))
    .build();

Or incrementally insert items with

ⓘ
let id = application.model.insert()
    .text("Choice C")
    .icon("custom-icon")
    .data(3u16)
    .data("custom-meta")
    .id();

Then use it in the view method to create segmented button widgets.

ⓘ
let widget = segmented_button::horizontal(&application.model)
    .style(theme::SegmentedButton::ViewSeitcher)
    .button_height(32)
    .button_padding([16, 10, 16, 10])
    .button_spacing(8)
    .icon_size(16)
    .spacing(8)
    .on_activate(AppMessage::Selected);

And respond to events like so:

ⓘ
match message {
    AppMessage::Selected(id) => {
        application.model.activate(id);

        if let Some(number) = application.model.data::<u16>(id) {
            println!("activated item with number {number}");
        }

        if let Some(text) = application.text(id) {
            println!("activated button with text {text}");
        }
    }
}

Structs§

Traits§

Functions§

Type Aliases§