status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

[Fix #2719] App does not fit on iPhone X screen 

Signed-off-by: Andrey Shovkoplyas <motor4ik@gmail.com>
This commit is contained in:
Foo Pang 2017-12-30 21:45:57 +08:00 committed by Andrey Shovkoplyas
parent 65fc4ab48f
commit eba8df6703
No known key found for this signature in database
GPG Key ID: EAAB7C8622D860A4
13 changed files with 118 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
ios/StatusIm/Images.xcassets/LaunchImage.launchimage/Contents.json
View File

@ -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" : {

BIN
ios/StatusIm/Images.xcassets/LaunchImage.launchimage/LaunchScreen1125x2436.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 63 KiB

7
src/status_im/chat/subs.cljs
View File

@ -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

15
src/status_im/ios/platform.cljs
View File

@ -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)})

62
src/status_im/ui/components/react.cljs
View File

@ -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}])]])))

2
src/status_im/ui/screens/contacts/contact_list_modal/views.cljs
View File

@ -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

10
src/status_im/ui/screens/views.cljs
View File

@ -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]])]])])))))

28
src/status_im/ui/screens/wallet/choose_recipient/views.cljs
View File

@ -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))))

4
src/status_im/ui/screens/wallet/send/events.cljs
View File

@ -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]

2
src/status_im/ui/screens/wallet/send/views.cljs
View File

@ -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)]

2
src/status_im/ui/screens/wallet/settings/views.cljs
View File

@ -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)]

2
src/status_im/ui/screens/wallet/transactions/views.cljs
View File

@ -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)]

1
src/status_im/utils/platform.cljs
View File

@ -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