API ReferenceDesign Systems
TextField & TextArea
Styled single-line and multiline inputs with submit and change handlers.
Input = TextField (base-UI terminology; TextField is the compat name).
| Input | Lines | Submit |
|---|---|---|
TextField / Input | Single | on_submit + on_changed |
TextArea | Multiple | on_changed only |
DocumentEditor | Multiple, long documents | on_changed only |
use incular::prelude::*;
use incular::controls_prelude::{TextArea, TextField};
fn main() {
let app = Application::new(|_cx| {
Container::builder()
.padding(EdgeInsets::all(24.0))
.alignment(Alignment::CENTER)
.child(
Column::builder()
.main_axis_size(MainAxisSize::Min)
.spacing(8.0)
.children(Vec::<Widget>::from([
TextField::new(TextEditingController::with_text(
"",
))
.placeholder("Name")
.on_submit(|value| println!("submit: {value}")).into(),
TextArea::new(TextEditingController::with_text(
"Bio",
))
.placeholder("Bio").into(),
]))
.build(),
)
.build()
.into()
})
.expect("valid application");
incular::run(app).expect("run application");
}DocumentEditor looks and behaves like TextArea but lays its text out line
by line with EditableText::paragraph_layout. An edit lays out only the lines
it changes, so typing near the top of a file of thousands of lines costs about
as much as typing at its end. Use it for source files, logs and other long
documents; TextArea keeps Flutter's whole-text layout, which suits short text.
use incular::controls_prelude::DocumentEditor;
let source = std::fs::read_to_string("main.rs").unwrap_or_default();
let editor = DocumentEditor::new(TextEditingController::with_text(source))
.size(Size::new(800.0, 600.0))
.on_changed(|text| println!("{} bytes", text.len()));TextFieldStyle { background, foreground, placeholder_color, border, border_focused, border_radius, padding } — all Option.
Related: EditableText,
Form.