Event_.native 'hitSlop' might not work

[mosesoak]

Tried using hitSlop={20} and some larger values, but the press event didn't fire unless touching the exact edge of the view being wrapped

[kylpo]

Think I need a code snippet to try here. hitSlop is working in the starter app. Note: zIndex and components that touch will affect how hitSlop works. Closing for now, please let me know if you still see issues and have repro code/steps.

[mosesoak]

Example: a search icon made of a tappable image (for your reference: Search/Supply/_/TopBar) is written with a helper View to provide hitSlop using padding, but it should work without that View by setting hitSlop.

Line 59:

          <Event_
            onPress={() => { }}
            pressEffect='opacity'
          >
            <View
              padding={20}
              basis={53}
            >
              <Image
                height={13}
                width={13}
                source={require('icons/search_dark.png')}
              />
            </View>
          </Event_>

Should also work as:

          <Event_
            onPress={() => { }}
            pressEffect='opacity'
            hitSlop={20}
          >
            <Image
              marginRight={20}
              height={13}
              width={13}
              source={require('icons/search_dark.png')}
            />
          </Event_>

But you'll notice that you have to touch the actual PNG to get a hit response – this is testable in Simulator.

[kylpo]

Oh, I know the answer to that one, actually. Image doesn't support hitSlop. Notice it missing on https://facebook.github.io/react-native/docs/image.html.

[kylpo]

It is on my list for looking in to whether or not I can fix in RN core.

[mosesoak]

Ah! Yes I see, works on View but not on Image. Thanks Kyle