Browse Source

上传文件至 ''

master
jee 4 years ago
parent
commit
e36d1b232c
  1. 114
      FullList.js
  2. 119
      MainList.js
  3. BIN
      back.png
  4. BIN
      fold.png
  5. 26
      index.js

114
FullList.js

@ -0,0 +1,114 @@
import React, {Component} from 'react';
import {
Image,
View,
StyleSheet,
TouchableOpacity,
ScrollView,
Text,
FlatList
} from 'react-native';
import {Directory} from '../../public/plugin/api';
const back_image = require("./back.png");
export class FullList extends Component {
render(){
const data = this._getData();
const content = data.map((item, index) => (
this.getItem(item, index)
)).slice(4);
return (
<ScrollView contentContainerStyle={styles.list}>
<TouchableOpacity
onPress={
this.props.Change
}><Image source={back_image} style={{ width: 25, height: 25, margin: 'auto'}} />
</TouchableOpacity><Text style={{margin: 'auto',"font-size" : "20px",}}></Text>
{content}
</ScrollView>
)
}
_getData() {
return this.props.pprops.currentNode.getChildNodes();
}
getItem(item, index) {
//debugger;
return (
<View style={styles.gridWrapper} key={index}>
<Text style = {styles.title} >{item.title}</Text>
<Sub item = {item} navigateNode ={this.props.pprops.navigateNode} />
</View>
)
}
}
class Sub extends Component{
render(){
//debugger;
const data = this.props.item.getChildNodes();
const content = data.map((item, index) => (
this.getItem(item, index)
));
return (
<ScrollView contentContainerStyle={styles.list}>{content}</ScrollView>
)
}
getItem(item, index) {
//debugger;
return (
<View style={styles.box} key={index}>
<TouchableOpacity
onPress={() => this.props.navigateNode(item)}>
{Directory.createIconGrid(item, {iconStyle: styles.gridIcon})}
</TouchableOpacity>
</View>
)
}
}
const styles = StyleSheet.create({
box:{
width : "20%",
flexWrap : "nowrap",
},
title:{
height : 56,
fontSize : "20px",
marginTop: 10
},
gridWrapper: {
width: "100%",
//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)"
}
});

119
MainList.js

@ -0,0 +1,119 @@
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)"
}
});

BIN
back.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

BIN
fold.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 535 B

26
index.js

@ -0,0 +1,26 @@
import {Widget, Toolbar, Directory} from '../public/plugin/api';
import SubList from "./Zip/SubList";
import MainList from "./Zip/MainList";
let apiVersions = {
Widget: '2.0.1',
Toolbar: '2.0.0',
Directory: '2.2.0'
};
function run() {
Directory.registerFunction((directoryNode) => {
console.log(directoryNode.getLayer() );
if (directoryNode.getLayer() === 0 ) {
return MainList;
} else {
return SubList;
}
});
Directory.registerFetchLayersCountFunction(() => {
return 2;
})
}
Loading…
Cancel
Save