123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177 |
- /**
- * Created by zack on 2018/4/29.
- */
- import {
- View,
- Text,
- StyleSheet,
- FlatList,
- TouchableOpacity,
- Image,
- ScrollView
- } from 'react-native'
- import React, {Component} from 'react'
- import {NavigationBarHeight, TabBarHeight, ScreenDimensions} from '../../../utils/DimensionsTools'
- import FindSearchResultItem from './View/FindSearchResultItem'
- import BaseNavigationBarStyle from '../../base/BaseNavigationBarStyle'
- import MyAnswerListPageView from './View/MyAnswerListPageView'
-
- export default class MyAnswerViewController extends Component {
- constructor(props) {
- super(props)
- this.state = {
- currentPage: 0,
- }
- }
-
- // 监听滚动
- onAnimationEnd(e){
- // 求出水平方向上的偏移量
- const offSetX = e.nativeEvent.contentOffset.x
- // 计算当前页码
- const currentPage = offSetX / (ScreenDimensions.width)
- // 重新绘制UI
- this.setState({currentPage: currentPage})
- }
-
- clickTagButtonActon(index) {
- let x = index * ScreenDimensions.width
- this.setState({currentPage: index})
- this._scrollView.scrollTo({x: x, y: 0, animated: true})
- }
-
- render() {
- return(
- <View style={styles.View}>
- <TouchableOpacity style={[styles.TopButtonBgView, {marginTop: NavigationBarHeight.height}]}>
- <View style={styles.TopButtonReadBgView}>
- <Image source={require("../../../resources/images/TabBar/Community/Answer/eye-normal.png")} style={styles.TopButtonImageView} />
- <Text style={styles.TopButtonTitle}>{'回答获得2人阅读'}</Text>
- </View>
- <Text style={styles.TopButtonSubTitle}>{'本月共2人浏览'}</Text>
- </TouchableOpacity>
-
- <View style={styles.TopButtonCenterLineView}/>
-
- <TouchableOpacity style={styles.TopButtonBgView}>
- <View style={styles.TopButtonReadBgView}>
- <Image source={require("../../../resources/images/TabBar/Community/Answer/like-normal.png")} style={styles.TopButtonImageView} />
- <Text style={styles.TopButtonTitle}>{'回答获得2人点赞'}</Text>
- </View>
- <Text style={styles.TopButtonSubTitle}>{'本月共5人点赞'}</Text>
- </TouchableOpacity>
-
- <View style={styles.TagButtonBgView}>
- <TouchableOpacity onPress={() => {
- this.clickTagButtonActon(0)
- }} style={styles.TagButtonView}>
- <Text style={[styles.TagButtonText, {marginLeft: 23, color: this.state.currentPage === 0 ? '#ef1313' : '#000000'}]}>{'收藏'}</Text>
- </TouchableOpacity>
-
- <TouchableOpacity onPress={() => {
- this.clickTagButtonActon(1)
- }} style={styles.TagButtonView}>
- <Text style={[styles.TagButtonText, {color: this.state.currentPage === 1 ? '#ef1313' : '#000000'}]}>{'提问'}</Text>
- </TouchableOpacity>
-
- <TouchableOpacity onPress={() => {
- this.clickTagButtonActon(2)
- }} style={styles.TagButtonView}>
- <Text style={[styles.TagButtonText, {color: this.state.currentPage === 2 ? '#ef1313' : '#000000'}]}>{'回答'}</Text>
- </TouchableOpacity>
-
- <TouchableOpacity onPress={() => {
- this.clickTagButtonActon(3)
- }} style={styles.TagButtonView}>
- <Text style={[styles.TagButtonText, {color: this.state.currentPage === 3 ? '#ef1313' : '#000000'}]}>{'草稿'}</Text>
- </TouchableOpacity>
- </View>
-
- <ScrollView ref = {(o) => {
- this._scrollView = o
- }} onMomentumScrollEnd={(e) => {
- this.onAnimationEnd(e)
- }} horizontal={true} pagingEnabled={true} style={styles.ScrollView}>
- <MyAnswerListPageView
- selectedTagIndex = {0}
- dataSources = {[{index: 0}, {index: 1}, {index: 2}, {index: 3}, {index: 4}, {index: 5}, {index: 6}, {index: 1}, {index: 2}]}
- />
- <MyAnswerListPageView
- selectedTagIndex = {1}
- dataSources = {[{index: 0}, {index: 1}, {index: 2}, {index: 3}, {index: 4}, {index: 5}, {index: 6}, {index: 1}, {index: 2}]}
- />
- <MyAnswerListPageView
- selectedTagIndex = {2}
- dataSources = {[{index: 0}, {index: 1}, {index: 2}, {index: 3}, {index: 4}, {index: 5}, {index: 6}, {index: 1}, {index: 2}]}
- />
-
- <MyAnswerListPageView
- selectedTagIndex = {3}
- dataSources = {[]}//{[{index: 0}, {index: 1}, {index: 2}, {index: 3}, {index: 4}, {index: 5}, {index: 6}, {index: 1}, {index: 2}]}
- />
- </ScrollView>
-
- </View>
- )
- }
- }
-
- const styles = StyleSheet.create({
- View: {
- width: ScreenDimensions.width,
- height: ScreenDimensions.height,
- backgroundColor: '#efeff4',
- },
- TopButtonBgView: {
- width: ScreenDimensions.width,
- height: 78,
- justifyContent: 'center',
- backgroundColor: 'white'
- },
- TopButtonReadBgView: {
- marginLeft: 23,
- flexDirection: 'row',
- alignItems: 'center',
- },
- TopButtonImageView: {
- marginRight: 12,
- },
- TopButtonTitle: {
- fontSize: 17,
- color: '#505050'
- },
- TopButtonSubTitle: {
- fontSize: 15,
- color: '#9c9c9c',
- marginTop: 13,
- marginLeft: 53,
- },
- TopButtonCenterLineView: {
- width: ScreenDimensions.width,
- height: 0.5,
- backgroundColor: '#efeff4'
- },
- TagButtonBgView: {
- width: ScreenDimensions.width,
- height: 45,
- marginTop: 8,
- borderBottomColor: '#efeff4',
- borderBottomWidth: 0.5,
- backgroundColor: 'white',
- flexDirection: 'row',
- alignItems: 'center',
- },
- TagButtonView: {
- height: 45,
- justifyContent: 'center',
- alignItems: 'center'
- },
- TagButtonText: {
- fontSize: 16,
- marginRight: 36
- },
- ScrollView: {
- width: ScreenDimensions.width,
- height: ScreenDimensions.height - NavigationBarHeight.height - 78 - 78 - 45 - 10,
- }
- })
|