class TopicNewScreen extends Component {
static navigatorStyle = {
drawUnderNavBar:
false,
tabBarHidden:
true
};
constructor(props) {
super(props);
let ds =
new ListView.DataSource
({ rowHasChanged: (r1, r2) => r1 !== r2 });
this.state = {
topics: [],
page_topics: [],
fromRabbit: this.props.Rabbit,
isRefreshing: true,
dataSource: ds.cloneWithRows(this.props.topics)
};
this.page = 1;
}
componentDidMount() {
this.getTopicList(this.page);
}
componentWillReceiveProps(nextProps) {
let ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
this.setState({
dataSource: ds.cloneWithRows(nextProps.topics)
});
}
//获取话题列表
async getTopicList(page) {
try {
let c = API.encrypt([page]);
let json = await API.callAPI('/api/v1/quan/subject1001.do', { c: c });
if (json.code === '0' && json.obj) {
let page_topics = json.obj;
this.setState({
isRefreshing: false,
page_topics: page_topics,
topics: this.state.topics.concat(page_topics)
});
this.props.dispatch(fetchTopicsAction(this.state.topics));
}
} catch (e) {
}
}
onPressTopic(topic) {
if (this.props.Rabbit === true) {//点击小猫过来，将进入发话题界面
let screenData = {
title: '发布话题',
screen: 'hwy.CircleSendDynamicView',
passProps: {
fromRabbit: true,
type: 'topic',
topic: topic,
gambitId: topic.id,
circleid: 'topic' + topic.id//用于在redux里面的分类（代表是哪一个话题下的动态）
}
};
this.props.navigator.showModal(screenData);
} else if (this.props.Rabbit === false) {//发话题页面点击选择话题跳转过来
if (Platform.OS === 'ios') {
this.props.navigator.pop();
} else if (Platform.OS === 'android') {
Navigation.dismissModal();
}
} else {//正常进入话题详情页面
this.props.navigator.push({
screen: 'hwy.TopicDetatilScreen',
passProps: {
topic: topic
}
});
}
}
//下拉刷新
async _onRefresh() {
try {
let c = API.encrypt([1]);
let json = await API.callAPI('/api/v1/quan/subject1001.do', { c: c });
if (json.code === '0' && json.obj) {
let page_topics = json.obj;
let ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
this.setState({
isRefreshing: false,
page_topics: page_topics,
topics: page_topics,
dataSource: ds.cloneWithRows(page_topics)
});
//刷新之后，将页数置为1
this.page = 1;
}
} catch (e) {
}
}
//上拉加载
async _onEndMore() {
if (this.state.page_topics.length > 0) {
this.page = this.page + 1;
await this.getTopicList(this.page);
}
}
_renderRow(rowData) {
return (
<Touchable onPress={() => this.onPressTopic(rowData)}
style={{ marginTop: 2, borderRadius: 5 }}>
<View style={{
width: (widths - 22) / 2,
height: (widths - 22) / 2 + 30,
borderRadius: 5,
overflow: 'hidden',
backgroundColor: 'white'
}}>
<PlaceholderImage
style={{ width: (widths - 22) / 2, height: (widths - 22) / 2, backgroundColor: '#e0e0e0' }}
source={{ uri: helper.getCDNUrl('topic', rowData.smallPic, (widths - 22) / 2, 'S').url }}
defaultSource={require('../../../img/image_holder@3x.png')}
defaultStyle={{ height: 80, width: 80, backgroundColor: '#e0e0e0' }} />
<View style={{
height: 30,
width: (widths - 22) / 2,
alignItems: 'center',
justifyContent: 'center',
backgroundColor: 'white'
}}>
<Text style={{ fontSize: 12, color: colors.primaryText, alignItems: 'center', justifyContent: 'center' }}
numberOfLines={1}>{rowData.title}</Text>
</View>
</View>
</Touchable>
);
}
render() {
return (
<ListView
enableEmptySections={true}
contentContainerStyle={styles.list}
dataSource={this.state.dataSource}
showsHorizontalScrollIndicator={false}
showsVerticalScrollIndicator={false}
renderRow={this._renderRow.bind(this)}
onEndReachedThreshold={10}
onEndReached={this._onEndMore.bind(this)}
refreshControl={
<RefreshControl
refreshing={this.state.isRefreshing}
onRefresh={this._onRefresh.bind(this)}
tintColor="gray"
colors={['#ff0000', '#00ff00', '#0000ff']}
progressBackgroundColor="gray" />
} />
);
}
}
const styles = StyleSheet.create({
list: {
marginTop: 5,
flexDirection: 'row',
flexWrap: 'wrap',
alignItems: 'center',
justifyContent: 'space-between',
paddingHorizontal: 10,
paddingBottom: 10
},
});
转载请注明原文地址: https://ju.6miu.com/read-21323.html
