Focus text inputs in todos example

This commit is contained in:
Héctor Ramón Jiménez 2022-07-28 03:54:02 +02:00
parent 52f84e51e9
commit 744edbd6c1
No known key found for this signature in database
GPG key ID: 140CC052C94F138E
3 changed files with 31 additions and 5 deletions

View file

@ -9,6 +9,7 @@ publish = false
iced = { path = "../..", features = ["async-std", "debug"] }
serde = { version = "1.0", features = ["derive"] }
serde_json = "1.0"
lazy_static = "1.4"
[target.'cfg(not(target_arch = "wasm32"))'.dependencies]
async-std = "1.0"

View file

@ -7,8 +7,14 @@ use iced::widget::{
use iced::window;
use iced::{Application, Element};
use iced::{Color, Command, Font, Length, Settings};
use lazy_static::lazy_static;
use serde::{Deserialize, Serialize};
lazy_static! {
static ref INPUT_ID: text_input::Id = text_input::Id::unique();
}
pub fn main() -> iced::Result {
Todos::run(Settings {
window: window::Settings {
@ -84,10 +90,11 @@ impl Application for Todos {
_ => {}
}
Command::none()
text_input::focus(INPUT_ID.clone())
}
Todos::Loaded(state) => {
let mut saved = false;
let mut task_command = Command::none();
match message {
Message::InputChanged(value) => {
@ -109,6 +116,11 @@ impl Application for Todos {
}
Message::TaskMessage(i, task_message) => {
if let Some(task) = state.tasks.get_mut(i) {
if matches!(task_message, TaskMessage::Edit) {
task_command =
text_input::focus(Task::text_input_id(i));
}
task.update(task_message);
}
}
@ -123,7 +135,7 @@ impl Application for Todos {
state.dirty = true;
}
if state.dirty && !state.saving {
let save = if state.dirty && !state.saving {
state.dirty = false;
state.saving = true;
@ -138,7 +150,9 @@ impl Application for Todos {
)
} else {
Command::none()
}
};
Command::batch(vec![task_command, save])
}
}
}
@ -163,6 +177,7 @@ impl Application for Todos {
input_value,
Message::InputChanged,
)
.id(INPUT_ID.clone())
.padding(15)
.size(30)
.on_submit(Message::CreateTask);
@ -178,12 +193,13 @@ impl Application for Todos {
.enumerate()
.filter(|(_, task)| filter.matches(task))
.map(|(i, task)| {
task.view().map(move |message| {
task.view(i).map(move |message| {
Message::TaskMessage(i, message)
})
})
.collect(),
)
.spacing(10)
.into()
} else {
empty_message(match filter {
@ -242,6 +258,10 @@ pub enum TaskMessage {
}
impl Task {
fn text_input_id(i: usize) -> text_input::Id {
text_input::Id::new(format!("task-{}", i))
}
fn new(description: String) -> Self {
Task {
description,
@ -270,7 +290,7 @@ impl Task {
}
}
fn view(&self) -> Element<TaskMessage> {
fn view(&self, i: usize) -> Element<TaskMessage> {
match &self.state {
TaskState::Idle => {
let checkbox = checkbox(
@ -297,6 +317,7 @@ impl Task {
&self.description,
TaskMessage::DescriptionEdited,
)
.id(Self::text_input_id(i))
.on_submit(TaskMessage::FinishEdition)
.padding(10);

View file

@ -322,6 +322,10 @@ impl Id {
pub fn new(id: impl Into<std::borrow::Cow<'static, str>>) -> Self {
Self(widget::Id::new(id))
}
pub fn unique() -> Self {
Self(widget::Id::unique())
}
}
pub fn focus<Message: 'static>(id: Id) -> Command<Message> {