GInput

The GInput widget is a versatile text input field with various visual and interactive properties. It supports themes, customization of colors, borders, text properties, cursor styles, and more.

Example

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

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

    GInputExample = <ScrollYView>{
        height: 160.0,
        width: Fill,
        spacing: 10.0,
        flow:Down,
        <Label>{
            text: "GInput"
        }
        <GInput>{
            theme: Dark,   
        }
        <GInput>{
            theme: Dark,
            border_width: 2.0,
            // border_radius: 4.0,
            value: "Hello",
            placeholder: "please",
            
        }
        <GInput>{
            border_radius: 8.0,
            border_width: 2.0,
            input_type: Pwd,
        }
    }
}
}

Props

decoratenametypedescription
livethemeThemesThe theme of the input field.
livecolorOption<Vec4>The color of the text.
livebackground_colorOption<Vec4>The background color of the input field.
livehover_colorOption<Vec4>The color when the input field is hovered over.
livepressed_colorOption<Vec4>The color when the input field is pressed.
liveborder_colorOption<Vec4>The color of the border.
liveborder_widthf32The width of the border.
liveborder_radiusf32The radius of the border's corners.
liveroundboolWhether the border is rounded.
livevalueStringThe current value of the input field.
liveplaceholderStringThe placeholder text for the input field.
liveinput_typeGInputTypeThe type of input (e.g., text, password).
livedisabledboolWhether the input field is disabled.
livefont_sizef64The size of the font.
livebrightnessf32The brightness of the text.
livecurvef32The curve property for text rendering.
livetop_dropf64The top drop property for text positioning.
liveheight_factorf64The height factor for text rendering.
livewrapTextWrapThe text wrapping mode.
livefont_familyLiveDependencyThe font family used for the text.
livecursor_widthf64The width of the cursor.
livecursor_border_radiusf64The border radius of the cursor.
livecursor_margin_bottomf64The bottom margin of the cursor.
livecursor_margin_topf64The top margin of the cursor.
liveon_focus_select_allboolWhether to select all text on focus.
rustcursor_tailusizeThe tail position of the cursor.
rustcursor_headusizeThe head position of the cursor.
redrawdraw_inputDrawCardThe component used for drawing the input field.
livedraw_selectDrawCardThe component used for drawing the selection.
livedraw_cursorDrawCardThe component used for drawing the cursor.
livedraw_textDrawGTextThe component used for drawing the text.
rustundo_idu64The ID for the undo action.
rustlast_undoOption<UndoItem>The last undo item.
rustundo_stackVec<UndoItem>The stack of undo actions.
rustredo_stackVec<UndoItem>The stack of redo actions.
rustdouble_tap_startOption<(usize, usize)>The start positions for a double tap.
walkwalkWalkThe positioning properties for the input field.
layoutlayoutLayoutThe layout properties for the input field.
animatoranimatorAnimatorThe animator for handling animations.

Event

namedescription
ChangedTriggered when the text changes.
ReturnTriggered when the return key is pressed.
EscapeTriggered when the escape key is pressed.
KeyFocusTriggered when the input field gains focus.
KeyFocusLostTriggered when the input field loses focus.