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

attempt to fix scroll in account's list 

Former-commit-id: d16ded0a90
This commit is contained in:
Roman Volosovskyi 2016-07-22 17:37:20 +03:00
parent 0bfcab1b70
commit beb7002bea
3 changed files with 73 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/status_im/accounts/screen.cljs
View File

@ -2,6 +2,7 @@
(:require-macros [status-im.utils.views :refer [defview]])
(:require [re-frame.core :refer [subscribe dispatch dispatch-sync]]
[status-im.components.react :refer [view
scroll-view
text
list-view
list-item
@ -55,26 +56,24 @@
:start [0, 0]
:end [0.5, 1]
:locations [0, 0.8, 1]
:style st/gradient-background}]
:style st/gradient-background}
[toolbar {:background-color :transparent
:nav-action {:image {:source (if show-back? {:uri :icon_back_white} nil)
:style icon-back}
:handler (if show-back? #(dispatch [:navigate-back]) nil)}
:custom-content toolbar-title
:action {:image {:style icon-search}
:handler #()}}]
[view st/accounts-container
[view st/account-list-view-container
[list-view {:dataSource (lw/to-datasource accounts)
:enableEmptySections true
:renderRow render-row
;:renderSeparator render-separator
:style st/account-list}]]]
[view st/add-account-button-container
[touchable-highlight {:on-press create-account}
[view st/add-account-button
[image {:source {:uri :icon_add}
:style st/icon-plus}]
[text {:style st/add-account-text} (label :t/add-account)]]]]]))
;(re-frame.core/dispatch [:set :view-id :users])
:handler #()}
:style st/toolbar}]
[list-view {:dataSource (lw/to-datasource accounts)
:enableEmptySections true
:renderRow render-row
:style st/account-list
:contentContainerStyle (st/account-list-content (count accounts))}]
[view st/add-account-button-container
[touchable-highlight {:on-press create-account
:accessibility-label :create-account}
[view st/add-account-button
[image {:source {:uri :icon_add}
:style st/icon-plus}]
[text {:style st/add-account-text} (label :t/add-account)]]]]]]))

107
src/status_im/accounts/styles.cljs
View File

@ -4,7 +4,8 @@
text1-color
color-white
toolbar-background2
online-color]]))
online-color]]
[status-im.components.react :as r]))
(def screen-container
@ -12,59 +13,49 @@
:color :white})
(def gradient-background
{:position :absolute
:top 0
:right 0
:bottom 0
:left 0})
{:position :absolute
:top 0
:bottom 0
:left 0
:right 0
:padding-bottom 84})
(def account-list-container1
{:position :absolute
:top 56
:right 0
:bottom 0
:left 0
:justifyContent :center})
(def accounts-container
{:flex 1
:flex-direction :column
:justifyContent :center
:padding-bottom 56})
(def account-list-view-container
{:flexDirection :column
:justifyContent :center})
(defn account-list-content [cnt]
(merge {:justifyContent :center}
;; todo this will not work with landscape and looks bad
(when (< (* 69 (+ 2 cnt)) (:height (r/get-dimensions "window")))
{:flex 1})))
(def account-list
{})
{:margin-top 56
:height 100})
(def row-separator
{:borderBottomWidth 1
:borderBottomColor "#bababa"})
(def account-container
{:flex 1
:flexDirection :row
:height 69
{:flex 1
:flexDirection :row
:height 69
:backgroundColor "rgba(255, 255, 255, 0.1)"
:alignItems :center
:justifyContent :center})
:alignItems :center
:justifyContent :center})
(def photo-container
{:flex 0.2
:flexDirection :column
{:flex 0.2
:flexDirection :column
:alignItems :center
:justifyContent :center})
(def account-photo-container
{:flex 1
{:flex 1
:backgroundColor "rgba(255, 255, 255, 0.2)"
:borderRadius 50
:width 36
:height 36
:alignItems :center
:justifyContent :center})
:borderRadius 50
:width 36
:height 36
:alignItems :center
:justifyContent :center})
(def photo-image
{:borderRadius 50
@ -72,43 +63,49 @@
:height 36})
(def name-container
{:flex 1
{:flex 1
:flexDirection :column})
(def name-text
{:color color-white
{:color color-white
:fontSize 16})
(def address-text
{:color color-white
{:color color-white
:fontSize 12})
(def online-container
{:flex 0.2
:flexDirection :column
{:flex 0.2
:flexDirection :column
:alignItems :center
:justifyContent :center})
(def add-account-button-container
{:position :absolute
:bottom 16
:height 50
:left 100
:right 100
:justifyContent :center
:alignItems :center})
{:position :absolute
:bottom 16
:height 50
:left 100
:right 100
:justifyContent :center
:alignItems :center})
(def add-account-button
{:flexDirection :row})
(def icon-plus
{:flexDirection :column
:paddingTop 2
:width 20
:height 20})
:paddingTop 2
:width 20
:height 20})
(def add-account-text
{:flexDirection :column
:color :white
:fontSize 16
:marginLeft 8})
:color :white
:fontSize 16
:marginLeft 8})
(def toolbar
{:position :absolute
:top 0
:left 0
:right 0})

9
src/status_im/components/react.cljs
View File

@ -67,10 +67,11 @@
[image {:source {:uri (keyword (str "icon_" (name n)))}
:style style}]))
(def linear-gradient-class (u/require "react-native-linear-gradient"))
(defn linear-gradient [props]
(r/create-element linear-gradient-class
(clj->js (merge {:inverted true} props))))
(def linear-gradient-class
(r/adapt-react-class (u/require "react-native-linear-gradient")))
(defn linear-gradient
[props & children]
(vec (concat [linear-gradient-class (merge {:inverted true} props)] children)))
(def platform