diff --git a/ios/StatusIm/Images.xcassets/LaunchImage.launchimage/Contents.json b/ios/StatusIm/Images.xcassets/LaunchImage.launchimage/Contents.json index f4f35aa35b..b7da69f118 100755 --- a/ios/StatusIm/Images.xcassets/LaunchImage.launchimage/Contents.json +++ b/ios/StatusIm/Images.xcassets/LaunchImage.launchimage/Contents.json @@ -57,6 +57,15 @@ "extent" : "full-screen", "subtype" : "retina4", "scale" : "2x" + }, + { + "orientation" : "portrait", + "idiom" : "iphone", + "filename" : "LaunchScreen1125x2436.png", + "extent" : "full-screen", + "minimum-system-version" : "11.0", + "subtype" : "2436h", + "scale" : "3x" } ], "info" : { diff --git a/ios/StatusIm/Images.xcassets/LaunchImage.launchimage/LaunchScreen1125x2436.png b/ios/StatusIm/Images.xcassets/LaunchImage.launchimage/LaunchScreen1125x2436.png new file mode 100644 index 0000000000..2293aa1d79 Binary files /dev/null and b/ios/StatusIm/Images.xcassets/LaunchImage.launchimage/LaunchScreen1125x2436.png differ diff --git a/src/status_im/chat/subs.cljs b/src/status_im/chat/subs.cljs index 450c9d44d2..5ad243b0ff 100644 --- a/src/status_im/chat/subs.cljs +++ b/src/status_im/chat/subs.cljs @@ -2,7 +2,7 @@ (:require [re-frame.core :refer [reg-sub subscribe]] [status-im.constants :as constants] [status-im.chat.models.input :as input-model] - [status-im.chat.models.commands :as commands-model] + [status-im.chat.models.commands :as commands-model] [status-im.chat.views.input.utils :as input-utils] [status-im.commands.utils :as commands-utils] [status-im.utils.datetime :as time] @@ -45,7 +45,10 @@ :chat-input-margin :<- [:get :keyboard-height] (fn [kb-height] - (if platform/ios? kb-height 0))) + (cond + (and platform/iphone-x? (> kb-height 0)) (- kb-height 34) + platform/ios? kb-height + :default 0))) (reg-sub :get-active-chats diff --git a/src/status_im/ios/platform.cljs b/src/status_im/ios/platform.cljs index 440b07d62b..d04bfc4047 100644 --- a/src/status_im/ios/platform.cljs +++ b/src/status_im/ios/platform.cljs @@ -1,4 +1,5 @@ -(ns status-im.ios.platform) +(ns status-im.ios.platform + (:require [status-im.react-native.js-dependencies :as rn-dependencies])) (def fonts {:light {:font-family "SFUIText-Light"} @@ -9,7 +10,15 @@ :toolbar-title {:font-family "SFUIText-Semibold"} :roboto-mono {:font-family "RobotoMono-Medium"}}) -;; Structure to be exported +;; iPhone X dimensions +(def x-width 375) +(def x-height 812) + +(defn iphone-x-dimensions? [] + (let [{:keys [width height]} (-> (.-Dimensions rn-dependencies/react-native) + (.get "window") + (js->clj :keywordize-keys true))] + (and (= width x-width) (= height x-height)))) (def platform-specific {:fonts fonts @@ -22,4 +31,4 @@ :new-contact-in-toolbar? true} :group-block-shadows? false :discover {:uppercase-subtitles? true} - :status-bar-default-height 20}) + :status-bar-default-height (if (iphone-x-dimensions?) 0 20)}) diff --git a/src/status_im/ui/components/react.cljs b/src/status_im/ui/components/react.cljs index 9bcb226701..581fc2b325 100644 --- a/src/status_im/ui/components/react.cljs +++ b/src/status_im/ui/components/react.cljs @@ -35,6 +35,7 @@ (def app-state (get-react-property "AppState")) (def net-info (get-react-property "NetInfo")) (def view (get-class "View")) +(def safe-area-view (get-class "SafeAreaView")) (def status-bar (get-class "StatusBar")) @@ -230,3 +231,64 @@ [with-activity-indicator {:preview [view {}]} comp]) + +;; Platform-specific View + +(def platform-specific-view + (if platform/iphone-x? safe-area-view view)) + +(defmulti create-main-screen-view #(cond + platform/iphone-x? :iphone-x + platform/ios? :ios + platform/android? :android)) + +(defmethod create-main-screen-view :iphone-x [current-view] + (fn [props & children] + (let [props (merge props + {:background-color + (case current-view + (:wallet + :wallet-send-transaction + :wallet-transaction-sent + :wallet-request-transaction + :wallet-send-assets + :wallet-request-assets + :choose-recipient + :recent-recipients + :wallet-send-transaction-modal + :wallet-transaction-sent-modal + :wallet-send-transaction-request + :wallet-transaction-fee + :contact-code) styles/color-blue4 + (:accounts + :login) styles/color-blue2 + (:qr-viewer + :recipient-qr-code) "#2f3031" + (:wallet-transactions-filter + :contact-list-modal) styles/color-white + :transparent)}) + children (cond-> children + (#{:wallet + :recent-recipients + :wallet-send-assets + :wallet-request-assets} current-view) + (conj [view {:background-color styles/color-white + :position :absolute + :bottom 0 + :right 0 + :left 0 + :height 100 + :z-index -1000}]))] + (apply vector safe-area-view props children)))) + +(defmethod create-main-screen-view :default [_] + view) + +(views/defview main-screen-modal-view [current-view & components] + (views/letsubs [signing? [:get-in [:wallet :send-transaction :signing?]]] + (let [main-screen-view (create-main-screen-view current-view)] + [main-screen-view styles/flex + [keyboard-avoiding-view {:flex 1 :flex-direction :column} + (apply vector view styles/flex components) + (when (and platform/iphone-x? (not signing?)) + [view {:flex 0 :height 34}])]]))) diff --git a/src/status_im/ui/screens/contacts/contact_list_modal/views.cljs b/src/status_im/ui/screens/contacts/contact_list_modal/views.cljs index dd8da6a1b7..de84f617b3 100644 --- a/src/status_im/ui/screens/contacts/contact_list_modal/views.cljs +++ b/src/status_im/ui/screens/contacts/contact_list_modal/views.cljs @@ -46,7 +46,7 @@ click-handler [:get :contacts/click-handler] action [:get :contacts/click-action] params [:get :contacts/click-params]] - [react/view {:flex 1} + [react/view {:flex 1 :background-color :white} [status-bar {:type :modal-white}] [toolbar/simple-toolbar (i18n/label :t/contacts)] [list/flat-list {:style st/contacts-list-modal diff --git a/src/status_im/ui/screens/views.cljs b/src/status_im/ui/screens/views.cljs index af4ff62047..e59e2d49d6 100644 --- a/src/status_im/ui/screens/views.cljs +++ b/src/status_im/ui/screens/views.cljs @@ -2,7 +2,7 @@ (:require-macros [status-im.utils.views :refer [defview letsubs] :as views]) (:require [re-frame.core :refer [dispatch]] [status-im.utils.platform :refer [android?]] - [status-im.ui.components.react :refer [view modal] :as react] + [status-im.ui.components.react :refer [view modal create-main-screen-view] :as react] [status-im.ui.components.styles :as common-styles] [status-im.ui.screens.main-tabs.views :refer [main-tabs]] @@ -176,8 +176,9 @@ :recipient-qr-code recipient-qr-code :contact-code contact-code :profile-qr-viewer profile/qr-viewer - (throw (str "Unknown view: " current-view)))] - [view common-styles/flex + (throw (str "Unknown view: " current-view))) + main-screen-view (create-main-screen-view current-view)] + [main-screen-view common-styles/flex (if (and android? signed-up? (#{:home :wallet :my-profile :chat :wallet-send-transaction @@ -202,4 +203,5 @@ :wallet-transaction-sent-modal transaction-sent-modal :wallet-transaction-fee wallet.send/transaction-fee (throw (str "Unknown modal view: " modal-view)))] - [component])]])]))))) + [react/main-screen-modal-view modal-view + [component]])]])]))))) diff --git a/src/status_im/ui/screens/wallet/choose_recipient/views.cljs b/src/status_im/ui/screens/wallet/choose_recipient/views.cljs index 5f22aeca4b..556832d2e0 100644 --- a/src/status_im/ui/screens/wallet/choose_recipient/views.cljs +++ b/src/status_im/ui/screens/wallet/choose_recipient/views.cljs @@ -24,19 +24,21 @@ :handler #(re-frame/dispatch [:wallet/toggle-flashlight])}]]]) (defn- viewfinder [{:keys [height width]} size] - [react/view {:style styles/viewfinder-port} - [react/view {:style (styles/viewfinder-translucent height width size :top)}] - [react/view {:style (styles/viewfinder-translucent height width size :right)}] - [react/view {:style (styles/viewfinder-translucent height width size :bottom)}] - [react/view {:style (styles/viewfinder-translucent height width size :left)}] - [react/image {:source {:uri :corner_left_top} - :style (styles/corner-left-top height width size)}] - [react/image {:source {:uri :corner_right_top} - :style (styles/corner-right-top height width size)}] - [react/image {:source {:uri :corner_left_bottom} - :style (styles/corner-left-bottom height width size)}] - [react/image {:source {:uri :corner_right_bottom} - :style (styles/corner-right-bottom height width size)}]]) + (let [height (cond-> height + platform/iphone-x? (- 78))] + [react/view {:style styles/viewfinder-port} + [react/view {:style (styles/viewfinder-translucent height width size :top)}] + [react/view {:style (styles/viewfinder-translucent height width size :right)}] + [react/view {:style (styles/viewfinder-translucent height width size :bottom)}] + [react/view {:style (styles/viewfinder-translucent height width size :left)}] + [react/image {:source {:uri :corner_left_top} + :style (styles/corner-left-top height width size)}] + [react/image {:source {:uri :corner_right_top} + :style (styles/corner-right-top height width size)}] + [react/image {:source {:uri :corner_left_bottom} + :style (styles/corner-left-bottom height width size)}] + [react/image {:source {:uri :corner_right_bottom} + :style (styles/corner-right-bottom height width size)}]])) (defn- size [{:keys [height width]}] (int (* 2 (/ (min height width) 3)))) diff --git a/src/status_im/ui/screens/wallet/send/events.cljs b/src/status_im/ui/screens/wallet/send/events.cljs index c04b9377e1..90073db878 100644 --- a/src/status_im/ui/screens/wallet/send/events.cljs +++ b/src/status_im/ui/screens/wallet/send/events.cljs @@ -185,8 +185,8 @@ (update-in [:wallet :transactions-unsigned] dissoc id) (update-in [:wallet :send-transaction] merge clear-send-properties))} (if modal? - {:dispatch-n [[:navigate-back] - [:navigate-to-modal :wallet-transaction-sent-modal]]} + {:dispatch [:navigate-back] + :dispatch-later [{:ms 400 :dispatch [:navigate-to-modal :wallet-transaction-sent-modal]}]} {:dispatch [:navigate-to :wallet-transaction-sent]})))))) (defn on-transactions-modal-completed [raw-results] diff --git a/src/status_im/ui/screens/wallet/send/views.cljs b/src/status_im/ui/screens/wallet/send/views.cljs index d63c11603f..dd317ecb16 100644 --- a/src/status_im/ui/screens/wallet/send/views.cljs +++ b/src/status_im/ui/screens/wallet/send/views.cljs @@ -163,7 +163,7 @@ (defn- send-transaction-panel [{:keys [modal? transaction scroll advanced? symbol]}] (let [{:keys [amount amount-error signing? to to-name sufficient-funds? in-progress? from-chat?]} transaction] - [wallet.components/simple-screen {:avoid-keyboard? true + [wallet.components/simple-screen {:avoid-keyboard? (not modal?) :status-bar-type (if modal? :modal-wallet :wallet)} [toolbar from-chat? (if modal? act/close-white act/back-white) (i18n/label :t/send-transaction)] diff --git a/src/status_im/ui/screens/wallet/settings/views.cljs b/src/status_im/ui/screens/wallet/settings/views.cljs index f42498d59d..789134e7cd 100644 --- a/src/status_im/ui/screens/wallet/settings/views.cljs +++ b/src/status_im/ui/screens/wallet/settings/views.cljs @@ -6,6 +6,7 @@ [status-im.ui.components.react :as react] [status-im.ui.components.styles :as components.styles] [status-im.ui.components.toolbar.view :as toolbar] + [status-im.ui.components.status-bar.view :as status-bar] [status-im.ui.screens.wallet.styles :as wallet.styles] [status-im.utils.ethereum.core :as ethereum] [status-im.utils.ethereum.tokens :as tokens])) @@ -24,6 +25,7 @@ (letsubs [network [:network] visible-tokens [:wallet.settings/visible-tokens]] [react/view (merge components.styles/flex {:background-color :white}) + [status-bar/status-bar {:type :modal-wallet}] [toolbar/toolbar #_{} {:style wallet.styles/toolbar} [toolbar/nav-text {:style {:color :white}} (i18n/label :t/done)] diff --git a/src/status_im/ui/screens/wallet/transactions/views.cljs b/src/status_im/ui/screens/wallet/transactions/views.cljs index 5a348de6d2..95f78c96ac 100644 --- a/src/status_im/ui/screens/wallet/transactions/views.cljs +++ b/src/status_im/ui/screens/wallet/transactions/views.cljs @@ -9,6 +9,7 @@ [status-im.ui.components.styles :as components.styles] [status-im.ui.components.toolbar.actions :as actions] [status-im.ui.components.toolbar.view :as toolbar] + [status-im.ui.components.status-bar.view :as status-bar] [status-im.ui.screens.wallet.transactions.styles :as styles] [status-im.utils.money :as money])) @@ -140,6 +141,7 @@ (defview filter-history [] (letsubs [filter-data [:wallet.transactions/filters]] [react/view styles/filter-container + [status-bar/status-bar {:type :modal-white}] [toolbar/toolbar {} [toolbar/nav-clear-text (i18n/label :t/done)] [toolbar/content-title (i18n/label :t/transactions-filter-title)] diff --git a/src/status_im/utils/platform.cljs b/src/status_im/utils/platform.cljs index d0c3adff13..6dece9b624 100644 --- a/src/status_im/utils/platform.cljs +++ b/src/status_im/utils/platform.cljs @@ -9,6 +9,7 @@ (def android? (= platform "android")) (def ios? (= platform "ios")) +(def iphone-x? (and ios? (ios/iphone-x-dimensions?))) (def platform-specific (cond