...
|
...
|
@@ -4,6 +4,7 @@ import React from 'react'; |
|
|
import ReactNative from 'react-native';
|
|
|
import {isEmptyObject} from '../../utils/Utils';
|
|
|
import Immutable, {Map} from 'immutable';
|
|
|
import * as _ from 'lodash';
|
|
|
|
|
|
const {
|
|
|
View,
|
...
|
...
|
@@ -19,6 +20,10 @@ export default class IndexListView extends React.Component { |
|
|
constructor(props) {
|
|
|
super (props);
|
|
|
this.onTouchMove = this.onTouchMove.bind(this);
|
|
|
|
|
|
this.state = {
|
|
|
list:[]
|
|
|
};
|
|
|
}
|
|
|
|
|
|
shouldComponentUpdate(nextProps){
|
...
|
...
|
@@ -31,16 +36,26 @@ export default class IndexListView extends React.Component { |
|
|
|
|
|
onTouchMove(e) {
|
|
|
let {dataSource} = this.props;
|
|
|
let Y = e.nativeEvent.pageY - Math.ceil((viewHeight - dataSource.length * (itemHeight+2))/2) - 8-28;
|
|
|
var index = Math.ceil(Y/(itemHeight+2))-1;
|
|
|
if (dataSource.length - index < 4) {
|
|
|
return;
|
|
|
}
|
|
|
let sectionID = dataSource[index];
|
|
|
if (!sectionID) {
|
|
|
return;
|
|
|
let Y = e.nativeEvent.pageY;
|
|
|
for (var i = 0; i < this.state.list.length; i++) {
|
|
|
if (Y > this.state.list[i].y && Y < this.state.list[i].y + 12) {
|
|
|
let name = this.state.list[i].name;
|
|
|
if (name == '0') {
|
|
|
name = '0-9';
|
|
|
}
|
|
|
console.log(name);
|
|
|
this.props.onLetterPress && this.props.onLetterPress(i,name);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
this.props.onLetterPress && this.props.onLetterPress(index,sectionID);
|
|
|
}
|
|
|
|
|
|
onLayout(name,e) {
|
|
|
let {y} = e.nativeEvent.layout;
|
|
|
let Y = {'name':name,'y':y}
|
|
|
let list = this.state.list;
|
|
|
list.push(Y);
|
|
|
this.setState(list)
|
|
|
}
|
|
|
|
|
|
render() {
|
...
|
...
|
@@ -58,7 +73,9 @@ export default class IndexListView extends React.Component { |
|
|
if (name == '0-9') {
|
|
|
name = '0';
|
|
|
}
|
|
|
keyData.push(<Text key={i} style={styles.text}>{name}</Text>);
|
|
|
|
|
|
|
|
|
keyData.push(<View key={i} style={styles.TV} onLayout={this.onLayout.bind(this, name)}><Text style={styles.text}>{name}</Text></View>);
|
|
|
}
|
|
|
|
|
|
return (
|
...
|
...
|
@@ -71,7 +88,7 @@ export default class IndexListView extends React.Component { |
|
|
|
|
|
let {width, height} = Dimensions.get('window');
|
|
|
let itemHeight = 12;
|
|
|
let viewHeight = height - 112;
|
|
|
let viewHeight = height - 64;
|
|
|
|
|
|
let styles = StyleSheet.create({
|
|
|
container: {
|
...
|
...
|
@@ -80,17 +97,24 @@ let styles = StyleSheet.create({ |
|
|
height: viewHeight,
|
|
|
bottom : 1,
|
|
|
right: 1,
|
|
|
backgroundColor: 'rgba(255,255,255,0.2)',
|
|
|
backgroundColor: 'red',
|
|
|
alignItems: 'center',
|
|
|
justifyContent: 'center',
|
|
|
},
|
|
|
TV: {
|
|
|
width: 12,
|
|
|
height: 12,
|
|
|
backgroundColor: 'transparent',
|
|
|
marginTop: 2,
|
|
|
justifyContent: 'center',
|
|
|
},
|
|
|
text: {
|
|
|
justifyContent: 'center',
|
|
|
textAlign: 'center',
|
|
|
fontSize: 11,
|
|
|
color: 'black',
|
|
|
backgroundColor: 'transparent',
|
|
|
marginTop: 2,
|
|
|
|
|
|
fontWeight: 'bold',
|
|
|
},
|
|
|
image: {
|
...
|
...
|
|