[TouchableHighlight] Preserve underlay style when restoring inactive props #129
Conversation
| this.refs[UNDERLAY_REF].setNativeProps(INACTIVE_UNDERLAY_PROPS); | ||
| var underlayProps = Object.assign({}, INACTIVE_UNDERLAY_PROPS); | ||
| underlayProps.style = this.state.underlayStyle; | ||
| this.refs[UNDERLAY_REF].setNativeProps(underlayProps); |
There was a problem hiding this comment.
this.refs[UNDERLAY_REF].setNativeProps({
...INACTIVE_UNDERLAY_PROPS,
style: this.state.underlayStyle,
});There was a problem hiding this comment.
That's nicer, thanks @cpojer. If this diff gets merged in by hand can whoever merges it use the splat syntax? Otherwise I can update this PR if commits from the OSS repo can be directly pulled in now.
There was a problem hiding this comment.
Feel free to update the PR - it's trivial for us to apply internally and sync back out now.
On Mar 8, 2015, at 4:56 AM, James Ide notifications@github.com wrote:
In Libraries/Components/Touchable/TouchableHighlight.js:
@@ -156,7 +156,9 @@ var TouchableHighlight = React.createClass({
this._hideTimeout = null;
if (this.refs[UNDERLAY_REF]) {
this.refs[CHILD_REF].setNativeProps(INACTIVE_CHILD_PROPS);
this.refs[UNDERLAY_REF].setNativeProps(INACTIVE_UNDERLAY_PROPS);var underlayProps = Object.assign({}, INACTIVE_UNDERLAY_PROPS);underlayProps.style = this.state.underlayStyle;this.refs[UNDERLAY_REF].setNativeProps(underlayProps);—
Reply to this email directly or view it on GitHub.
…props
If you give a TouchableHighlight component some styling (e.g. a background color) with the `underlayStyle` prop, the style is wiped away after touching the component. This diff restores the `underlayStyle`.
Test Plan: Create a TouchableHighlight that receives `underlayStyle={{style:
'blue'}}`. It initially has a blue background. Touch it and let go. See the blue background now comes back as expected.
|
Updated w/splat syntax and tested. |
|
One thing that hit me was that this affects the ListView example. The delay is quite noticeable there too. JG 301.785.6030 :: @moduscreate :: sent from my mobile device ::
|
|
Fixes #156 |
|
Pulled in Sorry, I don't know what happened but the commit title didn't appear in the list. |
|
Thanks @vjeux! |
…props Summary: If you give a TouchableHighlight component some styling (e.g. a background color) with the `underlayStyle` prop, the style is wiped away after touching the component. This diff restores the `underlayStyle`. Closes facebook#129 Github Author: James Ide <ide@jameside.com> Test Plan: Create a TouchableHighlight that receives `underlayStyle={{style: 'blue'}}`. It initially has a blue background. Touch it and let go. See the blue background now comes back as expected.
…props Summary: If you give a TouchableHighlight component some styling (e.g. a background color) with the `underlayStyle` prop, the style is wiped away after touching the component. This diff restores the `underlayStyle`. Closes facebook#129 Github Author: James Ide <ide@jameside.com> Test Plan: Create a TouchableHighlight that receives `underlayStyle={{style: 'blue'}}`. It initially has a blue background. Touch it and let go. See the blue background now comes back as expected.
…props Summary: If you give a TouchableHighlight component some styling (e.g. a background color) with the `underlayStyle` prop, the style is wiped away after touching the component. This diff restores the `underlayStyle`. Closes facebook#129 Github Author: James Ide <ide@jameside.com> Test Plan: Create a TouchableHighlight that receives `underlayStyle={{style: 'blue'}}`. It initially has a blue background. Touch it and let go. See the blue background now comes back as expected.
If you give a TouchableHighlight component some styling (e.g. a background color) with the
underlayStyleprop, the style is wiped away after touching the component. This diff restores theunderlayStyle.Test Plan: Create a TouchableHighlight that receives
underlayStyle={{style: 'blue'}}. It initially has a blue background. Touch it and let go. See the blue background now comes back as expected.