Skip to content

Commit 179b6e6

Browse files
breitningbreitning
committed
update content add page.
1 parent d7135b2 commit 179b6e6

File tree

20 files changed

+665
-230
lines changed

20 files changed

+665
-230
lines changed

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
"react": "^15.3.1",
4040
"react-addons-pure-render-mixin": "^15.2.0",
4141
"react-native": "^0.32.0",
42+
"react-native-action-button": "^2.0.3",
4243
"react-native-animatable": "^0.6.1",
4344
"react-native-code-push": "^1.13.5-beta",
4445
"react-native-html-converter": "^1.0.4",

‎source/action/config.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@ export const removeConfig = createAction(types.REMOVE_CONFIG, async({key})=>{
2222
}
2323
});
2424

25-
export const getConfig = createAction(types.GET_CONFIG, async({key})=> {
25+
export const getConfig = createAction(types.GET_CONFIG, async(key)=> {
2626
return await storageService.getItem(key);
27-
}, ({key, resolved, rejected})=>{
27+
}, (key, resolved, rejected)=>{
2828
return {
2929
key,
3030
resolved,

‎source/component/button/home.js

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
import React, { Component } from 'react';
2+
import {
3+
View,
4+
Image,
5+
StyleSheet,
6+
} from 'react-native';
7+
import TimerMixin from 'react-timer-mixin';
8+
import ActionButton from 'react-native-action-button';
9+
import Icon from 'react-native-vector-icons/Ionicons';
10+
import { StyleConfig } from '../../style';
11+
12+
const buttons = [{
13+
title:'闪存',
14+
icon: 'md-color-palette',
15+
action:'toBlinkAdd',
16+
color: StyleConfig.color_success
17+
},{
18+
title:'博问',
19+
icon: 'md-help',
20+
action:'toQuestionAdd',
21+
color: StyleConfig.color_warning
22+
}];
23+
24+
class HomeButton extends Component {
25+
26+
constructor(props) {
27+
super(props);
28+
this.state = {
29+
activeButton: null
30+
};
31+
}
32+
33+
componentWillUnmount() {
34+
TimerMixin.clearTimeout(this.timer);
35+
}
36+
37+
onButtonPress(item){
38+
let { router } = this.props;
39+
this.timer = TimerMixin.setTimeout(() => {
40+
router && router[item.action] && router[item.action](item);
41+
}, 500);
42+
}
43+
44+
renderButtonItem(item, index){
45+
return (
46+
<ActionButton.Item
47+
size = { 50 }
48+
key = { index }
49+
title={ item.title }
50+
titleBgColor = { '#666' }
51+
onPress={() => this.onButtonPress(item) }
52+
buttonColor = { item.color }
53+
style = { styles.button_item }
54+
titleColor = { StyleConfig.color_white }>
55+
<Icon name={ item.icon } style={ styles.button_icon } />
56+
</ActionButton.Item>
57+
)
58+
}
59+
60+
render() {
61+
return (
62+
<ActionButton
63+
offsetY = { 10 }
64+
offsetX = { 15 }
65+
icon = { <Icon name="md-create" style={ styles.button_icon } /> }
66+
outRangeScale = { 0.9 }
67+
buttonColor = { 'rgba(199, 85, 74, 0.9)' }>
68+
{
69+
buttons && buttons.map((button, index)=>{
70+
return this.renderButtonItem(button, index)
71+
})
72+
}
73+
</ActionButton>
74+
)
75+
}
76+
}
77+
78+
const styles = StyleSheet.create({
79+
button_item:{
80+
elevation: 0
81+
},
82+
button_icon: {
83+
fontSize: 20,
84+
height: 22,
85+
color: '#fff',
86+
},
87+
});
88+
89+
export default HomeButton;
90+
91+

‎source/component/drawerPanel.js

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -72,11 +72,11 @@ class DrawerPanel extends Component {
7272
</Text>
7373
<TouchableOpacity
7474
activeOpacity={ 0.2 }
75-
onPress={ ()=> onPress() }>
75+
onPress={ ()=> this.props.router.toUser() }>
7676
<Icon
7777
name={ "ios-log-in-outline" }
78-
size= { 22 }
79-
color={ "#fff" } />
78+
size= { StyleConfig.icon_size }
79+
color={ StyleConfig.color_white } />
8080
</TouchableOpacity>
8181
</View>
8282
</View>
@@ -99,7 +99,7 @@ class DrawerPanel extends Component {
9999
<TouchableHighlight
100100
underlayColor ={ StyleConfig.touchable_press_color }
101101
key={ index }
102-
style={[ CommonStyles.p_a_3, styles.item_active ]}
102+
style={[ CommonStyles.p_a_3 ]}
103103
onPress={ ()=> onDrawerHide(item) }>
104104
<View style={ [ CommonStyles.flexRow, CommonStyles.flexItemsMiddle, CommonStyles.flexItemsBetween ] }>
105105
<View style={ [CommonStyles.flexRow, CommonStyles.flexItemsMiddle] }>
@@ -132,9 +132,10 @@ class DrawerPanel extends Component {
132132
<View style={ [ CommonStyles.flexRow, CommonStyles.flexItemsMiddle, CommonStyles.flexItemsBetween ] }>
133133
<View style={ [CommonStyles.flexRow, CommonStyles.flexItemsMiddle] }>
134134
<View style={ [ CommonStyles.flexRow, CommonStyles.flexItemsCenter, CommonStyles.m_r_3, styles.list_icon] }>
135-
<Icon name={ item.icon } size={ StyleConfig.icon_size } style={[ CommonStyles.text_dark ]}/>
135+
<Icon name={ item.icon }
136+
size={ StyleConfig.icon_size }
137+
style={[ CommonStyles.text_dark ]}/>
136138
</View>
137-
138139
<Text style={ [ CommonStyles.font_sm, CommonStyles.text_dark ] }>
139140
{ item.text }
140141
</Text>
@@ -149,7 +150,6 @@ class DrawerPanel extends Component {
149150
if (item.flag === this.state.flag) {
150151
return this.renderActiveItem(item, index);
151152
}
152-
153153
return this.renderNormalItem(item, index);
154154
}
155155

@@ -166,10 +166,10 @@ class DrawerPanel extends Component {
166166
)
167167
}
168168
}
169-
169+
170170
render() {
171171
return (
172-
<View style={ CommonStyles.container }>
172+
<View style={ [CommonStyles.container, styles.container] }>
173173
{ this.renderHeader() }
174174
{ this.renderContent() }
175175
</View>
@@ -178,6 +178,9 @@ class DrawerPanel extends Component {
178178
}
179179

180180
const styles = StyleSheet.create({
181+
container:{
182+
height: StyleConfig.screen_height,
183+
},
181184
header_container: {
182185
height: StyleConfig.header_height
183186
},

‎source/component/floatButton.js

Lines changed: 0 additions & 36 deletions
This file was deleted.

‎source/component/header/user.js

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
import React, { Component } from 'react';
2+
import {
3+
View,
4+
Image,
5+
Text,
6+
ScrollView,
7+
StyleSheet,
8+
TouchableOpacity
9+
} from 'react-native';
10+
11+
import _ from 'lodash';
12+
import * as Animatable from 'react-native-animatable';
13+
import PureRenderMixin from 'react-addons-pure-render-mixin';
14+
import ParallaxScrollView from 'react-native-parallax-scroll-view';
15+
import { getImageSource } from '../../common';
16+
import Navbar from '../navbar';
17+
import { CommonStyles, ComponentStyles, StyleConfig } from '../../style';
18+
19+
class UserRender extends Component {
20+
21+
constructor(props) {
22+
super(props);
23+
this.state = {
24+
cover: null
25+
};
26+
this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
27+
}
28+
29+
componentDidMount(){
30+
let cover = getImageSource();
31+
this.setState({
32+
cover: cover
33+
});
34+
}
35+
36+
componentWillUnmount(){
37+
this.setState({
38+
cover: null
39+
});
40+
}
41+
42+
renderParallaxScrollComponent(){
43+
return (
44+
<ScrollView
45+
showsVerticalScrollIndicator = {false}
46+
showsHorizontalScrollIndicator = {false}>
47+
</ScrollView>
48+
)
49+
}
50+
51+
renderParallaxBackground(postInfo){
52+
return (
53+
<View key="parallax-background">
54+
<Animatable.Image
55+
resizeMode="cover"
56+
style={ [ComponentStyles.header_img ] }
57+
source={ {uri: this.state.cover } }
58+
ref={(view)=>{this.parallaxBackground = view}} >
59+
</Animatable.Image>
60+
<View style={ [ ComponentStyles.header_backdrop ] }/>
61+
</View>
62+
)
63+
}
64+
65+
renderParallaxForeground(postInfo){
66+
return (
67+
<Animatable.View
68+
key="parallax-foreground"
69+
style = { [ CommonStyles.flexColumn, CommonStyles.flexItemsCenter, CommonStyles.p_a_3, styles.foreground ] }
70+
ref={(view)=>{ this.parallaxForeground = view}}>
71+
72+
<View style={ [ ComponentStyles.pos_absolute, CommonStyles.flexRow, CommonStyles.flexItemsMiddle, CommonStyles.flexItemsBetween, CommonStyles.p_a_3, styles.header_meta ] }>
73+
<View style={ [ CommonStyles.flexRow, CommonStyles.flexItemsMiddle ] }>
74+
<Image style={ [ ComponentStyles.avatar_mini, CommonStyles.m_r_2 ] }
75+
source={{ uri: 'http://123.56.135.166/cnblog/public/img/common/author.jpg' }}/>
76+
<Text style={ [ CommonStyles.text_white, CommonStyles.font_sm ] }>
77+
愤怒的晃晃
78+
</Text>
79+
</View>
80+
</View>
81+
</Animatable.View>
82+
)
83+
}
84+
85+
renderParallaxStickyHeader(postInfo){
86+
return (
87+
<Navbar
88+
backgroundImage = { {uri: this.state.cover} }
89+
leftIconName = { 'http://123.56.135.166/cnblog/public/img/common/author.jpg' }
90+
title={ '愤怒的晃晃' }/>
91+
);
92+
}
93+
94+
render() {
95+
96+
return (
97+
<ParallaxScrollView
98+
headerBackgroundColor="#111"
99+
ref={(view)=>{this.parallaxView = view}}
100+
stickyHeaderHeight={ StyleConfig.navbar_height }
101+
parallaxHeaderHeight={ StyleConfig.header_height }
102+
renderScrollComponent={()=> this.renderParallaxScrollComponent()}
103+
renderBackground={() => this.renderParallaxBackground()}
104+
renderForeground={() => this.renderParallaxForeground()}
105+
renderStickyHeader={() => this.renderParallaxStickyHeader()}>
106+
107+
{ this.props.children }
108+
109+
</ParallaxScrollView>
110+
);
111+
}
112+
}
113+
114+
const styles = StyleSheet.create({
115+
foreground:{
116+
height: StyleConfig.header_height,
117+
paddingTop: StyleConfig.space_4
118+
},
119+
header_meta:{
120+
bottom:0,
121+
width: StyleConfig.screen_width
122+
}
123+
});
124+
125+
export default UserRender;

‎source/component/menuButton.js

Lines changed: 0 additions & 45 deletions
This file was deleted.

0 commit comments

Comments
 (0)