From bdb4d7fe35531e14e68850ea9bd5ae7c69b3d694 Mon Sep 17 00:00:00 2001 From: Gheorghe Pinzaru Date: Mon, 6 Jul 2020 16:32:57 +0300 Subject: [PATCH] Increase long press move distance Fix android password visibility change Do not change secure-text-entry on android password visiblity Signed-off-by: Gheorghe Pinzaru --- src/quo/animated.cljs | 10 ++++----- src/quo/components/animated/pressable.cljs | 25 +++++++++++----------- src/quo/components/bottom_sheet/view.cljs | 25 ++++++++++++++-------- src/quo/components/list/item.cljs | 1 - src/quo/components/text_input.cljs | 16 ++++++++------ 5 files changed, 42 insertions(+), 35 deletions(-) diff --git a/src/quo/animated.cljs b/src/quo/animated.cljs index 44dd23b824..31a3f83df6 100644 --- a/src/quo/animated.cljs +++ b/src/quo/animated.cljs @@ -213,19 +213,19 @@ (defn with-easing [{val :value - :keys [snap-points velocity offset state easing duration on-snap] - :or {duration 250 - easing (:ease-out easings)}}] + :keys [snap-points velocity offset state easing duration + animation-over] + :or {duration 250 + animation-over (value 1) + easing (:ease-out easings)}}] (let [position (value 0) c (clock) - animation-over (value 1) interrupted (and* (eq state (:began gh/states)) (clock-running c)) vel (multiply velocity 1.5) to (snap-point position vel snap-points) finish-animation [(set offset position) (stop-clock c) - (call* [position] on-snap) (set animation-over 1)]] (block [(cond* interrupted finish-animation) diff --git a/src/quo/components/animated/pressable.cljs b/src/quo/components/animated/pressable.cljs index 4360f29f41..25756e0d22 100644 --- a/src/quo/components/animated/pressable.cljs +++ b/src/quo/components/animated/pressable.cljs @@ -84,19 +84,17 @@ :animation animation})) [type]) handle-press (fn [] (when on-press (on-press))) - handle-press-start (fn [] (when on-press-start (on-press-start))) - long-gesture-handler (fn [^js evt] - (when (and on-long-press - (= (-> evt .-nativeEvent .-state) - (:active gesture-handler/states))) - (on-long-press) - (animated/set-value state (:undetermined gesture-handler/states))))] - (animated/code! - (fn [] - (when on-press-start - (animated/cond* (animated/eq state (:began gesture-handler/states)) - (animated/call* [] handle-press-start)))) - [on-press-start]) + long-gesture-handler (react/callback + (fn [^js evt] + (let [state (-> evt .-nativeEvent .-state)] + (when (and on-press-start + (= state (:began gesture-handler/states))) + (on-press-start)) + (when (and on-long-press + (= state (:active gesture-handler/states))) + (on-long-press) + (animated/set-value state (:undetermined gesture-handler/states))))) + [on-long-press on-press-start])] (animated/code! (fn [] (when on-press @@ -109,6 +107,7 @@ {:enabled (boolean (and on-long-press (not disabled))) :on-handler-state-change long-gesture-handler :min-duration-ms long-press-duration + :max-dist 22 :ref long-press-ref} [animated/view {:accessible true :accessibility-label accessibility-label} diff --git a/src/quo/components/bottom_sheet/view.cljs b/src/quo/components/bottom_sheet/view.cljs index 961aadbef6..10c46d7211 100644 --- a/src/quo/components/bottom_sheet/view.cljs +++ b/src/quo/components/bottom_sheet/view.cljs @@ -56,6 +56,7 @@ manual-open (animated/use-value 0) manual-close (animated/use-value 0) offset (animated/use-value 0) + drag-over (animated/use-value 1) clock (animated/use-clock) body-ref (react/create-ref) master-ref (react/create-ref) @@ -85,15 +86,15 @@ translate-y (react/use-memo (fn [] (animated/with-easing - {:value (animated/cond* (animated/less-or-eq master-translation-y 0) - (animated/divide master-translation-y 2) - master-translation-y) - :velocity master-velocity-y - :offset offset - :state master-state - :on-snap on-snap - :snap-points [open-snap-point close-snap-point]})) - [on-close]) + {:value (animated/cond* (animated/less-or-eq master-translation-y 0) + (animated/divide master-translation-y 2) + master-translation-y) + :velocity master-velocity-y + :offset offset + :state master-state + :animation-over drag-over + :snap-points [open-snap-point close-snap-point]})) + []) opacity (react/use-memo (fn [] (animated/cond* @@ -104,6 +105,12 @@ :outputRange [1 0] :extrapolate (:clamp animated/extrapolate)}))) [])] + (animated/code! + (fn [] + (animated/cond* (animated/and* (animated/eq master-state (:end gesture-handler/states)) + (animated/not* drag-over)) + (animated/call* [translate-y] on-snap))) + [on-snap]) (animated/code! (fn [] (animated/block diff --git a/src/quo/components/list/item.cljs b/src/quo/components/list/item.cljs index 5703e8aa1c..ac4ff3422e 100644 --- a/src/quo/components/list/item.cljs +++ b/src/quo/components/list/item.cljs @@ -59,7 +59,6 @@ {:min-height (size->container-size size) :padding-vertical 8 :flex-direction :row - :flex 1 :align-items :center :justify-content :space-between})}] children)) diff --git a/src/quo/components/text_input.cljs b/src/quo/components/text_input.cljs index 3d6d53c2dd..a4dee7beab 100644 --- a/src/quo/components/text_input.cljs +++ b/src/quo/components/text_input.cljs @@ -152,8 +152,8 @@ cancel-label on-focus on-blur show-cancel accessibility-label bottom-value secure-text-entry container-style get-ref on-cancel monospace] - :or {cancel-label "Cancel"} - :as props}] + :or {cancel-label "Cancel"} + :as props}] {:pre [(check-spec ::text-input props)]} (let [show-cancel (if (nil? show-cancel) ;; Enabled by default on iOs and disabled on Android @@ -169,15 +169,17 @@ :on-press #(reset! visible true)} :else after) - secure (and secure-text-entry (not @visible)) - on-cancel (fn [] - (when on-cancel - (on-cancel)) - (blur)) + secure (and secure-text-entry + (or platform/android? (not @visible))) + on-cancel (fn [] + (when on-cancel + (on-cancel)) + (blur)) keyboard-type (cond (and platform/ios? (= keyboard-type "visible-password")) "default" + ;; NOTE: Now switching dynamically brakes android input (and platform/android? secure-text-entry @visible) "visible-password"