Skip to content

Events are not passed through to the foreground view if STICKY_HEADER_HEIGHT overlaps #25

Open
@PublicParadise

Description

@PublicParadise

Steps

In ListView Talk.js wrap foreground's Image in a TouchableOpacity like this:

          renderForeground={() => (
            <View key="parallax-header" style={ styles.parallaxHeader }>
              <TouchableOpacity onPress={() => { AlertIOS.alert('Foreground Clicked!') }}>
                <Image style={ styles.avatar } source={{
                    uri: 'https://pbs.twimg.com/profile_images/2694242404/5b0619220a92d391534b0cd89bf5adc1_400x400.jpeg',
                    width: AVATAR_SIZE,
                    height: AVATAR_SIZE
                }}/>
              </TouchableOpacity>  
...

Build and run the modified code, then click on the foreground image, that is, the head in the bubble.
The result is: "Foreground Clicked"

screen shot 2016-03-20 at 9 26 04 pm

So far, so good.
Now increase STICKY_HEADER_HEIGHT from 70 to 270:

const STICKY_HEADER_HEIGHT = 270;

(By increasing STICKY_HEADER_HEIGHT from 70 to 270 the sticky header are will overlap with the foreground are that renders the TouchableOpacity area.)

Build and run the modified code, then click on the foreground image, that is, the head in the bubble - as before.

EXPECTED

Alert popping up saying "Foreground Clicked!"

ACTUAL

No alert.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions