Skip to content

Commit 6da8bdf

Browse files
FTD-ZFFTD-ZF
committed
代码修改
1 parent ab1bc37 commit 6da8bdf

File tree

3 files changed

+106
-55
lines changed

3 files changed

+106
-55
lines changed

‎src/pages/details.js‎

Lines changed: 53 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,19 @@ import {
1111
Text,
1212
View,
1313
Image,
14+
Dimensions,
15+
ScrollView,
1416
TouchableOpacity
1517
} from 'react-native';
1618
import { AppColors } from '../commons/styles';
1719
import NavigationService from '../commons/components/navigationService';
20+
import DragSortableView from 'react-native-drag-sort';
21+
22+
const { width } = Dimensions.get('window')
23+
24+
const parentWidth = width
25+
const childrenWidth = width
26+
const childrenHeight = 48
1827

1928
export default class Index extends Component {
2029
static navigationOptions = ({ navigation }) => {
@@ -32,7 +41,13 @@ export default class Index extends Component {
3241
constructor(props) {
3342
super(props);
3443
// 初始状态
35-
this.state = {};
44+
this.state = {
45+
data: [{ name: '第1' }, { name: '第2' }, { name: '第3' }, { name: '第4' },
46+
{ name: '第5' }, { name: '第6' }, { name: '第7' }, { name: '第8' }, { name: '第9' },
47+
{ name: '第5' }, { name: '第6' }, { name: '第7' }, { name: '第8' }, { name: '第9' },
48+
{ name: '第5' }, { name: '第6' }, { name: '第7' }, { name: '第8' }, { name: '第9' },],
49+
scrollEnabled: true,
50+
};
3651
}
3752

3853
componentWillMount() {
@@ -66,26 +81,60 @@ export default class Index extends Component {
6681
backgroundColor: AppColors.themecolor,
6782
margin: 20,
6883
padding: 10,
69-
marginTop: 50,
84+
7085
}} onPress={() => this._toNextPage()}>
7186
<Text style={{ color: 'white', textAlign: 'center' }}>
7287
点击进入下个页面
7388
</Text>
7489
</TouchableOpacity>
7590

91+
7692
</View>
7793
);
7894
}
7995

96+
renderItem(item, index) {
97+
return (
98+
<View style={styles.item}>
99+
<View style={styles.item_children}>
80100

101+
<Text style={styles.item_text}>{item.name}</Text>
102+
</View>
103+
</View>
104+
)
105+
}
81106
}
82107

83108
const styles = StyleSheet.create({
84109
container: {
85110
flex: 1,
111+
112+
backgroundColor: '#F5FCFF',
113+
},
114+
item: {
115+
width: childrenWidth,
116+
height: childrenHeight,
86117
justifyContent: 'center',
87118
alignItems: 'center',
88-
backgroundColor: '#F5FCFF',
89119
},
90-
120+
item_children: {
121+
width: childrenWidth,
122+
height: childrenHeight - 4,
123+
backgroundColor: '#ffffff',
124+
flexDirection: 'row',
125+
justifyContent: 'space-between',
126+
alignItems: 'center',
127+
marginTop: 4,
128+
},
129+
item_icon: {
130+
width: childrenHeight * 0.6,
131+
height: childrenHeight * 0.6,
132+
marginLeft: 15,
133+
resizeMode: 'contain',
134+
},
135+
item_text: {
136+
marginRight: 15,
137+
color: '#2ecc71'
138+
}
139+
91140
});

‎src/pages/home/index.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -108,11 +108,11 @@ export default class Index extends Component {
108108

109109
_todetails() {
110110

111-
// NavigationService.navigate('DetailsView', {
112-
// headername: '详情',
113-
// callback: (str) => this.props.navigation.state.params.torefresh(str),
114-
// });
115-
this.setState({ f_endTime: '2019-07-19 16:49:00' })
111+
NavigationService.navigate('DetailsView', {
112+
headername: '详情',
113+
callback: (str) => this.props.navigation.state.params.torefresh(str),
114+
});
115+
// this.setState({ f_endTime: '2019-07-19 16:49:00' })
116116
}
117117

118118

‎src/pages/mine/index.js‎

Lines changed: 48 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -60,11 +60,12 @@ export default class Index extends Component {
6060
)
6161
}
6262
_keyExtractor = (item, index) => {
63-
const { keyExtractor } = this.props;
64-
if (keyExtractor) {
65-
return keyExtractor(item, index);
66-
}
67-
return index.toString();
63+
return item.name; // 我的
64+
// const { keyExtractor } = this.props;
65+
// if (keyExtractor) {
66+
// return keyExtractor(item, index);
67+
// }
68+
// return index.toString();
6869
};
6970

7071
_changeMoveData(data) {
@@ -77,47 +78,49 @@ export default class Index extends Component {
7778
render() {
7879
let label2 = this.state.label2;
7980
return (
80-
<ScrollView
81-
ref={(scrollView) => this.scrollView = scrollView}
82-
scrollEnabled={this.state.scrollEnabled}
83-
style={{
84-
flex: 1,
85-
backgroundColor: '#fff',
86-
}}>
87-
<DragSortableView
88-
dataSource={this.state.firstData}
89-
parentWidth={width}
90-
childrenWidth={width}
91-
childrenHeight={51}
92-
scaleStatus={'scaleY'}
93-
onDragStart={(startIndex, endIndex) => {
94-
this.setState({
95-
scrollEnabled: false
96-
})
97-
}}
98-
onDragEnd={(startIndex) => {
99-
this.setState({
100-
scrollEnabled: true
101-
})
102-
}}
103-
onDataChange={(data) => {
104-
if (data.length != this.state.firstData.length) {
81+
<View style={styles.container}>
82+
<ScrollView
83+
onScrollEndDrag={({ nativeEvent }) => { this.setState({ scrollOffset: nativeEvent.contentOffset['y'] }); }}
84+
onMomentumScrollEnd={({ nativeEvent }) => { this.setState({ scrollOffset: nativeEvent.contentOffset['y'] }); }}
85+
86+
ref={(scrollView) => this.scrollView = scrollView}
87+
scrollEnabled={this.state.scrollEnabled}
88+
style={styles.container}>
89+
<DragSortableView
90+
dataSource={this.state.firstData}
91+
parentWidth={width}
92+
childrenWidth={width}
93+
childrenHeight={51}
94+
scaleStatus={'scaleY'}
95+
onDragStart={(startIndex, endIndex) => {
10596
this.setState({
106-
firstData: data
107-
});
108-
}
109-
}}
110-
keyExtractor={this._keyExtractor}
111-
onClickItem={(data, item, index) => {
112-
113-
}}
114-
renderItem={(item, index) => {
115-
return this.renderDeleteItem(item, index)
116-
}}
117-
/>
118-
</ScrollView>
119-
97+
scrollEnabled: false
98+
})
99+
}}
100+
onDragEnd={(startIndex) => {
101+
this.setState({
102+
scrollEnabled: true
103+
})
104+
}}
105+
onDataChange={(data) => {
106+
if (data.length != this.state.firstData.length) {
107+
this.setState({
108+
firstData: data
109+
});
110+
}
111+
}}
112+
keyExtractor={(item, index) => item.name} // FlatList作用一样，优化
113+
// keyExtractor={this._keyExtractor}
114+
onClickItem={(data, item, index) => {
115+
116+
}}
117+
renderItem={(item, index) => {
118+
return this.renderDeleteItem(item, index)
119+
}}
120+
/>
121+
</ScrollView>
120122

123+
</View>
121124
);
122125
}
123126

@@ -127,8 +130,7 @@ export default class Index extends Component {
127130
const styles = StyleSheet.create({
128131
container: {
129132
flex: 1,
130-
justifyContent: 'center',
131-
alignItems: 'center',
133+
132134
backgroundColor: '#F5FCFF',
133135
},
134136

0 commit comments

Comments
 (0)