Open xpbtmusic opened 7 years ago
Can you explain a bit more your issue ?
hello , I have a similar problem . in the flatlist, if Swiper is not in the screen, it will not work. how do i fix it?
the swiper is the header of flatlist
Can you give me a full example of your issue that I might reproduce easily (with style and imports) ? I would be able to help you with that...
Also happens inside ScrollView, if Swiper is not in the screen.
Oh.. In my case, removeClippedSubviews props in ScrollView was the problem.
I use the components ‘https://github.com/leecade/react-native-swiper/blob/master/examples/components/LoadMinimal/index.js’ as the header of FlatList.But not show. "react-native-swiper": "^1.5.4", "react": "16.0.0-alpha.6", "react-native": "0.44.0",`import React, {Component} from 'react'; import { StyleSheet, View, FlatList, Text, Button, Image } from 'react-native'; import Swiper from 'react-native-swiper'; var ITEM_HEIGHT = 20;
export default class FlatListDemo extends Component { static navigationOptions = { title: 'FlatList', };
_renderItem = (item) => {
var txt = '第' + item.index + '个' + ' title=' + item.item.title;
var bgColor = item.index % 2 == 0 ? 'red' : 'blue';
return <Text style={[{flex:1,height:ITEM_HEIGHT,backgroundColor:bgColor},styles.txt]}>{txt}</Text>
}
_header = () => {
return <Swiper style={{height:200}}><Image
source={{uri:'http://img3.redocn.com/tupian/20150430/mantenghuawenmodianshiliangbeijing_3924704.jpg'}}/><Image
source={{uri:'http://img3.redocn.com/tupian/20150430/mantenghuawenmodianshiliangbeijing_3924704.jpg'}}/><Image
source={{uri:'http://img3.redocn.com/tupian/20150430/mantenghuawenmodianshiliangbeijing_3924704.jpg'}}/></Swiper>
}
_footer = () => {
return <Text style={[styles.txt,{backgroundColor:'black'}]}>这是尾部</Text>;
}
_separator = () => {
return <View style={{height:2,backgroundColor:'yellow'}}/>;
}
render() {
var data = [];
for (var i = 0; i < 10; i++) {
data.push({key: i, title: i + ''});
}
return (
<View style={{flex:1}}>
<FlatList
ref={(flatList)=>this._flatList = flatList}
ListHeaderComponent={this._header}
ListFooterComponent={this._footer}
ItemSeparatorComponent={this._separator}
renderItem={this._renderItem}
onEndReached={(info)=>{
console.warn(info.distanceFromEnd);
}}
data={data}>
</FlatList>
</View>
);
}
}
const styles = StyleSheet.create({ txt: { textAlign: 'center', textAlignVertical: 'center', color: 'white', fontSize: 13, } });`
I also meet the same problem....... please fix it. thanks.
consider giving height and width to your image, it works perfectly.
Hi, In the flatlist,the network image not show,the local image can show.