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.

Sign up for GitHub

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

Jump to bottom

[BUG] List item onPress fired with a loooooong delay (after 3 or 4 second) #1024

Closed
mnlbox opened this issue Jul 9, 2017 · 11 comments
Closed

[BUG] List item onPress fired with a loooooong delay (after 3 or 4 second) #1024

mnlbox opened this issue Jul 9, 2017 · 11 comments
Labels
awaiting response performance

Comments

@mnlbox
Copy link

mnlbox commented Jul 9, 2017 •
edited
Loading

react-native, react and native-base version

    "native-base": "^2.1.5",
    "react": "16.0.0-alpha.12",
    "react-native": "0.45.1",

Expected behaviour

List item onPress fired with a loooooong delay (after 3 or 4 second)

Actual behaviour

Steps to reproduce (code snippet or screenshot)

This is my SideMenu code:

import React, { Component } from 'react';
import { Image, Text, View} from 'react-native';
import { Container, Content, List, ListItem, Drawer, Header, Title, Button, Left, Right, Body, Icon,
    Separator} from 'native-base';
import styles from '../styles/sideMenu';
import {observer} from 'mobx-react/native';
@observer
export default class SideMenu extends Component {
    constructor(props) {
        super(props);

        this.pressMenuItem = this.pressMenuItem.bind(this);
    }
    pressMenuItem(pageState) {
        this.props.store.pageState = pageState;
    }
    render () {
        const MenuComponent = (
            <Container>
                <Header>
                   ...
                </Header>
                <Content
                    style={{ flex: 1, flexDirection: 'column', backgroundColor: '#fff', top: -1 }}
                >
                    ...
                    <List>
                        <ListItem iconRight style={{marginLeft: 0}} onPress={() => {
                            console.warn("click home");
                            this.pressMenuItem("home")
                        }}>
                            <Right><Icon name="arrow-back" /></Right>
                            <Body><Text style={[styles.englishText, {textAlign: 'center'}]}>Home</Text></Body>
                            <Right><Icon name="home" /></Right>
                        </ListItem>
...
                    </List>

                </Content>
            </Container>
        );
        return (
            <Drawer
                content={MenuComponent}
                tapToClose={true}
                openDrawerOffset={0.4} // 20% gap on the right side of drawer
                closedDrawerOffset={-3}
                panCloseMask={0.90}
                panOpenMask={0.90}
                tweenHandler={(ratio) => ({
                    main: { opacity:(2-ratio)/2 }
                })}>
                { this.props.children }
            </Drawer>
        )
    }
}

Screenshot of emulator/device

menupressdelay
Please see delay between when I tap on Home button in SideMenu and when you see console.warn("click home"); output.

Is the bug present in both ios and android or in any one of them?

I don't know about ios but I'm in Nexus 7 Tab with Android 5.1.1
@mnlbox
Copy link
Author

mnlbox commented Jul 9, 2017

Maybe related to this: #759

@mnlbox
Copy link
Author

mnlbox commented Jul 12, 2017 •
edited
Loading

Guys Are you have any suggestion?

/CC: @sankhadeeproy007 , @SupriyaKalghatgi, @shivrajkumar

@mnlbox
Copy link
Author

mnlbox commented Jul 12, 2017

Maybe other related issue: facebook/react-native#2558 and #662

@mnlbox
Copy link
Author

mnlbox commented Jul 16, 2017

This is a terrible issue please help me to fix it or if it's a bug from NativeBase tell me know and add some label to it.
Thanks guys.

@mnlbox mnlbox mentioned this issue Jul 16, 2017
Closed
@mnlbox mnlbox changed the title List item onPress fired with a loooooong delay (after 3 or 4 second) [BUG] List item onPress fired with a loooooong delay (after 3 or 4 second) Jul 16, 2017
@shivrajkumar
Copy link
Collaborator

@mnlbox Have you tried this with React Native components

@mnlbox
Copy link
Author

mnlbox commented Sep 12, 2017

@shivrajkumar Can you explain more? For example with FlastList?

@SupriyaKalghatgi
Copy link
Contributor

@mnlbox Please check the reply here
#759 comment

@akhil-ga
Copy link
Contributor

akhil-ga commented Nov 8, 2017

@mnlbox FlatList with ListItem

listitem

@akhil-ga
Copy link
Contributor

Using FlatList solves the issue. Closing the issue.

@Bundas
Copy link

Bundas commented Mar 11, 2018

@akhil-geekyants What? It maybe solves his problem but it certainly does not solve the bug itself...

@mnlbox
Copy link
Author

mnlbox commented Dec 23, 2018

@SupriyaKalghatgi Any news?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
awaiting response performance
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@Bundas @SupriyaKalghatgi @shivrajkumar @mnlbox @akhil-ga