rn_supermap
Version:
rn_supermap 一款基于React-Native框架的移动应用开发工具。基于该开发工具,用户可以使用JavaScript开发语言,开发出在Android和IOS操作系统下运行的原生移动GIS应用,入门门槛低,一次开发,处处运行。
240 lines (218 loc) • 8.01 kB
JavaScript
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
Alert,
Platform,
} from 'react-native';
//imobile类引入
import workspaceModule from '../Workspace.js';
import util from '../utility/utility.js';
//视图类引入
import TitlePage from './SMTitlePage.js';
import ScrollPage from './SMScrollPage.js';
import WorkspaceSaveAsPage from './SMWorkspaceSaveAsPage.js';
import DsMapInfo from './SMDsMapInfoComponent.js';
import DsCreatePage from './SMDsCreatePage.js';
import DsListComponent from './SMOuterListComponent.js';
import MapListComponent from './SMMapListComponent.js';
//android need
import Environment from '../Environment.js';
export default class WorkspaceManagerComponent extends Component {
constructor(props){
super(props);
var paths = props.path.split('/');
var nameWithType = paths[paths.length-1];
this.state = {title:{display:true,text:'工作空间管理',backBtnDisplay:true,clickBtn:this._quit},
scrollPage:{display:true,text:nameWithType},
wsSaveAsPage:{display:false},
dmInfoPage:{display:false},
dsCreatePage:{display:false},
dsListPage:{display:false},
mapListPage:{display:false},
};
var workspaceM = new workspaceModule();
(async function () {
//------------------------util只适用于iOS------------------------//!!
var filePath;
if(Platform.OS==='ios'){
filePath = await util.appendingHomeDirectory(props.path);
}else{
filePath = props.path;
var environmentModule = new Environment();
await environmentModule.setLicensePath('/SuperMap/license/');
await environmentModule.initialization();
}
var workspace = await workspaceM.createObj();
await workspace.open(filePath);
this.setState({
coreData:{workspace:workspace,filePath: filePath,fileName:nameWithType,workspaceOpen:true},
});
}).bind(this)();
}
_toWsInfoPage = ()=>{
//this is scrollPage one btn,it means show workspace map&datasource info.
var fileName = this.state.coreData.fileName;
var nameArr = fileName.split('.');
var nameWithoutType = nameArr[0];
this.setState({
title:{display:true,text:nameWithoutType,backBtnDisplay:true,clickBtn:this._toMainPage,},
scrollPage:{display:false},
wsSaveAsPage:{display:false},
dmInfoPage:{display:true},
dsCreatePage:{display:false},
dsListPage:{display:false},
mapListPage:{display:false},
});
}
_wsSaveBtnPress = ()=>{
//this is scrollPage Two btn One,it means save workspace.
if(this.state.coreData.workspace){
(async function(){
var isSave = await this.state.coreData.workspace.saveWorkspace();
if(isSave){
Alert.alert(
'保存工作空间成功',
);
}else{
Alert.alert(
'保存工作空间失败',
);
}
}).bind(this)();
}
}
_toSaveAsPage = ()=>{
this.setState({
title:{display:true,text:'另存工作空间为',backBtnDisplay:false},
scrollPage:{display:false},
wsSaveAsPage:{display:true},
dmInfoPage:{display:false},
dsCreatePage:{display:false},
dsListPage:{display:false},
mapListPage:{display:false},
});
}
_wsCloseBtnPress = ()=>{
//this is scrollPage Two btn Three,it means close workspace
(async function () {
if(! this.state.coreData.workspaceOpen){
return
}
var workspace = this.state.coreData.workspace;
var filePath = this.state.coreData.filePath;
var fileName = this.state.coreData.fileName;
var isClose = await workspace.closeWorkspace();
console.log('isClose:'+isClose);
this.setState({
coreData:{workspace:workspace,filePath: filePath,fileName:fileName,workspaceOpen:!isClose},
title:{display:true,text:'工作空间管理',backBtnDisplay:true,clickBtn:this._quit},
scrollPage:{display:true,text:'未命名工作空间'},
wsSaveAsPage:{display:false},
dmInfoPage:{display:false},
dsCreatePage:{display:false},
dsListPage:{display:false},
mapListPage:{display:false},
});
}).bind(this)();
}
_toDsCreatePage = ()=>{
this.setState({
title:{display:true,text:'新建数据源',backBtnDisplay:true,clickBtn:this._toWsInfoPage,},
scrollPage:{display:false},
wsSaveAsPage:{display:false},
dmInfoPage:{display:false},
dsCreatePage:{display:true},
dsListPage:{display:false},
mapListPage:{display:false},
});
}
_toDsList =()=>{
// this is Ds&map info scroll pageOne btn press ,it means to show dsListView.
this.setState({
title:{display:true,text:'数据源',backBtnDisplay:true,clickBtn:this._toWsInfoPage},
scrollPage:{display:false},
wsSaveAsPage:{display:false},
dmInfoPage:{display:false},
dsCreatePage:{display:false},
dsListPage:{display:true},
mapListPage:{display:false},
});
}
_toMapList =()=>{
this.setState({
title:{display:true,text:'地图',backBtnDisplay:true,clickBtn:this._toWsInfoPage},
scrollPage:{display:false},
wsSaveAsPage:{display:false},
dmInfoPage:{display:false},
dsCreatePage:{display:false},
dsListPage:{display:false},
mapListPage:{display:true},
});
}
_toMainPage = ()=>{
var scrollText;
var open = this.state.coreData.workspaceOpen;
if(open){
scrollText = this.state.coreData.fileName;
}else{
scrollText = '未命名工作空间';
}
this.setState({
title:{display:true,text:'工作空间管理',backBtnDisplay:true,clickBtn:this._quit},
scrollPage:{display:true,text:scrollText},
wsSaveAsPage:{display:false},
dmInfoPage:{display:false},
dsCreatePage:{display:false},
dsListPage:{display:false},
mapListPage:{display:false},
});
}
//WorkspaceSaveAsPage 回调函数,可以用于返回另存workspace的id(目前未实现)
_workSpaceIdCallback = (isSaveAs)=>{
this._toMainPage;
}
//外部回调方法,提供给外部通知点击了退出按钮
_quit = ()=>{
//this.props.quitCallback('quit');
}
render() {
return (
<View style={styles.container}>
{this.state.title.display && <TitlePage text={this.state.title.text} backBtnDisplay={this.state.title.backBtnDisplay} clickBtn={this.state.title.clickBtn}/>}
{this.state.scrollPage.display && <ScrollPage clickPageOneBtn={this._toWsInfoPage}
clickPageTwoBtnOne={this._wsSaveBtnPress} clickPageTwoBtnTwo={this._toSaveAsPage}
clickPageTwoBtnThree={this._wsCloseBtnPress} pageOneText={this.state.scrollPage.text}/>}
{this.state.wsSaveAsPage.display && <WorkspaceSaveAsPage workspace={this.state.coreData.workspace} filePath={this.state.coreData.filePath} fileName={this.state.coreData.fileName} clickBtnTwo={this._toMainPage} callBack={this._workSpaceIdCallback}/>}
{this.state.dmInfoPage.display && <DsMapInfo clickPageOneBtn={this._toDsList} clickPageTwoBtnOne={this._toDsCreatePage} clickMapInfoBtn={this._toMapList}/>}
{this.state.dsCreatePage.display && <DsCreatePage/>}
{this.state.dsListPage.display && <DsListComponent workspace={this.state.coreData.workspace}/>}
{this.state.mapListPage.display && <MapListComponent workspace={this.state.coreData.workspace}/>}
</View>
);
}
}
const styles = StyleSheet.create({
container: {
display:'flex',
flexDirection:'column',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});
AppRegistry.registerComponent('reactNativeLearnProject', () => reactNativeLearnProject);