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 scan qr window 

Signed-off-by: andrey <motor4ik@gmail.com>
This commit is contained in:
andrey 2020-07-27 14:32:08 +02:00
parent 10a814764d
commit a968149ecc
No known key found for this signature in database
GPG Key ID: 89B67245FD2F0272
5 changed files with 69 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/status_im/ui/components/colors.cljs
View File

@ -40,7 +40,7 @@
;; BLACK ;; BLACK
(def black (:black light)) ;; Used as the default text color (def black (:black light)) ;; Used as the default text color
(def black-persist (:black light)) ;; this doesn't with theme (def black-persist (:white dark)) ;; this doesn't with theme
(def black-transparent (alpha black 0.1)) ;; Used as background color for rounded button on dark background and as background color for containers like "Backup recovery phrase" (def black-transparent (alpha black 0.1)) ;; Used as background color for rounded button on dark background and as background color for containers like "Backup recovery phrase"
(def black-transparent-20 (alpha black 0.2)) ; accounts divider (def black-transparent-20 (alpha black 0.2)) ; accounts divider
(def black-transparent-40 (alpha black 0.4)) (def black-transparent-40 (alpha black 0.4))

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

@ -8,7 +8,7 @@
["react-native" :as react-native :refer (Keyboard)] ["react-native" :as react-native :refer (Keyboard)]
["react-native-image-crop-picker" :default image-picker] ["react-native-image-crop-picker" :default image-picker]
["react-native-safe-area-context" :as safe-area-context ["react-native-safe-area-context" :as safe-area-context
:refer (SafeAreaView SafeAreaProvider SafeAreaInsetsContext)] :refer (SafeAreaProvider SafeAreaInsetsContext)]
["@react-native-community/clipboard" :default Clipboard]) ["@react-native-community/clipboard" :default Clipboard])
(:require-macros [status-im.utils.views :as views])) (:require-macros [status-im.utils.views :as views]))
@ -244,5 +244,3 @@
(def safe-area-provider (reagent/adapt-react-class SafeAreaProvider)) (def safe-area-provider (reagent/adapt-react-class SafeAreaProvider))
(def safe-area-consumer (reagent/adapt-react-class (.-Consumer ^js SafeAreaInsetsContext))) (def safe-area-consumer (reagent/adapt-react-class (.-Consumer ^js SafeAreaInsetsContext)))
(def safe-area-view (reagent/adapt-react-class SafeAreaView))

50
src/status_im/ui/screens/chat/image/preview/views.cljs
View File

@ -6,30 +6,34 @@
[quo.core :as quo] [quo.core :as quo]
[status-im.i18n :as i18n] [status-im.i18n :as i18n]
[status-im.ui.components.icons.vector-icons :as icons] [status-im.ui.components.icons.vector-icons :as icons]
[status-im.ui.screens.chat.sheets :as sheets])) [status-im.ui.screens.chat.sheets :as sheets]
[quo.components.safe-area :as safe-area]))
(defview preview-image [] (defview preview-image []
(letsubs [{:keys [content] :as message} [:get-screen-params] (letsubs [{:keys [content] :as message} [:get-screen-params]
{:keys [width height]} [:dimensions/window]] {:keys [width height]} [:dimensions/window]]
[react/view {:flex 1 :background-color colors/black-persist} [safe-area/consumer
[react/safe-area-view {:style {:flex 1 :justify-content :flex-end}} (fn [insets]
[react/view {:flex 1 :align-items :center :justify-content :center} [react/view {:style {:flex 1 :justify-content :flex-end
[react/image {:style (merge {:width width :padding-top (:top insets) :padding-bottom (:bottom insets)
:height (- height 200) :background-color colors/black-persist}}
:background-color :black}) [react/view {:flex 1 :align-items :center :justify-content :center}
:resize-mode :contain [react/image {:style (merge {:width width
:source {:uri (:image content)}}]] :height (- height 200)
[react/view {:flex-direction :row :padding-horizontal 8 :background-color :black})
:justify-content :space-between :align-items :center} :resize-mode :contain
[react/view {:width 64}] :source {:uri (:image content)}}]]
[quo/button {:on-press #(re-frame/dispatch [:navigate-back]) [react/view {:flex-direction :row :padding-horizontal 8
:type :secondary :justify-content :space-between :align-items :center}
:text-style {:color colors/white-persist}} [react/view {:width 64}]
(i18n/label :t/close)] [quo/button {:on-press #(re-frame/dispatch [:navigate-back])
[react/touchable-highlight :type :secondary
{:on-press #(re-frame/dispatch [:bottom-sheet/show-sheet :text-style {:color colors/white-persist}}
{:content (sheets/image-long-press message true) (i18n/label :t/close)]
:height 64}])} [react/touchable-highlight
[icons/icon :main-icons/more {:container-style {:width 24 :height 24 {:on-press #(re-frame/dispatch [:bottom-sheet/show-sheet
:margin 20} {:content (sheets/image-long-press message true)
:color colors/white-persist}]]]]])) :height 64}])}
[icons/icon :main-icons/more {:container-style {:width 24 :height 24
:margin 20}
:color colors/white-persist}]]]])]))

71
src/status_im/ui/screens/qr_scanner/views.cljs
View File

@ -10,7 +10,8 @@
[status-im.ui.components.colors :as colors] [status-im.ui.components.colors :as colors]
[status-im.utils.config :as config] [status-im.utils.config :as config]
[quo.core :as quo] [quo.core :as quo]
[reagent.core :as reagent])) [reagent.core :as reagent]
[quo.components.safe-area :as safe-area]))
(defn- topbar [_ {:keys [title] :as opts}] (defn- topbar [_ {:keys [title] :as opts}]
[topbar/toolbar [topbar/toolbar
@ -29,22 +30,24 @@
(defn qr-test-view [opts] (defn qr-test-view [opts]
(let [text-value (atom "")] (let [text-value (atom "")]
[react/safe-area-view {:style {:flex 1 [safe-area/consumer
:background-color colors/black-persist}} (fn [insets]
[topbar nil opts] [react/view {:flex 1 :background-color colors/black-persist
[react/view {:flex 1 :padding-top (:top insets) :padding-bottom (:bottom insets)}
:align-items :center [topbar nil opts]
:justify-content :center} [react/view {:flex 1
[react/text-input {:multiline true :align-items :center
:style {:color colors/white-persist} :justify-content :center}
:on-change-text #(reset! text-value %)}] [react/text-input {:multiline true
[react/view {:flex-direction :row} :style {:color colors/white-persist}
[quo/button :on-change-text #(reset! text-value %)}]
{:on-press #(re-frame/dispatch [:qr-scanner.callback/scan-qr-code-cancel opts])} [react/view {:flex-direction :row}
"Cancel"] [quo/button
[quo/button {:on-press #(re-frame/dispatch [:qr-scanner.callback/scan-qr-code-cancel opts])}
{:on-press #(re-frame/dispatch [:qr-scanner.callback/scan-qr-code-success opts (when-let [text @text-value] (string/trim text))])} "Cancel"]
"Ok"]]]])) [quo/button
{:on-press #(re-frame/dispatch [:qr-scanner.callback/scan-qr-code-success opts (when-let [text @text-value] (string/trim text))])}
"Ok"]]]])]))
(defn corner [border1 border2 corner] (defn corner [border1 border2 corner]
[react/view (assoc {:border-color colors/white-persist :width 60 :height 60} border1 5 border2 5 corner 32)]) [react/view (assoc {:border-color colors/white-persist :width 60 :height 60} border1 5 border2 5 corner 32)])
@ -72,19 +75,21 @@
layout (atom nil)] layout (atom nil)]
(if config/qr-test-menu-enabled? (if config/qr-test-menu-enabled?
[qr-test-view opts] [qr-test-view opts]
[react/safe-area-view {:style {:flex 1 [safe-area/consumer
:background-color colors/black-persist}} (fn [insets]
[topbar camera-flashlight opts] [react/view {:flex 1 :background-color colors/black-persist
[react/with-activity-indicator :padding-top (:top insets) :padding-bottom (:bottom insets)}
{} [topbar camera-flashlight opts]
[camera/camera [react/with-activity-indicator
{:ref #(reset! camera-ref %) {}
:style {:flex 1} [camera/camera
:capture-audio false {:ref #(reset! camera-ref %)
:on-layout (camera/on-layout layout) :style {:flex 1}
:auto-focus-point-of-interest @focus-object :capture-audio false
:on-tap (camera/on-tap camera-ref layout focus-object) :on-layout (camera/on-layout layout)
:on-bar-code-read #(when-not @read-once? :auto-focus-point-of-interest @focus-object
(reset! read-once? true) :on-tap (camera/on-tap camera-ref layout focus-object)
(on-barcode-read opts %))}]] :on-bar-code-read #(when-not @read-once?
[viewfinder (int (* 2 (/ (min height width) 3)))]]))) (reset! read-once? true)
(on-barcode-read opts %))}]]
[viewfinder (int (* 2 (/ (min height width) 3)))]])])))

4
src/status_im/ui/screens/routing/main.cljs
View File

@ -93,10 +93,10 @@
{:name :contact-code {:name :contact-code
:component wallet.components/contact-code} :component wallet.components/contact-code}
{:name :qr-scanner {:name :qr-scanner
:insets {:top false} :insets {:top false :bottom false}
:component qr-scanner/qr-scanner} :component qr-scanner/qr-scanner}
{:name :image-preview {:name :image-preview
:insets {:top false} :insets {:top false :bottom false}
:component image-preview/preview-image} :component image-preview/preview-image}
{:name :notifications-settings {:name :notifications-settings
:back-handler :noop :back-handler :noop