Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] FlatList ItemSeparatorComponent not work correctly. #14661

Closed
ghost opened this issue Jun 21, 2017 · 6 comments
Closed

[BUG] FlatList ItemSeparatorComponent not work correctly. #14661

ghost opened this issue Jun 21, 2017 · 6 comments
Labels
Resolution: Locked This issue was locked by the bot.

Comments

@ghost
Copy link

ghost commented Jun 21, 2017

Description

When I set horizontal true for FlatList, ItemSeparatorComponent is added vertically. Please fix this bug. Thanks

Sample Code

import React from 'react';
import { FlatList, StyleSheet, Text, View } from 'react-native';

class App extends React.Component {
    constructor() {
        super();

        const arr = [];
        for(let i=0; i<100; i++)
            arr.push({key: i, value: i});
        this.state = {data: arr};
    }

    render() {
        return (
            <View style={ styles.container }>
                <FlatList
                    horizontal
                    ItemSeparatorComponent={ () => <View style={ { width: 10, height: 10, backgroundColor: 'red' } } /> }
                    data={ this.state.data }
                    renderItem={ (rowData) => <Text>{ rowData.item.value }</Text> }
                />
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center',
    },
});

screen

Additional Information

  • React Native version: 0.45.1
  • React: 16.0.0-alpha.12
  • Platform: ios. not checked android.
  • Development Operating System: macOS
  • Build tools: WebStorm
@hramos
Copy link
Contributor

hramos commented Jun 21, 2017

This issue looks like a question that would be best asked on StackOverflow.

StackOverflow is amazing for Q&A: it has a reputation system, voting, the ability to mark a question as answered. Because of the reputation system it is likely the community will see and answer your question there. This also helps us use the GitHub bug tracker for bugs only.

Will close this as this is really a question that should be asked on StackOverflow.

@hramos hramos closed this as completed Jun 21, 2017
@ghost
Copy link
Author

ghost commented Jun 21, 2017

@hramos This is a BUG. It works perfect in RN 0.44

@ghost ghost changed the title FlatList ItemSeparatorComponent not work correctly. [BUG] FlatList ItemSeparatorComponent not work correctly. Jun 22, 2017
@basketofsoftkittens
Copy link

+1

@hramos
Copy link
Contributor

hramos commented Jul 7, 2017

If this is a bug, feel free to open a new issue, making sure to follow the template.

@ZainaliSyed
Copy link

screenshot_1501590643
screenshot_1501590649
screenshot_1501590665
Code Working for me

@lsps9150414
Copy link

lsps9150414 commented Aug 17, 2017

@ZainaliSyed Could you share your code? What RN version are you using?

@facebook facebook locked as resolved and limited conversation to collaborators Jun 21, 2018
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Jul 18, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Resolution: Locked This issue was locked by the bot.
Projects
None yet
Development

No branches or pull requests

5 participants