Authored by chenl

调整了品牌的swiper控件。review by 孙凯。

... ... @@ -2,14 +2,13 @@
import React from 'react';
import ReactNative from 'react-native';
import Swiper from 'react-native-swiper';
import ImmutablePropTypes from 'react-immutable-proptypes';
import SlicedImage from '../../../common/components/SlicedImage';
import Immutable, {Map} from 'immutable';
import YH_Image from '../../../common/components/YH_Image';
import {getSlicedUrl} from '../../utils/Utils';
import DeviceInfo from 'react-native-device-info';
import YH_Swiper from '../../../common/components/YH_Swiper';
const {
View,
... ... @@ -25,28 +24,6 @@ export default class BrandSwiper extends React.Component {
constructor(props) {
super (props);
this.dot = <View
style={{
backgroundColor:'rgba(237, 237, 237, 0.5)',
width: 6,
height: 6,
borderRadius: 3,
marginLeft: 3,
marginRight: 3,
marginTop: 0,
}}
/>;
this.activeDot = <View
style={{
backgroundColor:'white',
width: 6,
height: 6,
borderRadius: 3,
marginLeft: 3,
marginRight: 3,
marginTop: 0,
}}
/>;
//A版比例640X330 B版比例640X310
height = this.props.abversion == "B" ? Math.ceil((310 / 640) * width) : Math.ceil((330 / 640) * width);
}
... ... @@ -114,14 +91,12 @@ export default class BrandSwiper extends React.Component {
} else {
return (
<View style={styles.container}>
<Swiper
<YH_Swiper
style={styles.banner}
showsButtons={false}
loop={true}
autoplay={true}
autoplayTimeout={3}
dot={this.dot}
activeDot={(Platform.OS === 'ios')?this.activeDot:null}
width={width}
height={height+15}
paginationStyle={{backgroundColor: 'rgba(0,0,0,0.2)',bottom: 25,height: 10,width: list.length * 12,borderRadius: 5,marginLeft: (width-list.length * 12)/2}}
... ... @@ -154,7 +129,7 @@ export default class BrandSwiper extends React.Component {
</TouchableOpacity>
);
})}
</Swiper>
</YH_Swiper>
</View>
);
}
... ...
import React from 'react';
import ReactNative from 'react-native';
import Swiper from 'react-native-swiper';
import RecyclerSwiper from '../recycler-swiper/recyclerswiper'
const {
Component,
} = React;
const {
View,
Platform,
} = ReactNative;
/**
* 轮播图片
*
**/
export default class YH_Swiper extends Component {
constructor(props) {
super (props);
this.dot = <View
style={{
backgroundColor:'rgba(237, 237, 237, 0.5)',
width: 6,
height: 6,
borderRadius: 3,
marginLeft: 3,
marginRight: 3,
marginTop: 0,
}}
/>;
this.activeDot = <View
style={{
backgroundColor:'white',
width: 6,
height: 6,
borderRadius: 3,
marginLeft: 3,
marginRight: 3,
marginTop: 0,
}}
/>;
}
render() {
if (Platform.OS === 'ios') {
return (
<Swiper
dot={this.dot}
activeDot={this.activeDot}
{...this.props}
>
{this.props.children}
</Swiper>
);
}
else{
return (
<RecyclerSwiper
dot={this.dot}
activeDot={this.activeDot}
{...this.props}
>
{this.props.children}
</RecyclerSwiper>
);
}
}
}
... ...