sergiodt
/
vn-verdnaturachat
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Improve Rooms List (#152) 

Use TouchableHighlight and TouchableNativeFeedback instead of TouchableOpacity
This commit is contained in:
Martin Schoeler 2017-12-20 13:57:33 -02:00 committed by Guilherme Gazzo
parent 1ff125a477
commit a15774c4ff
5 changed files with 1428 additions and 1198 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

928
__tests__/__snapshots__/RoomItem.js.snap
View File

File diff suppressed because it is too large Load Diff

1673
__tests__/__snapshots__/Storyshots.test.js.snap
View File

File diff suppressed because it is too large Load Diff

19
app/presentation/RoomItem.js
View File

@ -1,8 +1,9 @@
import React from 'react'; import React from 'react';
import moment from 'moment'; import moment from 'moment';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { View, Text, StyleSheet, TouchableOpacity } from 'react-native'; import { View, Text, StyleSheet } from 'react-native';
import Avatar from '../containers/Avatar'; import Avatar from '../containers/Avatar';
import Touch from '../utils/touch/index'; //eslint-disable-line
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
@ -112,14 +113,16 @@ export default class RoomItem extends React.PureComponent {
accessibilityLabel += `, last message ${ date }`; accessibilityLabel += `, last message ${ date }`;
return ( return (
<TouchableOpacity onPress={this.props.onPress} style={[styles.container, favorite && styles.favorite]} accessibilityLabel={accessibilityLabel} accessibilityTraits='selected'> <Touch onPress={this.props.onPress} underlayColor='#FFFFFF' activeOpacity={0.5} accessibilityLabel={accessibilityLabel} accessibilityTraits='selected'>
{this.icon} <View style={[styles.container, favorite && styles.favorite]}>
<View style={styles.roomNameView}> {this.icon}
<Text style={[styles.roomName, alert && styles.alert]} ellipsizeMode='tail' numberOfLines={1}>{ name }</Text> <View style={styles.roomNameView}>
{_updatedAt ? <Text style={styles.update} ellipsizeMode='tail' numberOfLines={1}>{ date }</Text> : null} <Text style={[styles.roomName, alert && styles.alert]} ellipsizeMode='tail' numberOfLines={1}>{ name }</Text>
{_updatedAt ? <Text style={styles.update} ellipsizeMode='tail' numberOfLines={1}>{ date }</Text> : null}
</View>
{this.renderNumber(unread, userMentions)}
</View> </View>
{this.renderNumber(unread, userMentions)} </Touch>
</TouchableOpacity>
); );
} }
} }

3
app/utils/touch/index.android.js Normal file
View File

@ -0,0 +1,3 @@
import { TouchableNativeFeedback } from 'react-native';
export default TouchableNativeFeedback;

3
app/utils/touch/index.ios.js Normal file
View File

@ -0,0 +1,3 @@
import { TouchableHighlight } from 'react-native';
export default TouchableHighlight;