Permalink
Browse files

Fixed position of ripple-effect

Summary:
I recognised that the ripple effect was always located at the bottom of my buttons. So i started to search for other ppl having the same problem. I also found this bug on the f8 app.

The gifs show the behaviour before and after my changes:

[The ripple effect is always on the bottom of the element, because pageY is used instead of the relative pos]
![before](https://cloud.githubusercontent.com/assets/956410/16042805/df49d97e-323c-11e6-8ce2-b0658ec85b27.gif)

![after](https://cloud.githubusercontent.com/assets/956410/16042804/df483a60-323c-11e6-862f-e8c97b835339.gif)

Before, the absolute position of the touch was used to update the position during movement but it should be the relative position. Just some small calculation changes were needed to achieve the correct behaviour :)
Closes #8111

Differential Revision: D3539652

fbshipit-source-id: dd8c8f3c7402d0d435f1c2ca67c1a59b474efda3
  • Loading branch information...
1 parent 70b989e commit d73446c549a4f4bbace8b7f4dedf6116553f345a @noerK noerK committed with Facebook Github Bot 9 Jul 9, 2016
Showing with 1 addition and 1 deletion.
  1. +1 −1 Libraries/Components/Touchable/TouchableNativeFeedback.android.js
@@ -185,7 +185,7 @@ var TouchableNativeFeedback = React.createClass({
_handleResponderMove: function(e) {
this.touchableHandleResponderMove(e);
- this._dispatchHotspotUpdate(e.nativeEvent.pageX, e.nativeEvent.pageY);
+ this._dispatchHotspotUpdate(e.nativeEvent.locationX, e.nativeEvent.locationY);
},
_dispatchHotspotUpdate: function(destX, destY) {

0 comments on commit d73446c

Please sign in to comment.