With add rows with xray

Systems/Environment.js

@@ -1,24 +1,48 @@
 import React from 'react';
 
-import { View, Text, StyleSheet } from 'react-native';
+import { Button , View, Text, StyleSheet } from 'react-native';
+import {Icon} from 'react-native-elements';
+import BaseSystem from './System';
+
+
+export default class Environment extends BaseSystem{
 
-export default class Environment {
 
 	constructor(CS, phoneRef) {
+    super()
 		this.phoneRef = phoneRef;
 		this.CoreSystem = CS;
 	}
 
+  addRow(){
+    let View = this.CoreSystem.getCurrentView();
+    let container = View.getDefaultContainer();
+    let rows = View.getRows(container);
+    View.setRows(container,rows.length + 1)
+    rows = View.getRows(container)
+    View.setColumns(rows[rows.length-1],1)
+    rows[rows.length-1].props.selected = true;
+    this.forceUpdate();  
+  }
+
+
 	render() {
 		let CurrentView = this.CoreSystem.getCurrentView();
 		let defaultContainer = CurrentView.getDefaultContainer();
 		let Rows = CurrentView.getRows(defaultContainer);
 		return <View style={styles.container}>
-          	<View style={styles.row}>
-	          		<Text>Row</Text>
-
+          	<View style={[styles.row,styles.button]}>
+	          		<Button 
+                color="#D2691E"
+                onPress = {() => this.addRow()}
+                title={
+                  <Icon  name='add'
+                    color="#606060"
+                    containerStyle={{height:10}}
+                  />}
+                />
           	</View>
-			<View style={styles.row}>
+			     <View style={styles.row}>
 	          	<View style={styles.col}>
 	          		<Text>Colasdasdasdasdasd</Text>
 	          		{Rows.map((row) => {
@@ -34,8 +58,16 @@ export default class Environment {
 	          		<Text>Col</Text>
 	          	</View>
 	        </View>
-          	<View style={styles.row}>
-	          		<Text>row</Text>
+          	<View style={[styles.row,styles.button]}>
+	          	<Button 
+              color="#D2691E"
+              onPress={() => this.addRow()}
+              title={
+                <Icon  name='add'
+                  color="#606060"
+                  containerStyle={{height:10}}
+                />}
+              />
 
           	</View>
 		</View>
@@ -66,5 +98,10 @@ const styles = StyleSheet.create({
   col: {
   	flexDirection: "column",
   	borderWidth: 1
+  },
+  button:{
+    flex:1,
+    justifyContent:'center',
+
   }
 });

Systems/Gui.js

@@ -29,7 +29,7 @@ export default class Gui {
     this.toolboxRef = React.createRef();
     this.toolbox = this.toolboxRef;
     this.Environment = new Environment(this.CoreSystem, this.phoneRef);
-  
+    this.Environment.onUpdate(() => this.forceUpdate())
     this.ToolBox = new ToolBox();
     this.MainBar = new MainBar();
  		this.load();

Systems/System.js

@@ -0,0 +1,19 @@
+
+
+import React from 'react';
+
+export default class BaseSystem{
+	constructor(){
+		this.__update = null;
+	}
+
+
+	onUpdate(fn){
+		this.__update = fn;
+		return this;
+	}
+
+	forceUpdate(){
+		return this.__update && this.__update();
+	}
+}

package-lock.json

@@ -7046,7 +7046,7 @@
       "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw=="
     },
     "trapilib": {
-      "version": "git+http://git.onarbooks.com/Klapi/TrapiLib.git#954cc8b2733299f6f471d6221e5ec71740dc2ed6",
+      "version": "git+http://git.onarbooks.com/Klapi/TrapiLib.git#b7a4fb4a6315c275d56278db28f6e2ec9bf6792f",
       "from": "git+http://git.onarbooks.com/Klapi/TrapiLib.git",
       "requires": {
         "expo": "^34.0.0-experiment.8",