123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191 |
- /**
- * Created by zack on 2018/4/19.
- */
- import {
- View,
- Text,
- Image,
- StyleSheet,
- TouchableHighlight,
- ImageBackground,
- } from 'react-native'
- import React, { Component } from 'react'
- import ScreenDimensions from '../../../utils/ScreenDimensions'
- import ScreenDimensionsClientHeight from '../../../utils/ScreenDimensions'
- import NavigationBarHeight from '../../../utils/NavigationBarHeight'
- import TabBarHeight from '../../../utils/TabBarHeight'
- import RefreshInfiniteListView from '../../../utils/RefreshInfiniteListView'
- import VideoDetailsCellViewContorller from "./VideoDetailsCellViewContorller"
-
-
- //ScreenDimensions.clientHeight
- export default class VideoDetailsViewContorller extends Component {
- constructor(props) {
- super(props)
- this.state = {
- rate: 1,
- showMp: true,
- selectedPages: 0
-
- }
- }
- componentWillMount(){
- // StatusBar.setHidden(true);
- }
- componentWillUnmount(){
- // StatusBar.setHidden(false);
- this.showTabBar();
- this.props.navigator.setStyle({
- statusBarHidden: false,
- })
- }
- hideTabBar() {
- this.props.navigator.toggleTabs({
- to:'hidden',
- animated: true
- })
- }
-
- showTabBar() {
- this.props.navigator.toggleTabs({
- to:'shown',
- animated: true
- })
- }
-
-
-
- componentDidMount() {
- this.props.navigator.setStyle({
- statusBarHidden: true,
- })
- this.hideTabBar();
- let data = []
- for (var i = 1; i < 5; i++) {
- data.push({ key: i - 1, index: i - 1 });
- }
- this.list.setData(data)
- }
-
- render() {
- return (
- <View
- style={styles.View}>
- <RefreshInfiniteListView
- style={styles.View}
- numColumns={1}
- pagingEnabled={true}
- horizontal={true}
- showsHorizontalScrollIndicator={true}
- ref={this.listRef.bind(this)}
- onScroll={this._onScroll.bind(this)}
- renderItem={this.renderRow.bind(this)}
- onRefresh={this.onRefresh.bind(this)}
- onEndReached={this.onInfinite.bind(this)}>
- </RefreshInfiniteListView>
-
- <View style={styles.topStyle}>
- <TouchableHighlight
- underlayColor={"rgba(255,255,255,0)"}
- onPress={() => {
- this.props.navigator.pop({
- animated: true,
- animationType: 'slide-horizontal',
- });
- }}>
- <View style={styles.cellLeftStyle}>
- <Image source={require('../../../resources/images/TabBar/Community/SmallVideo/VideoDetails/left.png')} style={styles.btn_backStyle} />
- </View>
- </TouchableHighlight>
- <TouchableHighlight
- underlayColor={"rgba(255,255,255,0)"}
- onPress={this.onPressMore.bind(this)}>
- <View style={styles.cellRightStyle}>
- <Image source={require('../../../resources/images/TabBar/Community/SmallVideo/VideoDetails/more.png')} style={styles.cellRightStyle} />
- </View>
- </TouchableHighlight>
- </View>
-
-
- </View>
- );
- }
- onPress() {
- //返回
- console.log("返回")
- this.props.navigator.pop({
- animated: true,
- animationType: 'slide-horizontal',
- });
-
- }
- listRef(node) {
- this.list = node;
- }
- onRefresh() {
- //下拉刷新
- this.list.setRefreshing(true);
- this.requestData(false)
- }
- onInfinite() {
- //上拉加载
- this.requestData(true)
- }
- requestData(isLoadMore) {
- this.list.setRefreshing(false);
- if (isLoadMore) {
- console.log("上啦中=======")
- } else {
- console.log("下啦中=======")
- }
-
-
- }
- renderRow({ item, index }) {
- return (
- <VideoDetailsCellViewContorller selectedPages={index === this.state.selectedPages} style={styles.View} />
- )
- }
- _onScroll(e) {
- if (e % ScreenDimensions.width === 0) {
- this.setState({
- selectedPages: e / ScreenDimensions.width
- })
- }
- }
- onPressMore(){
-
- }
-
- }
- const styles = StyleSheet.create({
- View: {
- width: ScreenDimensions.width,
- height: ScreenDimensions.height,
- },
- btn_backStyle: {
- width: 25 / 2,
- height: 49 / 2,
- marginLeft: 21,
- marginTop: 22
- },
- topStyle: {
- position: 'absolute',
- top: 0,
- left: 0,
- right: 0,
- height: 88,
- backgroundColor: 'rgba(255,255,255,.1)',
- justifyContent: "space-between",
- flexDirection: "row",
- },
- cellLeftStyle: {
-
- },
- cellRightStyle: {
- width:47/2,
- height:4,
- marginRight:21,
- marginTop:15,
- }
- })
|