You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
119 lines
2.9 KiB
119 lines
2.9 KiB
import React, {Component} from 'react'; |
|
import { |
|
Image, |
|
View, |
|
StyleSheet, |
|
TouchableOpacity, |
|
ScrollView |
|
} from 'react-native'; |
|
import {Directory} from '../../public/plugin/api'; |
|
import {FullList} from './FullList'; |
|
import { from } from 'core-js/fn/array'; |
|
|
|
const DirectoryScrollView = Directory.DirectoryScrollView; |
|
var image = require('./fold.png'); |
|
|
|
class MainList extends Component { |
|
constructor(props) { |
|
super(props); |
|
this.state = { |
|
hidden : true |
|
} |
|
} |
|
Change = () => { |
|
|
|
this.setState({ |
|
hidden : this.state.hidden ? false : true |
|
}) |
|
} |
|
render() { |
|
|
|
const data = this._getData(); |
|
const content = data.map((item, index) => ( |
|
this.getItem(item, index) |
|
)); |
|
|
|
if(content.length < 5){ |
|
return <DirectoryScrollView> |
|
<ScrollView contentContainerStyle={styles.list}> |
|
{content} |
|
</ScrollView> |
|
</DirectoryScrollView> |
|
} |
|
|
|
|
|
if (!this.state.hidden){ |
|
|
|
return( |
|
|
|
<FullList pprops = {this.props} Change = {this.Change}/> |
|
) |
|
} |
|
|
|
fullIcon = (<View style={styles.gridWrapper} > |
|
<TouchableOpacity |
|
onPress={ |
|
this.Change |
|
}><Image source={image} style={{ width: 36, height: 36, margin: 'auto'}} /> |
|
<p style={{color: "#666", fontSize: 12, textAlign: "center"}}>全部</p> |
|
</TouchableOpacity> |
|
</View>); |
|
return ( |
|
<DirectoryScrollView > |
|
<ScrollView contentContainerStyle={styles.list}> |
|
{content} |
|
</ScrollView> |
|
</DirectoryScrollView> |
|
)} |
|
|
|
getItem(item, index) { |
|
return ( |
|
<View style={styles.gridWrapper} key={index}> |
|
<TouchableOpacity |
|
onPress={() => this.props.navigateNode(item)}> |
|
{Directory.createIconGrid(item, {iconStyle: styles.gridIcon})} |
|
</TouchableOpacity> |
|
</View> |
|
) |
|
} |
|
|
|
_getData() { |
|
return this.props.currentNode.getChildNodes(); |
|
} |
|
} |
|
|
|
class Static extends Component{ |
|
render() { |
|
|
|
const content = this.props.content; |
|
var foldList = content.slice(0, 4); |
|
return foldList; |
|
} |
|
|
|
} |
|
|
|
export default MainList; |
|
|
|
const styles = StyleSheet.create({ |
|
gridWrapper: { |
|
width: "20%", |
|
//height: "17.5%", |
|
marginTop: 10 |
|
}, |
|
gridIcon: { |
|
width: 36, |
|
height: 36, |
|
borderRadius: 8, |
|
|
|
}, |
|
list: { |
|
flex: 1, |
|
flexDirection: "row", |
|
overflow: "hidden auto", |
|
//alignContent:"flex-start", |
|
flexWrap: "wrap", |
|
width: "100%", |
|
transform: "translateZ(0px)" |
|
|
|
} |
|
}); |