Field

1 つのコントロールをラベル、説明、検証状態、エラーメッセージに関連付けます。

デモを読み込み中…

let field = Field::new("email");
field
    .root().flex_col().gap(6.0)
    .child(field.label_with(text("Email")))
    .child(text_input(value))

#インポート

quickgui から Field をインポートします。

use quickgui::*;

#使い方

let field = Field::new("email");
field
    .root().flex_col().gap(6.0)
    .child(field.label_with(text("Email")))
    .child(text_input(value))

#構成

Field::root
Field::item
Field::label
Field::control
Field::validity
Field::description
Field::error

#API リファレンス

項目を展開すると説明と完全なシグネチャが表示されます。ダッシュは宣言に既定値が記載されていないことを示します。

`Field`

ソースを見る

pub fn new(control_id: impl Into<ElementId>) -> Self

control_idpub const fn control_id(&self) -> ElementId—

Configures control id for this part.

pub const fn control_id(&self) -> ElementId

ソースを見る

root_idpub fn root_id(&self) -> ElementId—

Configures root id for this part.

pub fn root_id(&self) -> ElementId

ソースを見る

label_idpub fn label_id(&self) -> ElementId—

Configures label id for this part.

pub fn label_id(&self) -> ElementId

ソースを見る

description_idpub fn description_id(&self) -> ElementId—

Configures description id for this part.

pub fn description_id(&self) -> ElementId

ソースを見る

error_idpub fn error_id(&self) -> ElementId—

Configures error id for this part.

pub fn error_id(&self) -> ElementId

ソースを見る

item_idpub fn item_id(&self) -> ElementId—

Stable identity of the item wrapper around one label/control/description row.

pub fn item_id(&self) -> ElementId

ソースを見る

validity_idpub fn validity_id(&self) -> ElementId—

Stable identity of the validity part.

pub fn validity_id(&self) -> ElementId

ソースを見る

statepub const fn state(&self) -> FieldState—

Configures state for this part.

pub const fn state(&self) -> FieldState

ソースを見る

disabledpub fn disabled(mut self, disabled: bool) -> Self—

Configures disabled for this part.

pub fn disabled(mut self, disabled: bool) -> Self

ソースを見る

invalidpub fn invalid(mut self, invalid: bool) -> Self—

Configures invalid for this part.

pub fn invalid(mut self, invalid: bool) -> Self

ソースを見る

requiredpub fn required(mut self, required: bool) -> Self—

Configures required for this part.

pub fn required(mut self, required: bool) -> Self

ソースを見る

touchedpub fn touched(mut self, touched: bool) -> Self—

Configures touched for this part.

pub fn touched(mut self, touched: bool) -> Self

ソースを見る

dirtypub fn dirty(mut self, dirty: bool) -> Self—

Configures dirty for this part.

pub fn dirty(mut self, dirty: bool) -> Self

ソースを見る

filledpub fn filled(mut self, filled: bool) -> Self—

Configures filled for this part.

pub fn filled(mut self, filled: bool) -> Self

ソースを見る

validation_modepub const fn validation_mode(mut self, mode: FieldValidationMode) -> Self—

Declare when the controlled validity is expected to be recomputed, Base UI's `validationMode`.

pub const fn validation_mode(mut self, mode: FieldValidationMode) -> Self

ソースを見る

validation_debouncepub fn validation_debounce(mut self, debounce: Duration) -> Self—

Wait this long after a change before revalidating, Base UI's `validationDebounceTime`. The interval is an exact one-shot deadline the application schedules with [`crate::AsyncViewContext::sleep`]; QuickGUI never polls, and a field that is not being typed into owns nothing. It applies to [`FieldValidationTrigger::Change`] only — a blur or a submit is a deliberate boundary and validates immediately. Clamped to [`MAX_FIELD_VALIDATION_DEBOUNCE`].

pub fn validation_debounce(mut self, debounce: Duration) -> Self

ソースを見る

validation_mode_valuepub const fn validation_mode_value(&self) -> FieldValidationMode—

Configures validation mode value for this part.

pub const fn validation_mode_value(&self) -> FieldValidationMode

ソースを見る

validation_debounce_valuepub const fn validation_debounce_value(&self) -> Duration—

Configures validation debounce value for this part.

pub const fn validation_debounce_value(&self) -> Duration

ソースを見る

should_validatepub const fn should_validate(&self, trigger: FieldValidationTrigger) -> bool—

Whether the declared mode expects this event to recompute validity. A submit always validates; a blur validates on `OnBlur` and `OnChange`; a change validates only on `OnChange`.

pub const fn should_validate(&self, trigger: FieldValidationTrigger) -> bool

ソースを見る

validation_delaypub const fn validation_delay(&self, trigger: FieldValidationTrigger) -> Option<Duration>—

How long to wait before recomputing validity for this event, when it validates at all. Returns `None` when the declared mode ignores the event, and `Some(Duration::ZERO)` when it validates immediately, so a listener can branch once instead of re-deriving the policy.

pub const fn validation_delay(&self, trigger: FieldValidationTrigger) -> Option<Duration>

ソースを見る

validation_messagepub fn validation_message(mut self, message: impl Into<Arc<str>>) -> Self—

Retain the message used by form reports and native accessibility. The visible error part remains application-owned and can use different presentation copy.

pub fn validation_message(mut self, message: impl Into<Arc<str>>) -> Self

ソースを見る

validation_message_textpub fn validation_message_text(&self) -> Option<&str>—

Configures validation message text for this part.

pub fn validation_message_text(&self) -> Option<&str>

ソースを見る

validation_message_is_truncatedpub const fn validation_message_is_truncated(&self) -> bool—

Configures validation message is truncated for this part.

pub const fn validation_message_is_truncated(&self) -> bool

ソースを見る

`Field::root_with`

ソースを見る

pub fn root_with(&self, root: Element) -> Element

Decorate an application-owned structural root without adding role or appearance.

`Field::root`

ソースを見る

pub fn root(&self) -> Element

Create the unstyled root part. Use [`Self::root_with`] to supply an existing element.

`Field::label_with`

ソースを見る

pub fn label_with(&self, label: Element) -> Element

Decorate a visible label and give it native label-to-control activation. Use [`Self::passive_label_with`] for button-like controls whose label should name but not activate them.

`Field::label`

ソースを見る

pub fn label(&self) -> Element

Create the unstyled label part. Use [`Self::label_with`] to supply an existing element.

`Field::passive_label_with`

ソースを見る

pub fn passive_label_with(&self, label: Element) -> Element

Decorate a label relationship without forwarding pointer activation to the control.

`Field::passive_label`

ソースを見る

pub fn passive_label(&self) -> Element

Create the unstyled passive label part. Use [`Self::passive_label_with`] to supply an existing element.

`Field::control_with`

ソースを見る

pub fn control_with(&self, control: Element) -> Element

Decorate the application-owned control with field state and mounted relationships.

`Field::control`

ソースを見る

pub fn control(&self) -> Element

Create the unstyled control part. Use [`Self::control_with`] to supply an existing element.

`Field::item_with`

ソースを見る

pub fn item_with(&self, item: Element) -> Element

Decorate the caller-owned wrapper around one label/control/description row. Base UI's Field.Item groups the parts of a single field inside a larger fieldset so the row can be styled and laid out as one unit. QuickGUI supplies the stable identity and propagates the field's disabled state; layout and appearance stay application-owned.

`Field::item`

ソースを見る

pub fn item(&self) -> Element

Create the unstyled item part. Use [`Self::item_with`] to supply an existing element.

`Field::validity_with`

ソースを見る

pub fn validity_with(&self, visible: bool, validity: Element) -> Element

Decorate a caller-owned part that is shown only for a chosen validity, Base UI's Field.Validity. `visible` is the application's own predicate over [`Self::state`] — "invalid and touched", "valid and dirty", whatever the product means. QuickGUI removes the part from layout, paint, input, and the accessibility tree when the predicate is false, exactly as [`Self::error_with`] does, so an unmatched validity costs nothing.

`Field::validity`

ソースを見る

pub fn validity(&self, visible: bool) -> Element

Create the unstyled validity part. Use [`Self::validity_with`] to supply an existing element.

`Field::description_with`

ソースを見る

pub fn description_with(&self, description: Element) -> Element

Decorate visible supplementary help for the control.

`Field::description`

ソースを見る

pub fn description(&self) -> Element

Create the unstyled description part. Use [`Self::description_with`] to supply an existing element.

`Field::error_with`

ソースを見る

pub fn error_with(&self, error: Element) -> Element

Decorate a visible error and remove it from layout while the controlled field is valid.

`Field::error`

ソースを見る

pub fn error(&self) -> Element

Create the unstyled error part. Use [`Self::error_with`] to supply an existing element.