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

add positional argument for hiding tabs to swipable-tabs component 

- makes it possible to hide the tabs in a view under certain conditions (e.g
when the keyboard is displayed)
- hide tabs in main screens when the keyboard is displayed
This commit is contained in:
Eric Dvorsak 2017-10-18 03:16:37 +02:00 committed by Roman Volosovskyi
parent f22cf27a66
commit dea6bdb2ca
3 changed files with 10 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/status_im/components/tabs/views.cljs
View File

@ -18,7 +18,7 @@
(for [[index {:keys [content view-id]}] indexed-tabs] (for [[index {:keys [content view-id]}] indexed-tabs]
^{:key index} [tab index content tab-style on-press (is-current-tab? view-id)])]) ^{:key index} [tab index content tab-style on-press (is-current-tab? view-id)])])
(defn swipable-tabs [tabs-list current-tab (defn swipable-tabs [tabs-list current-tab show-tabs?
{:keys [bottom-tabs? navigation-event main-container-style tabs-container-style tab-style] {:keys [bottom-tabs? navigation-event main-container-style tabs-container-style tab-style]
:or {bottom-tabs false :or {bottom-tabs false
navigation-event :navigate-to navigation-event :navigate-to
@ -32,14 +32,15 @@
indexed-tabs) indexed-tabs)
index->tab (clojure.set/map-invert tab->index) index->tab (clojure.set/map-invert tab->index)
get-tab-index #(get tab->index % 0)] get-tab-index #(get tab->index % 0)]
(fn [tabs-list current-tab] (fn [tabs-list current-tab show-tabs?]
(let [current-tab-index (get-tab-index current-tab) (let [current-tab-index (get-tab-index current-tab)
on-press (fn [index] on-press (fn [index]
(.scrollBy @swiper (- index current-tab-index))) (.scrollBy @swiper (- index current-tab-index)))
is-current-tab? (fn [view-id] is-current-tab? (fn [view-id]
(= (get-tab-index view-id) current-tab-index))] (= (get-tab-index view-id) current-tab-index))]
[react/view styles/main-container [react/view styles/main-container
(when-not bottom-tabs? (when (and (not bottom-tabs?)
show-tabs?)
[tabs tabs-container-style indexed-tabs tab-style on-press is-current-tab?]) [tabs tabs-container-style indexed-tabs tab-style on-press is-current-tab?])
[react/swiper {:loop false [react/swiper {:loop false
:shows-pagination false :shows-pagination false
@ -48,5 +49,6 @@
:on-index-changed #(re-frame/dispatch [navigation-event (index->tab %)])} :on-index-changed #(re-frame/dispatch [navigation-event (index->tab %)])}
(for [[index {:keys [screen view-id]}] indexed-tabs] (for [[index {:keys [screen view-id]}] indexed-tabs]
^{:key index} [screen (is-current-tab? view-id)])] ^{:key index} [screen (is-current-tab? view-id)])]
(when bottom-tabs? (when (and bottom-tabs?
show-tabs?)
[tabs tabs-container-style indexed-tabs tab-style on-press is-current-tab?])])))) [tabs tabs-container-style indexed-tabs tab-style on-press is-current-tab?])]))))

5
src/status_im/ui/screens/main_tabs/views.cljs
View File

@ -48,10 +48,11 @@
(def tabs-list (map #(update % :content tab-content) tabs-list*)) (def tabs-list (map #(update % :content tab-content) tabs-list*))
(views/defview main-tabs [] (views/defview main-tabs []
(views/letsubs [current-tab [:get :view-id]] (views/letsubs [keyboard-height [:get :keyboard-height]
current-tab [:get :view-id]]
[react/view styles/flex [react/view styles/flex
[status-bar {:type (if (= current-tab :wallet) :wallet :main)}] [status-bar {:type (if (= current-tab :wallet) :wallet :main)}]
[drawer-view [drawer-view
[tabs/swipable-tabs tabs-list current-tab [tabs/swipable-tabs tabs-list current-tab (zero? keyboard-height)
{:bottom-tabs? true {:bottom-tabs? true
:navigation-event :navigate-to-tab}]]])) :navigation-event :navigate-to-tab}]]]))

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

@ -180,7 +180,7 @@
[react/view {:style styles/flex} [react/view {:style styles/flex}
[status-bar/status-bar] [status-bar/status-bar]
[toolbar-view current-tab unsigned-transactions-count] [toolbar-view current-tab unsigned-transactions-count]
[tabs/swipable-tabs tabs-list current-tab [tabs/swipable-tabs tabs-list current-tab true
{:navigation-event :navigation-replace {:navigation-event :navigation-replace
:tab-style transactions.styles/tab :tab-style transactions.styles/tab
:tabs-container-style transactions.styles/tabs-container}]])) :tabs-container-style transactions.styles/tabs-container}]]))