GRadio

A radio button widget with customizable colors, cursor behavior, and animations for hover and selection states.

Example

#![allow(unused)]
fn main() {
use makepad_widgets::*;

live_design! {
    import makepad_widgets::base::*;
    import makepad_widgets::theme_desktop_dark::*; 
    import gen_components::components::*;

    GRadioExample = <ScrollYView>{
        height: 150.0,
        width: Fill,
        spacing: 10.0,
        flow: Down,
        <GLabel>{
            text: "GRadio"
        }
        <GRadio>{
            height: 30.0,
            width: 60.0,
        }
        <GRadio>{
            theme: Warning,
            height: 30.0,
            width: 60.0,
            radio_type: Tick,
        }
        <GRadio>{
            theme: Success,
            height: 30.0,
            width: 60.0,
            size: 12.0,
            scale: 0.6,
            border_width: 2.0,
            radio_type: Round,
            background_color: #000,
            selected_color: #42A5F5,
            hover_color: #FF7043,
            border_color: #76828F,
        }
        <GRadio>{
            theme: Dark,
            height: 30.0,
            width: 60.0,
            size: 12.0,
            radio_type: Tick,
        }
        <GRadio>{
            theme: Error,
            height: 30.0,
            width: 60.0,
           
            radio_type: Cross,
        }
    }
}
}

Props

decoratenametypedescription
livethemeThemesThe theme applied to the radio button.
livesizef32The size of the radio button.
livebackground_colorOption<Vec4>The background color of the radio button.
livehover_colorOption<Vec4>The color of the radio button when hovered.
livefocus_colorOption<Vec4>The color of the radio button when focused.
liveselected_colorOption<Vec4>The color of the radio button when selected.
liveborder_colorOption<Vec4>The border color of the radio button.
liveborder_widthf32The width of the radio button's border.
livescalef32The scale of the radio button.
livecursorOption<MouseCursor>The cursor type when hovering over the radio button.
livevalueStringThe value associated with the radio button.
liveradio_typeGChooseTypeThe type of the radio button.
redrawdraw_radioDrawGRadioThe component used for drawing the radio button.
walkwalkWalkThe positioning properties for the radio button.
layoutlayoutLayoutThe layout properties for the radio button.
animatoranimatorAnimatorThe animation properties for the radio button.

Event

namedescription
ClickedTriggered when the radio button is clicked, carrying the associated value.
HoverTriggered when the radio button is hovered.

Note: Events with None are omitted.