Skip to content

[Android] Absolutely positioned button not getting press events  #1265

@lbrdar

Description

@lbrdar

An absolutely positioned button on Android won't detect press events if it's wrapped in a component whose style either

1. has backgroundColor property set

Minimal example:

import * as React from 'react';
import * as Rx from 'reactxp';

Rx.App.initialize(true, false);
Rx.UserInterface.setMainView(
   <Rx.View style={{ backgroundColor: 'blue' }}>
     <Rx.Button style={{ position: 'absolute' }} onPress={() => console.error('clicked')}>
       <Rx.Text>CLICK ME</Rx.Text>
     </Rx.Button>
   </Rx.View>
);

2. has animated value

Minimal example:

import * as React from 'react';
import * as Rx from 'reactxp';

const opacity = Rx.Animated.createValue(0);
const animation = Rx.Animated.timing(opacity, {
  duration: 200,
  toValue: 1
});

Rx.App.initialize(true, false);
Rx.UserInterface.setMainView(
  <Rx.Animated.View style={{ opacity }}>
    <Rx.Button style={{ position: 'absolute' }} onPress={() => console.error('clicked')}>
      <Rx.Text>CLICK ME</Rx.Text>
    </Rx.Button>
  </Rx.Animated.View>
);

animation.start();

In both of these examples if you simply update View or Animated.View styles to be an empty object or omit it completely it will work (i.e. button will receive press events).

Does anyone know what might be causing this? Any workaround?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions