Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Touching chart doesn't work in android but does on iOS

See original GitHub issue

Issue Description

Touching the chart on an android machine doesn’t ‘interact’ but iOS is perfect. Is there anything extra I need to put on my page to make this work on android ?

Here is my code. Thank you!

              <LineChart height={SIZE / 3.5} width={SIZE - 48}>
                <LineChart.Path color='rgba(194, 24, 91, 1)'/>
                <LineChart.CursorCrosshair color='white'/>
              </LineChart>
              <LineChart.PriceText format={({ value }) => {'worklet';const formattedPrice = formatUSD(value);return `${formattedPrice}`;}} precision={9} style={[tw("font-bold"),{color: 'white', margin: 4}]}/>
              <LineChart.DatetimeText style={[tw("font-bold"),{color: 'white', margin: 4}]}/>
            </LineChart.Provider>```

Issue Analytics

State:
Created a year ago
Comments:7

Top GitHub Comments

4reactions

lxc-xxcommented, Mar 1, 2022

Well, to those who have the same issue, here is my workaround.

Wrap your component using a HOC (gestureHandlerRootHOC) from React Native Gesture Handler

But this still leaves issue on android. The touching stops after a few seconds on android.

import {gestureHandlerRootHOC} from "react-native-gesture-handler";

const ExampleWithHoc = gestureHandlerRootHOC(() => (
    <View>
      <DraggableBox />
    </View>
  );
);

export default function Example() {
  return (
    <Modal>
      <ExampleWithHoc />
    </Modal>
  );
}

Reference: https://docs.swmansion.com/react-native-gesture-handler/docs/#android

0reactions

Anurag2206commented, Jul 19, 2022

Well, to those who have the same issue, here is my workaround.

Wrap your component using a HOC (gestureHandlerRootHOC) from React Native Gesture Handler

But this still leaves issue on android. The touching stops after a few seconds on android.
import {gestureHandlerRootHOC} from "react-native-gesture-handler";

const ExampleWithHoc = gestureHandlerRootHOC(() => (
    <View>
      <DraggableBox />
    </View>
  );
);

export default function Example() {
  return (
    <Modal>
      <ExampleWithHoc />
    </Modal>
  );
}
Reference: https://docs.swmansion.com/react-native-gesture-handler/docs/#android

This is a good solution but we don’t need to add HOC for this use case. Just wrap your Scrollview / Flatlist inside gestureHandlerRootView and it will work fine. This will solve touching stops after a few seconds on an android issue as well.

Top Results From Across the Web

react-native-wagmi-charts doesnt responds on touch on android

This solution worked for me on Expo. https://github.com/coinjar/react-native-wagmi-charts/issues/73#issuecomment-1055333633. Example:

Move from Android to iPhone, iPad, or iPod touch

Move from Android to iPhone, iPad, or iPod touch · Before you begin · Get started on your Apple device · Tap Move...

touch click on android tablets doesnt work | CanvasJS Charts

Hello. I tried on different tablets with android chrome and other browsers to test but the click event is not firing.

Android vs iOS - Difference and Comparison - Diffen

Android vs iOS comparison. Google's Android and Apple's iOS are operating systems used primarily in mobile technology, such as smartphones and tablets.

Device compatibility overview - Android Developers

However, you do need to consider whether your app is compatible with each potential device configuration. Because Android runs on a wide range...