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 arrow alignment 

Signed-off-by: yenda <eric@status.im>
This commit is contained in:
yenda 2019-02-27 16:50:13 +01:00
parent a34ec7ffbe
commit c6721dcdfc
No known key found for this signature in database
GPG Key ID: 0095623C0069DCE6
2 changed files with 13 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/status_im/ui/screens/chat/input/send_button.cljs
View File

@ -3,16 +3,8 @@
(:require [clojure.string :as string] (:require [clojure.string :as string]
[re-frame.core :as re-frame] [re-frame.core :as re-frame]
[status-im.ui.screens.chat.styles.input.send-button :as style] [status-im.ui.screens.chat.styles.input.send-button :as style]
[status-im.ui.components.animation :as animation]
[status-im.ui.components.react :as react] [status-im.ui.components.react :as react]
[status-im.ui.components.icons.vector-icons :as vi])) [status-im.ui.components.icons.vector-icons :as vector-icons]))
(defn send-button-view-on-update [{:keys [spin-value command-completion]}]
(fn [_]
(let [to-spin-value (if (#{:complete :no-command} command-completion) 1 0)]
(animation/start
(animation/timing spin-value {:toValue to-spin-value
:duration 300})))))
(defn sendable? [input-text disconnected? login-processing?] (defn sendable? [input-text disconnected? login-processing?]
(let [trimmed (string/trim input-text)] (let [trimmed (string/trim input-text)]
@ -22,21 +14,16 @@
disconnected?)))) disconnected?))))
(defview send-button-view [] (defview send-button-view []
(letsubs [{:keys [command-completion]} [:chats/selected-chat-command] (letsubs [{:keys [command-completion]} [:chats/selected-chat-command]
{:keys [input-text seq-arg-input-text]} [:chats/current-chat] {:keys [input-text seq-arg-input-text]} [:chats/current-chat]
disconnected? [:disconnected?] disconnected? [:disconnected?]
login-processing? [:get-in [:accounts/login :processing]] login-processing? [:get-in [:accounts/login :processing]]]
spin-value (animation/create-value 1)]
{:component-did-update (send-button-view-on-update {:spin-value spin-value
:command-completion command-completion})}
(when (and (sendable? input-text disconnected? login-processing?) (when (and (sendable? input-text disconnected? login-processing?)
(or (not command-completion) (or (not command-completion)
(#{:complete :less-than-needed} command-completion))) (#{:complete :less-than-needed} command-completion)))
[react/touchable-highlight {:on-press #(re-frame/dispatch [:chat.ui/send-current-message])} [react/touchable-highlight
(let [spin (.interpolate spin-value (clj->js {:inputRange [0 1] {:on-press #(re-frame/dispatch [:chat.ui/send-current-message])}
:outputRange ["0deg" "90deg"]}))] [vector-icons/icon :main-icons/arrow-up
[react/animated-view {:container-style style/send-message-container
{:style (style/send-message-container spin) :accessibility-label :send-message-button
:accessibility-label :send-message-button} :color :white}]])))
[vi/icon :main-icons/arrow-up {:container-style style/send-message-icon
:color :white}]])])))

11
src/status_im/ui/screens/chat/styles/input/send_button.cljs
View File

@ -1,17 +1,12 @@
(ns status-im.ui.screens.chat.styles.input.send-button (ns status-im.ui.screens.chat.styles.input.send-button
(:require [status-im.ui.components.colors :as colors])) (:require [status-im.ui.components.colors :as colors]))
(defn send-message-container [rotation] (def send-message-container
{:background-color colors/blue {:background-color colors/blue
:width 30 :width 30
:height 30 :height 30
:padding 3
:border-radius 15 :border-radius 15
:margin 10 :margin 10
:padding 4
:margin-left 8 :margin-left 8
:margin-bottom 11 :margin-bottom 11})
:transform [{:rotate rotation}]})
(def send-message-icon
{:height 22
:width 22})