Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix Home-stack overlaps bottom tabs in Xiaomi devices on first run #15821

Merged
merged 1 commit into from
May 9, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 26 additions & 1 deletion src/status_im2/contexts/onboarding/common/background/view.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,10 @@
[react-native.blur :as blur]
[utils.i18n :as i18n]
[utils.re-frame :as rf]
[oops.core :refer [oget]]
[status-im2.common.resources :as resources]
[status-im.async-storage.core :as async-storage]
[status-im2.contexts.shell.animation :as shell.animation]
[status-im2.contexts.onboarding.common.carousel.view :as carousel]
[status-im2.contexts.onboarding.common.background.style :as style]
[react-native.reanimated :as reanimated]
Expand All @@ -29,6 +32,27 @@
(defonce progress (atom nil))
(defonce paused (atom nil))

(defn store-screen-height
[evt]
(let [window-height (rf/sub [:dimensions/window-height])
height (or (oget evt "nativeEvent" "layout" "height") 0)
width (or (oget evt "nativeEvent" "layout" "width") 0)]
;; Layout height calculation
;; 1. Make sure height is more than width, and on-layout is not fired while the
;; screen is horizontal
;; 2. Initialize values with 0 in case of nil
;; 3. In the case of notch devices, the dimensions height will be smaller than
;; on-layout,
;; (without status bar height included)
;; https://github.com/status-im/status-mobile/issues/14633
;; 4. In the case of devices without a notch, both heights should be the same,
;; but actual values differ in some pixels, so arbitrary 5 pixels is allowed
(when (and (> height width)
(>= (+ height 5) (or window-height 0))
(not= height @shell.animation/screen-height))
(reset! shell.animation/screen-height height)
(async-storage/set-item! :screen-height height))))

(defn f-view
[dark-overlay?]
(let [view-id (rf/sub [:view-id])
Expand All @@ -46,7 +70,8 @@
[view-id])

[rn/view
{:style style/background-container}
{:style style/background-container
:on-layout store-screen-height}
[carousel/view
{:animate? animate?
:progress progress
Expand Down
25 changes: 1 addition & 24 deletions src/status_im2/contexts/shell/view.cljs
Original file line number Diff line number Diff line change
@@ -1,14 +1,12 @@
(ns status-im2.contexts.shell.view
(:require [utils.i18n :as i18n]
[quo2.core :as quo]
[oops.core :refer [oget]]
[quo2.foundations.colors :as colors]
[react-native.core :as rn]
[react-native.blur :as blur]
[react-native.linear-gradient :as linear-gradient]
[react-native.safe-area :as safe-area]
[status-im2.common.home.view :as common.home]
[status-im.async-storage.core :as async-storage]
[status-im2.contexts.shell.animation :as animation]
[status-im2.contexts.shell.bottom-tabs :as bottom-tabs]
[status-im2.contexts.shell.cards.view :as switcher-cards]
Expand Down Expand Up @@ -112,32 +110,11 @@
:style {:margin-top top
:z-index 2}}]]))

(defn on-layout
[evt]
(let [dimensions (rf/sub [:dimensions/window])
height (or (oget evt "nativeEvent" "layout" "height") 0)
width (or (oget evt "nativeEvent" "layout" "width") 0)]
;; Layout height calculation
;; 1. Make sure height is more than width, and on-layout is not fired while the
;; screen is horizontal
;; 2. Initialize values with 0 in case of nil
;; 3. In the case of notch devices, the dimensions height will be smaller than
;; on-layout,
;; (without status bar height included)
;; https://github.com/status-im/status-mobile/issues/14633
;; 4. In the case of devices without a notch, both heights should be the same,
;; but actual values differ in some pixels, so arbitrary 5 pixels is allowed
(when (and (> height width)
(>= (+ height 5) (or (:height dimensions) 0)))
(reset! animation/screen-height height)
(async-storage/set-item! :screen-height height))))

(defn f-shell-stack
[]
(let [shared-values (animation/calculate-shared-values)]
[rn/view
{:style {:flex 1}
:on-layout on-layout}
{:style {:flex 1}}
[shell]
[bottom-tabs/bottom-tabs]
[:f> home-stack/f-home-stack]
Expand Down