|
|
@@ -8,11 +8,11 @@ import React, { Component } from 'react'; |
|
|
|
Image, |
|
|
|
Dimensions, |
|
|
|
TouchableOpacity, |
|
|
|
ImageBackground, |
|
|
|
} from 'react-native'; |
|
|
|
|
|
|
|
//引用插件 |
|
|
|
import Package from './package.json' |
|
|
|
import Swiper from 'react-native-swiper'; |
|
|
|
import HttpUtils from './HttpUtils.js'; |
|
|
|
import CodePush from "react-native-code-push"; |
|
|
|
import DeviceInfo from "react-native-device-info"; |
|
|
@@ -25,11 +25,10 @@ export default class MyPage extends Component { |
|
|
|
constructor(props) { |
|
|
|
super(props); |
|
|
|
this.state = { |
|
|
|
swiperShow: false, |
|
|
|
text:'', |
|
|
|
qrcode:[], |
|
|
|
restartAllowed: true , |
|
|
|
syncMessage: "我是小更新" , |
|
|
|
syncMessage: "syncMessage" , |
|
|
|
progress: false, |
|
|
|
macAddress: "NULL" |
|
|
|
}; |
|
|
@@ -109,39 +108,8 @@ codePushStatusDidChange(syncStatus) { |
|
|
|
); |
|
|
|
} |
|
|
|
|
|
|
|
// 轮播图 |
|
|
|
renderBanner() { |
|
|
|
if (this.state.swiperShow) { |
|
|
|
console.log ('返回值' + this.state.swiperShow); |
|
|
|
return ( |
|
|
|
<Swiper |
|
|
|
style={styles.wrapper} |
|
|
|
showsButtons={false} |
|
|
|
removeClippedSubviews={false} //这个很主要啊,解决白屏问题 |
|
|
|
autoplay={true} |
|
|
|
horizontal ={true} |
|
|
|
paginationStyle={styles.paginationStyle} |
|
|
|
dotStyle={styles.dotStyle} |
|
|
|
activeDotStyle={styles.activeDotStyle} |
|
|
|
> |
|
|
|
<Image source={require('./image/page1.jpg')} resizeMode='stretch' style={styles.bannerImg}/> |
|
|
|
<Image source={require('./image/page2.jpg')} resizeMode='stretch' style={styles.bannerImg}/> |
|
|
|
<Image source={require('./image/page3.jpg')} resizeMode='stretch' style={styles.bannerImg}/> |
|
|
|
<Image source={require('./image/page4.jpg')} resizeMode='stretch' style={styles.bannerImg}/> |
|
|
|
</Swiper> |
|
|
|
); |
|
|
|
|
|
|
|
} else { |
|
|
|
return ( |
|
|
|
<View style={styles.wrapper}> |
|
|
|
<Image style={{width: 300, height: 300}} source={{uri:'data:image/jpeg;base64,'+ this.state.qrcode}}/> |
|
|
|
<Text style={{marginTop: 16}}>{this.state.text}</Text> |
|
|
|
</View> |
|
|
|
); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
get() { |
|
|
|
getBaseInfo() { |
|
|
|
HttpUtils.get('https://mall.youlane.cn/api/wxDeviceScreenAd/list?deviceId=11%3AAA%3A33%3ABB%3A44&pageNum=1&pageSize=5') |
|
|
|
.then(result => { |
|
|
|
this.setState({ |
|
|
@@ -153,13 +121,7 @@ get() { |
|
|
|
|
|
|
|
|
|
|
|
componentDidMount() { |
|
|
|
|
|
|
|
this.get() |
|
|
|
setTimeout(() => { |
|
|
|
this.setState({ |
|
|
|
swiperShow: true, |
|
|
|
}); |
|
|
|
}, 10000) |
|
|
|
this.getBaseInfo() |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
@@ -168,101 +130,94 @@ render() { |
|
|
|
|
|
|
|
if (this.state.progress) { |
|
|
|
progressView = ( |
|
|
|
<Text style={styles.messages}>{this.state.progress.receivedBytes} of {this.state.progress.totalBytes} bytes received</Text> |
|
|
|
<Text>{this.state.progress.receivedBytes} of {this.state.progress.totalBytes} bytes received</Text> |
|
|
|
); |
|
|
|
} |
|
|
|
|
|
|
|
return ( |
|
|
|
<View style={styles.container}> |
|
|
|
|
|
|
|
<Text style={styles.welcome}> |
|
|
|
当前版本是:{Package.version} |
|
|
|
</Text> |
|
|
|
|
|
|
|
<Text style={styles.messages}> |
|
|
|
Mac:{this.state.macAddress} |
|
|
|
</Text> |
|
|
|
<Text style={styles.messages}> |
|
|
|
Name:{DeviceInfo.getApplicationName()} |
|
|
|
</Text> |
|
|
|
|
|
|
|
<TouchableOpacity onPress={this.sync.bind(this)}> |
|
|
|
<Text style={styles.syncButton}>Press for background sync</Text> |
|
|
|
</TouchableOpacity> |
|
|
|
|
|
|
|
<TouchableOpacity onPress={this.syncImmediate.bind(this)}> |
|
|
|
<Text style={styles.syncButton}>Press for dialog-driven sync</Text> |
|
|
|
</TouchableOpacity> |
|
|
|
|
|
|
|
{progressView} |
|
|
|
|
|
|
|
<TouchableOpacity onPress={this.toggleAllowRestart.bind(this)}> |
|
|
|
<Text style={styles.restartToggleButton}>Restart { this.state.restartAllowed ? "allowed" : "forbidden"}</Text> |
|
|
|
</TouchableOpacity> |
|
|
|
|
|
|
|
<TouchableOpacity onPress={this.getUpdateMetadata.bind(this)}> |
|
|
|
<Text style={styles.syncButton}>Press for Update Metadata</Text> |
|
|
|
</TouchableOpacity> |
|
|
|
|
|
|
|
|
|
|
|
<Text style={styles.messages}>{this.state.syncMessage || ""}</Text> |
|
|
|
|
|
|
|
</View> |
|
|
|
<ImageBackground style={styles.container} |
|
|
|
source={require('./image/background.png')}> |
|
|
|
|
|
|
|
<View style={styles.title}> |
|
|
|
<View style={styles.titleImagePlace}> |
|
|
|
<Image source={require('./image/title.png')} resizeMode='center' style={styles.titleImage} /> |
|
|
|
</View> |
|
|
|
<Image source={require('./image/title-qrcode.png')} resizeMode='center' style={styles.titleQrcode} /> |
|
|
|
</View> |
|
|
|
<View style={styles.content}> |
|
|
|
<Image source={require('./image/item-background.png')} resizeMode='center' style={styles.titleImage} /> |
|
|
|
<Image source={require('./image/item-background.png')} resizeMode='center' style={styles.titleImage} /> |
|
|
|
<Image source={require('./image/item-background.png')} resizeMode='center' style={styles.titleImage} /> |
|
|
|
</View> |
|
|
|
<View style={styles.bottom}> |
|
|
|
<Image source={require('./image/logo.png')} resizeMode='center' style={styles.bottomLogo} /> |
|
|
|
<Image source={require('./image/test-l.png')} resizeMode='center' style={styles.bottomQrcode1} /> |
|
|
|
<Image source={require('./image/test-l.png')} resizeMode='center' style={styles.bottomQrcode2} /> |
|
|
|
<Text style={styles.bottomPlacehold}></Text> |
|
|
|
</View> |
|
|
|
</ImageBackground> |
|
|
|
); |
|
|
|
|
|
|
|
/* |
|
|
|
return ( |
|
|
|
<View style={styles.container}> |
|
|
|
{this.renderBanner()} |
|
|
|
</View> |
|
|
|
|
|
|
|
); |
|
|
|
*/ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
const styles = StyleSheet.create({ |
|
|
|
container: { |
|
|
|
width:width, |
|
|
|
height:height, |
|
|
|
flex:1 |
|
|
|
container:{ |
|
|
|
flex: 1, |
|
|
|
paddingLeft: 16, |
|
|
|
paddingRight: 16 |
|
|
|
}, |
|
|
|
title:{ |
|
|
|
flex: 6, |
|
|
|
flexDirection: 'row', |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
content:{ |
|
|
|
flex: 18, |
|
|
|
flexDirection: 'column', |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
bottom:{ |
|
|
|
flex: 2, |
|
|
|
flexDirection: 'row', |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
titleImagePlace: { |
|
|
|
flex: 2, |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
wrapper: { |
|
|
|
width:width, |
|
|
|
height:height, |
|
|
|
flex:1 |
|
|
|
titleImage: { |
|
|
|
flex: 1, |
|
|
|
alignItems:'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
bannerImg: { |
|
|
|
width:width, |
|
|
|
height:height, |
|
|
|
flex:1 |
|
|
|
titleQrcode: { |
|
|
|
flex: 1, |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
container: { |
|
|
|
flex: 1, |
|
|
|
alignItems: "center", |
|
|
|
backgroundColor: "#F5FCFF", |
|
|
|
paddingTop: 50 |
|
|
|
}, |
|
|
|
image: { |
|
|
|
margin: 30, |
|
|
|
width: Dimensions.get("window").width - 100, |
|
|
|
height: 365 * (Dimensions.get("window").width - 100) / 651, |
|
|
|
}, |
|
|
|
messages: { |
|
|
|
marginTop: 30, |
|
|
|
textAlign: "center", |
|
|
|
}, |
|
|
|
restartToggleButton: { |
|
|
|
color: "blue", |
|
|
|
fontSize: 17 |
|
|
|
}, |
|
|
|
syncButton: { |
|
|
|
color: "green", |
|
|
|
fontSize: 17 |
|
|
|
}, |
|
|
|
welcome: { |
|
|
|
fontSize: 20, |
|
|
|
textAlign: "center", |
|
|
|
margin: 20 |
|
|
|
}, |
|
|
|
bottomLogo: { |
|
|
|
flex: 2, |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
bottomQrcode1: { |
|
|
|
flex: 1, |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
bottomQrcode2: { |
|
|
|
flex: 1, |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
}, |
|
|
|
bottomPlacehold: { |
|
|
|
flex: 6, |
|
|
|
alignItems: 'center', |
|
|
|
backgroundColor:'transparent' |
|
|
|
} |
|
|
|
|
|
|
|
}); |