[14849] Only allow dragging inside bottom sheet when no handle is shown (#14850)

This commit is contained in:
Ibrahem Khalil 2023-01-24 20:27:57 +02:00 committed by GitHub
parent 080b13c304
commit 7f2623a23e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 37 additions and 26 deletions

View File

@ -83,6 +83,16 @@
(and @expanded? (< end-pan-y collapse-threshold)) (and @expanded? (< end-pan-y collapse-threshold))
(reset! expanded? false)))))))) (reset! expanded? false))))))))
(defn handle-comp
[window-width]
[rn/view
{:style {:width window-width
:position :absolute
:background-color :transparent
:top 0
:height 20}}
[rn/view {:style (styles/handle)}]])
(defn bottom-sheet (defn bottom-sheet
[props children] [props children]
(let [{on-cancel :on-cancel (let [{on-cancel :on-cancel
@ -140,7 +150,9 @@
expandable? expandable?
show-bottom-sheet? show-bottom-sheet?
expanded? expanded?
close-bottom-sheet)] close-bottom-sheet)
handle-comp [gesture/gesture-detector {:gesture bottom-sheet-gesture}
[handle-comp window-width]]]
(react/effect! #(do (react/effect! #(do
(cond (cond
@ -200,28 +212,27 @@
{:style (reanimated/apply-animations-to-style {:style (reanimated/apply-animations-to-style
{:opacity bg-opacity} {:opacity bg-opacity}
styles/backdrop)}]] styles/backdrop)}]]
(cond->> [reanimated/view
[gesture/gesture-detector {:gesture bottom-sheet-gesture} {:style (reanimated/apply-animations-to-style
[reanimated/view {:transform [{:translateY translate-y}]}
{:style (reanimated/apply-animations-to-style {:width window-width
{:transform [{:translateY translate-y}]} :height window-height})}
{:width window-width [rn/view {:style styles/container}
:height window-height})} (when selected-item
[rn/view {:style styles/container} [rn/view {:style (styles/selected-background)}
(when selected-item [selected-item]])
[rn/view {:style (styles/selected-background)} [rn/view {:style (styles/background)}
[selected-item]]) [rn/keyboard-avoiding-view
[rn/view {:style (styles/background)} {:behaviour (if platform/ios? :padding :height)
[rn/keyboard-avoiding-view :style {:flex 1}}
{:behaviour (if platform/ios? :padding :height) [rn/view
:style {:flex 1}} {:style (styles/content-style insets)
[rn/view :on-layout (when-not (and
{:style (styles/content-style insets) (some? @content-height)
:on-layout (when-not (and (> @content-height 0))
(some? @content-height) on-content-layout)}
(> @content-height 0)) children]]
on-content-layout)} (when show-handle?
children]] handle-comp)]]]
(not show-handle?)
(when show-handle? (conj [gesture/gesture-detector {:gesture bottom-sheet-gesture}]))]))])]))
[rn/view {:style (styles/handle)}])]]]]]))])]))