| @@ -288,17 +288,21 @@ getContentViewItem(contentItem, annomation) { | |||||
| <Animatable.View animation={annomation} easing="ease-out" duration={1500} delay={500} useNativeDriver ={true} style={styles.contentItem}> | <Animatable.View animation={annomation} easing="ease-out" duration={1500} delay={500} useNativeDriver ={true} style={styles.contentItem}> | ||||
| <ImageBackground source={require('./image/item-background.png')} resizeMode='center' style={styles.contentItemDownLayer} > | <ImageBackground source={require('./image/item-background.png')} resizeMode='center' style={styles.contentItemDownLayer} > | ||||
| {/* 列表 */} | |||||
| <View style={styles.contentItemTop}> | <View style={styles.contentItemTop}> | ||||
| <Image source={{uri: contentItem.target.coverImg}} resizeMode='cover' style={styles.contentItemTopCoverImg} /> | <Image source={{uri: contentItem.target.coverImg}} resizeMode='cover' style={styles.contentItemTopCoverImg} /> | ||||
| <View style={styles.contentItemTopDetail}> | <View style={styles.contentItemTopDetail}> | ||||
| {/* 券的title */} | |||||
| <Text style={styles.contentItemTopDetailTitle} numberOfLines={2} ellipsizeMode="tail">{contentItem.target.title}</Text> | <Text style={styles.contentItemTopDetailTitle} numberOfLines={2} ellipsizeMode="tail">{contentItem.target.title}</Text> | ||||
| {/* <Text style={styles.contentItemTopDetailTitle} numberOfLines={2} ellipsizeMode="tail">你好世界你好你是你好宿舍熟话说术后</Text> */} | |||||
| {/* <Text style={styles.contentItemTopDetailRemark} numberOfLines={1} ellipsizeMode="tail">{contentItem.target.remark}</Text> */} | {/* <Text style={styles.contentItemTopDetailRemark} numberOfLines={1} ellipsizeMode="tail">{contentItem.target.remark}</Text> */} | ||||
| <View style={styles.contentItemTopDetailPrice}> | <View style={styles.contentItemTopDetailPrice}> | ||||
| {/* 售价 */} | |||||
| <View style={styles.contentItemTopDetailCurPrice}> | <View style={styles.contentItemTopDetailCurPrice}> | ||||
| <Text style={styles.contentItemTopDetailCurPriceStrUnit}>¥</Text> | <Text style={styles.contentItemTopDetailCurPriceStrUnit}>¥</Text> | ||||
| <Text style={styles.contentItemTopDetailCurPriceStr}>{contentItem.target.salePriceStr}</Text> | <Text style={styles.contentItemTopDetailCurPriceStr}>{contentItem.target.salePriceStr}</Text> | ||||
| </View> | </View> | ||||
| {/* 面额 */} | |||||
| <View style={styles.contentItemTopDetailSalePrice}> | <View style={styles.contentItemTopDetailSalePrice}> | ||||
| <Text style={styles.contentItemTopDetailSalePriceStr} >¥{contentItem.target.priceStr}</Text> | <Text style={styles.contentItemTopDetailSalePriceStr} >¥{contentItem.target.priceStr}</Text> | ||||
| </View> | </View> | ||||
| @@ -306,17 +310,14 @@ getContentViewItem(contentItem, annomation) { | |||||
| </View> | </View> | ||||
| <Image source={{uri:'data:image/png;base64,'+contentItem.qrcode}} resizeMode='contain' style={styles.contentItemTopQrcode} /> | <Image source={{uri:'data:image/png;base64,'+contentItem.qrcode}} resizeMode='contain' style={styles.contentItemTopQrcode} /> | ||||
| </View> | </View> | ||||
| {/* 优惠券底部商户名称 */} | |||||
| <View style={styles.contentItemBottom}> | <View style={styles.contentItemBottom}> | ||||
| <Text style={styles.contentItemBottomMerchantName}>{merchantName}</Text> | <Text style={styles.contentItemBottomMerchantName}>{merchantName}</Text> | ||||
| <View style={styles.contentItemBottomPlacehold}></View> | <View style={styles.contentItemBottomPlacehold}></View> | ||||
| <Text style={styles.contentItemBottomAction}>{actionText}</Text> | <Text style={styles.contentItemBottomAction}>{actionText}</Text> | ||||
| </View> | </View> | ||||
| </ImageBackground> | </ImageBackground> | ||||
| {this.getContentViewItemUplayer(contentItem)} | {this.getContentViewItemUplayer(contentItem)} | ||||
| </Animatable.View> | </Animatable.View> | ||||
| ) | ) | ||||
| } | } | ||||
| @@ -354,21 +355,20 @@ render() { | |||||
| return ( | return ( | ||||
| <ImageBackground style={styles.background} resizeMode='center' source={require('./image/background.png')}> | <ImageBackground style={styles.background} resizeMode='center' source={require('./image/background.png')}> | ||||
| {/* 头部title二维码开始 */} | |||||
| <View style={styles.title}> | <View style={styles.title}> | ||||
| <View style={styles.titleImagePlace}> | <View style={styles.titleImagePlace}> | ||||
| <Image source={require('./image/title.png')} resizeMode='center' style={styles.titleImage} /> | <Image source={require('./image/title.png')} resizeMode='center' style={styles.titleImage} /> | ||||
| </View> | </View> | ||||
| <ImageBackground source={require('./image/title-qrcode.png') } resizeMode='center' style={styles.titleQrcodeBonder} > | <ImageBackground source={require('./image/title-qrcode.png') } resizeMode='center' style={styles.titleQrcodeBonder} > | ||||
| <View style={styles.titleQrcodePlacehold}></View> | <View style={styles.titleQrcodePlacehold}></View> | ||||
| <Image source={{uri: this.state.baseInfo.imgQrcodeWeapp}} resizeMode='center' style={styles.titleQrcode} /> | <Image source={{uri: this.state.baseInfo.imgQrcodeWeapp}} resizeMode='center' style={styles.titleQrcode} /> | ||||
| <View style={styles.titleQrcodePlacehold}></View> | <View style={styles.titleQrcodePlacehold}></View> | ||||
| </ImageBackground> | </ImageBackground> | ||||
| </View> | </View> | ||||
| {/* 券列表展示列表开始 */} | |||||
| {this.getContentView()} | {this.getContentView()} | ||||
| {/* 底部商场信息展示开始 */} | |||||
| <View style={styles.bottom}> | <View style={styles.bottom}> | ||||
| <View style={styles.bottomLogoBackground}> | <View style={styles.bottomLogoBackground}> | ||||
| <Image source={{ uri: this.state.baseInfo.imgUrlH, cache: 'force-cache'}} resizeMode='contain' style={styles.bottomLogo} /> | <Image source={{ uri: this.state.baseInfo.imgUrlH, cache: 'force-cache'}} resizeMode='contain' style={styles.bottomLogo} /> | ||||
| @@ -383,7 +383,6 @@ render() { | |||||
| </View> | </View> | ||||
| <Text style={styles.bottomPlacehold}>{this.state.versionInfo}</Text> | <Text style={styles.bottomPlacehold}>{this.state.versionInfo}</Text> | ||||
| </View> | </View> | ||||
| </ImageBackground> | </ImageBackground> | ||||
| ); | ); | ||||
| } | } | ||||
| @@ -610,8 +609,8 @@ render() { | |||||
| flex: 6, | flex: 6, | ||||
| width:'100%', | width:'100%', | ||||
| height:'100%', | height:'100%', | ||||
| paddingLeft: 27/PixelRatio.get(), | |||||
| paddingRight: 79/PixelRatio.get(), | |||||
| paddingLeft: 20/PixelRatio.get(), | |||||
| paddingRight: 20/PixelRatio.get(), | |||||
| alignItems: 'center', | alignItems: 'center', | ||||
| backgroundColor:'transparent' | backgroundColor:'transparent' | ||||
| }, | }, | ||||
| @@ -629,6 +628,7 @@ render() { | |||||
| width:'100%', | width:'100%', | ||||
| height:'100%', | height:'100%', | ||||
| alignItems: 'center', | alignItems: 'center', | ||||
| color:"black", | |||||
| backgroundColor:'transparent', | backgroundColor:'transparent', | ||||
| textAlign :'center', | textAlign :'center', | ||||
| textAlignVertical:'center', | textAlignVertical:'center', | ||||
| @@ -657,28 +657,33 @@ render() { | |||||
| color: 'darkgray' | color: 'darkgray' | ||||
| }, | }, | ||||
| //layer content item top detail | |||||
| // 券的title | |||||
| contentItemTopDetailTitle:{ | contentItemTopDetailTitle:{ | ||||
| flex: 2, | flex: 2, | ||||
| // height:'100%', | |||||
| width:'100%', | width:'100%', | ||||
| height:'100%', | |||||
| marginTop:"2%", | |||||
| // borderStyle:"solid", | |||||
| // borderWidth:1, | |||||
| // borderColor:"red", | |||||
| backgroundColor:'transparent', | backgroundColor:'transparent', | ||||
| textAlign :'left', | textAlign :'left', | ||||
| color:"black", | |||||
| textAlignVertical:'center', | textAlignVertical:'center', | ||||
| fontSize: 53/PixelRatio.get(), | fontSize: 53/PixelRatio.get(), | ||||
| }, | }, | ||||
| /* | |||||
| contentItemTopDetailRemark:{ | |||||
| flex: 1, | |||||
| width:'100%', | |||||
| height:'100%', | |||||
| backgroundColor:'transparent', | |||||
| textAlign :'left', | |||||
| textAlignVertical:'center', | |||||
| fontSize: 27/PixelRatio.get(), | |||||
| color : 'gray' | |||||
| }, | |||||
| */ | |||||
| /* | |||||
| contentItemTopDetailRemark:{ | |||||
| flex: 1, | |||||
| width:'100%', | |||||
| height:'100%', | |||||
| backgroundColor:'transparent', | |||||
| textAlign :'left', | |||||
| textAlignVertical:'center', | |||||
| fontSize: 27/PixelRatio.get(), | |||||
| color : 'gray' | |||||
| }, | |||||
| */ | |||||
| contentItemTopDetailPrice:{ | contentItemTopDetailPrice:{ | ||||
| flex: 2, | flex: 2, | ||||
| width:'100%', | width:'100%', | ||||
| @@ -687,6 +692,7 @@ render() { | |||||
| flexDirection: 'row', | flexDirection: 'row', | ||||
| }, | }, | ||||
| // 售价的样式 | |||||
| contentItemTopDetailCurPrice:{ | contentItemTopDetailCurPrice:{ | ||||
| flex: 3, | flex: 3, | ||||
| width:'100%', | width:'100%', | ||||
| @@ -713,11 +719,14 @@ render() { | |||||
| fontSize: 48/PixelRatio.get(), | fontSize: 48/PixelRatio.get(), | ||||
| color : 'red' | color : 'red' | ||||
| }, | }, | ||||
| // 面额的样式 | |||||
| contentItemTopDetailSalePrice:{ | contentItemTopDetailSalePrice:{ | ||||
| flex: 1, | |||||
| position:"absolute", | |||||
| bottom:0, | |||||
| left:0, | |||||
| // flex: 1, | |||||
| width:'100%', | width:'100%', | ||||
| height:'100%', | |||||
| height:'30%', | |||||
| backgroundColor:'transparent', | backgroundColor:'transparent', | ||||
| }, | }, | ||||