From 52d45d3b609a99cddb1706a9508c543cd99989fa Mon Sep 17 00:00:00 2001 From: alanpoon Date: Wed, 9 Oct 2024 14:11:24 +0800 Subject: [PATCH 1/5] added _animation for fade away for typing_notice --- src/home/room_screen.rs | 60 ++++++++++++++++++++++++++++++++++------- 1 file changed, 50 insertions(+), 10 deletions(-) diff --git a/src/home/room_screen.rs b/src/home/room_screen.rs index 37aaa5fd..67c14a11 100644 --- a/src/home/room_screen.rs +++ b/src/home/room_screen.rs @@ -82,6 +82,7 @@ live_design! { COLOR_OVERLAY_BG = #x000000d8 COLOR_READ_MARKER = #xeb2733 COLOR_PROFILE_CIRCLE = #xfff8ee + TYPING_NOTICE_ANIMATION_DURATION = 1 FillerY = {width: Fill} @@ -711,7 +712,7 @@ live_design! { } - { + chat = { width: Fill, height: Fill, flow: Overlay, show_bg: true @@ -719,7 +720,7 @@ live_design! { color: (COLOR_PRIMARY_DARKER) } - { + keyboard = { width: Fill, height: Fill, flow: Down, @@ -923,6 +924,21 @@ live_design! { user_profile_sliding_pane = { } } } + animator: { + typing_notice = { + default: default, + default = { + redraw: true, + from: { all: Forward { duration: (0) } } + apply: { chat = { keyboard = { typing_notice = { height: 40 } } } } + } + collapse = { + redraw: true, + from: { all: Forward { duration: (TYPING_NOTICE_ANIMATION_DURATION) } } + apply: { chat = { keyboard = { typing_notice = { height: 0 } } } } + } + } + } } } @@ -939,6 +955,9 @@ struct RoomScreen { #[rust] tl_state: Option, /// 5 secs timer when scroll ends #[rust] fully_read_timer: Timer, + #[animator] animator: Animator, + /// Animation Timer for Typing Notice + #[rust] typing_notice_timer: Timer, } impl RoomScreen{ @@ -1271,6 +1290,17 @@ impl Widget for RoomScreen { cx.stop_timer(self.fully_read_timer); } + if self.typing_notice_timer.is_event(event).is_some() { + cx.stop_timer(self.typing_notice_timer); + self.view(id!(typing_notice)).set_visible(false); + let typing_animation = self.view.typing_animation(id!(typing_animation)); + typing_animation.stop_animation(); + self.animator_play(cx, id!(typing_notice.default)); + } + if self.animator_handle_event(cx, event).must_redraw() { + self.redraw(cx); + } + // Only forward visibility-related events (touch/tap/scroll) to the inner timeline view // if the user profile sliding pane is not visible. if event.requires_visibility() && pane.is_currently_shown(cx) { @@ -1422,6 +1452,7 @@ impl RoomScreen { let mut done_loading = false; let mut num_updates = 0; + let mut is_typing = false; while let Ok(update) = tl.update_receiver.try_recv() { num_updates += 1; match update { @@ -1544,15 +1575,11 @@ impl RoomScreen { } } }; - let is_typing = !users.is_empty(); - self.view.view(id!(typing_notice)).set_visible(is_typing); - self.view.label(id!(typing_label)).set_text(&typing_text); - let typing_animation = self.view.typing_animation(id!(typing_animation)); - if is_typing { - typing_animation.animate(cx); - } else { - typing_animation.stop_animation(); + is_typing = !users.is_empty(); + if typing_text != "" { + self.view.label(id!(typing_label)).set_text(&typing_text); } + } } } @@ -1565,6 +1592,14 @@ impl RoomScreen { // log!("Applied {} timeline updates for room {}, redrawing with {} items...", num_updates, tl.room_id, tl.items.len()); self.redraw(cx); } + if is_typing { + let typing_animation = self.view.typing_animation(id!(typing_animation)); + self.view.view(id!(typing_notice)).set_visible(true); + typing_animation.animate(cx); + } else { + self.start_typing_notice_animation(cx); + } + } /// Shows the user profile sliding pane with the given avatar info. @@ -1796,6 +1831,11 @@ impl RoomScreen { self.show_timeline(cx); self.label(id!(room_name)).set_text(&self.room_name); } + /// Start Typing Notice animation that fades away + pub fn start_typing_notice_animation(&mut self, cx: &mut Cx) { + self.animator_play(cx, id!(typing_notice.collapse)); + self.typing_notice_timer = cx.start_interval(1.5); + } } impl RoomScreenRef { From 5f783af092cfe18dd4103e9ab6b4f5de33ea6ce9 Mon Sep 17 00:00:00 2001 From: alanpoon Date: Sat, 12 Oct 2024 10:45:03 +0800 Subject: [PATCH 2/5] resolve conflict + slide upwards --- src/home/room_screen.rs | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/home/room_screen.rs b/src/home/room_screen.rs index 62c3a0af..9b4d6201 100644 --- a/src/home/room_screen.rs +++ b/src/home/room_screen.rs @@ -76,7 +76,7 @@ live_design! { COLOR_OVERLAY_BG = #x000000d8 COLOR_READ_MARKER = #xeb2733 COLOR_PROFILE_CIRCLE = #xfff8ee - TYPING_NOTICE_ANIMATION_DURATION = 1.5 + TYPING_NOTICE_ANIMATION_DURATION = 1 FillerY = {width: Fill} @@ -985,12 +985,12 @@ live_design! { default = { redraw: true, from: { all: Forward { duration: (0) } } - apply: { chat = { keyboard = {typing_notice = { height: 30 } } } } + apply: { chat = { keyboard = {typing_notice = { align:{ y: 0}}} } } } collapse = { redraw: true, from: { all: Forward { duration: (TYPING_NOTICE_ANIMATION_DURATION) } } - apply: { chat = { keyboard = {typing_notice = { height: 0 } } }} + apply: { chat = { keyboard = {typing_notice = { align: {y: -100} } } }} } } } @@ -1952,7 +1952,7 @@ impl RoomScreen { /// Start Typing Notice animation that fades away pub fn start_typing_notice_animation(&mut self, cx: &mut Cx) { self.animator_play(cx, id!(typing_notice.collapse)); - self.typing_notice_timer = cx.start_interval(1.5); + self.typing_notice_timer = cx.start_interval(1.0); } } From 2da9fa6b4bebe364a45da7ecd53cdffd7d272bc9 Mon Sep 17 00:00:00 2001 From: alanpoon Date: Sat, 12 Oct 2024 11:17:07 +0800 Subject: [PATCH 3/5] Slide up typing_notice and code refactor --- src/home/room_screen.rs | 25 ++++++------------------- 1 file changed, 6 insertions(+), 19 deletions(-) diff --git a/src/home/room_screen.rs b/src/home/room_screen.rs index 9b4d6201..b2c4a2d8 100644 --- a/src/home/room_screen.rs +++ b/src/home/room_screen.rs @@ -76,7 +76,7 @@ live_design! { COLOR_OVERLAY_BG = #x000000d8 COLOR_READ_MARKER = #xeb2733 COLOR_PROFILE_CIRCLE = #xfff8ee - TYPING_NOTICE_ANIMATION_DURATION = 1 + TYPING_NOTICE_ANIMATION_DURATION = 0.75 FillerY = {width: Fill} @@ -984,13 +984,13 @@ live_design! { default: default, default = { redraw: true, - from: { all: Forward { duration: (0) } } - apply: { chat = { keyboard = {typing_notice = { align:{ y: 0}}} } } + from: { all: Forward { duration: (TYPING_NOTICE_ANIMATION_DURATION) } } + apply: { chat = { keyboard = {typing_notice = { height: 30}} } } } collapse = { redraw: true, from: { all: Forward { duration: (TYPING_NOTICE_ANIMATION_DURATION) } } - apply: { chat = { keyboard = {typing_notice = { align: {y: -100} } } }} + apply: { chat = { keyboard = {typing_notice = { height: 0 } } }} } } } @@ -1011,8 +1011,6 @@ pub struct RoomScreen { /// 5 secs timer when scroll ends #[rust] fully_read_timer: Timer, #[animator] animator: Animator, - /// Animation Timer for Typing Notice - #[rust] typing_notice_timer: Timer, } impl RoomScreen{ @@ -1384,13 +1382,6 @@ impl Widget for RoomScreen { cx.stop_timer(self.fully_read_timer); } - if self.typing_notice_timer.is_event(event).is_some() { - cx.stop_timer(self.typing_notice_timer); - self.view(id!(typing_notice)).set_visible(false); - let typing_animation = self.view.typing_animation(id!(typing_animation)); - typing_animation.stop_animation(); - self.animator_play(cx, id!(typing_notice.default)); - } if self.animator_handle_event(cx, event).must_redraw() { self.redraw(cx); } @@ -1689,9 +1680,10 @@ impl RoomScreen { if is_typing { let typing_animation = self.view.typing_animation(id!(typing_animation)); self.view.view(id!(typing_notice)).set_visible(true); + self.animator_play(cx, id!(typing_notice.default)); typing_animation.animate(cx); } else { - self.start_typing_notice_animation(cx); + self.animator_play(cx, id!(typing_notice.collapse)); } } @@ -1949,11 +1941,6 @@ impl RoomScreen { } } - /// Start Typing Notice animation that fades away - pub fn start_typing_notice_animation(&mut self, cx: &mut Cx) { - self.animator_play(cx, id!(typing_notice.collapse)); - self.typing_notice_timer = cx.start_interval(1.0); - } } impl RoomScreenRef { From edc7e9735adfc54b521321818e8b5666f2938dda Mon Sep 17 00:00:00 2001 From: alanpoon Date: Tue, 15 Oct 2024 18:42:15 +0800 Subject: [PATCH 4/5] put back RoomScreen's drop --- src/home/room_screen.rs | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/src/home/room_screen.rs b/src/home/room_screen.rs index b2c4a2d8..9d40fbfb 100644 --- a/src/home/room_screen.rs +++ b/src/home/room_screen.rs @@ -1012,7 +1012,16 @@ pub struct RoomScreen { #[rust] fully_read_timer: Timer, #[animator] animator: Animator, } - +impl Drop for RoomScreen { + fn drop(&mut self) { + // This ensures that the `TimelineUiState` instance owned by this room is *always* returned + // back to to `TIMELINE_STATES`, which ensures that its UI state(s) are not lost + // and that other RoomScreen instances can show this room in the future. + // RoomScreen will be dropped whenever its widget instance is destroyed, e.g., + // when a Tab is closed or the app is resized to a different AdaptiveView layout. + self.hide_timeline(); + } +} impl RoomScreen{ fn send_user_read_receipts_based_on_scroll_pos( &mut self, From 2bdd8df0c693177b5c922422fc03c63220bbf155 Mon Sep 17 00:00:00 2001 From: Kevin Boos <1139460+kevinaboos@users.noreply.github.com> Date: Wed, 30 Oct 2024 00:40:07 -0700 Subject: [PATCH 5/5] speed up typing animation show/hide --- src/home/room_screen.rs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/home/room_screen.rs b/src/home/room_screen.rs index 9d40fbfb..78cdb4ae 100644 --- a/src/home/room_screen.rs +++ b/src/home/room_screen.rs @@ -76,7 +76,7 @@ live_design! { COLOR_OVERLAY_BG = #x000000d8 COLOR_READ_MARKER = #xeb2733 COLOR_PROFILE_CIRCLE = #xfff8ee - TYPING_NOTICE_ANIMATION_DURATION = 0.75 + TYPING_NOTICE_ANIMATION_DURATION = 0.55 FillerY = {width: Fill}