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

signing sheet animation with nativeDriver

This commit is contained in:
Roman Volosovskyi 2019-06-21 18:53:44 +03:00
parent 7a7bafd5ef
commit 453fe60c46
No known key found for this signature in database
GPG Key ID: 0238A4B5ECEE70DE
1 changed files with 19 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/status_im/ui/screens/signing/views.cljs
View File

@ -23,17 +23,21 @@
[bottom-anim-value alpha-value window-height]
(anim/start
(anim/parallel
[(anim/spring bottom-anim-value {:toValue window-height})
(anim/timing alpha-value {:toValue 0
:duration 500})])))
[(anim/spring bottom-anim-value {:toValue (- window-height)
:useNativeDriver true})
(anim/timing alpha-value {:toValue 0
:duration 500
:useNativeDriver true})])))
(defn show-panel-anim
[bottom-anim-value alpha-value]
(anim/start
(anim/parallel
[(anim/spring bottom-anim-value {:toValue -40})
(anim/timing alpha-value {:toValue 0.4
:duration 500})])))
[(anim/spring bottom-anim-value {:toValue 40
:useNativeDriver true})
(anim/timing alpha-value {:toValue 0.4
:duration 500
:useNativeDriver true})])))
(defn separator []
[react/view {:height 1 :background-color colors/gray-lighter}])
@ -162,7 +166,7 @@
(i18n/label :t/sign-with-password)]]])])))
(defn signing-view [tx window-height]
(let [bottom-anim-value (anim/create-value (- window-height))
(let [bottom-anim-value (anim/create-value window-height)
alpha-value (anim/create-value 0)
clear-timeout (atom nil)
current-tx (reagent/atom nil)
@ -191,8 +195,13 @@
(when @current-tx
[react/view {:position :absolute :top 0 :bottom 0 :left 0 :right 0}
[react/animated-view {:flex 1 :background-color :black :opacity alpha-value}]
[react/animated-view {:position :absolute :height window-height :left 0 :right 0
:bottom bottom-anim-value}
[react/animated-view {:style
{:position :absolute
:height window-height
:left 0
:right 0
;;:bottom bottom-anim-value
:transform [{:translateY bottom-anim-value}]}}
[react/keyboard-avoiding-view {:style {:flex 1}}
[react/view {:flex 1}]
(if (:message @current-tx)