From 648d26f69fc0981843d56a484d25ef254c8ee239 Mon Sep 17 00:00:00 2001 From: Martin Bauer Date: Tue, 17 Sep 2019 20:24:01 +0200 Subject: [PATCH] App --- .gitignore | 11 + .watchmanconfig | 1 + App.js | 109 + App_old.js | 135 + app.json | 30 + assets/icon.png | Bin 0 -> 1091 bytes assets/splash.png | Bin 0 -> 7178 bytes babel.config.js | 6 + components/Graph.js | 37 + components/IconCard.js | 35 + components/PropValueCard.js | 39 + icons.txt | 7 + package-lock.json | 7258 +++++++++++++++++++++++++++++++++++ package.json | 26 + 14 files changed, 7694 insertions(+) create mode 100644 .gitignore create mode 100644 .watchmanconfig create mode 100644 App.js create mode 100644 App_old.js create mode 100644 app.json create mode 100644 assets/icon.png create mode 100644 assets/splash.png create mode 100644 babel.config.js create mode 100644 components/Graph.js create mode 100644 components/IconCard.js create mode 100644 components/PropValueCard.js create mode 100644 icons.txt create mode 100644 package-lock.json create mode 100644 package.json diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..4820714 --- /dev/null +++ b/.gitignore @@ -0,0 +1,11 @@ +node_modules/**/* +.expo/* +npm-debug.* +*.jks +*.p8 +*.p12 +*.key +*.mobileprovision +*.orig.* +web-build/ +web-report/ diff --git a/.watchmanconfig b/.watchmanconfig new file mode 100644 index 0000000..0967ef4 --- /dev/null +++ b/.watchmanconfig @@ -0,0 +1 @@ +{} diff --git a/App.js b/App.js new file mode 100644 index 0000000..4750f9c --- /dev/null +++ b/App.js @@ -0,0 +1,109 @@ +import React from 'react'; +import {View, StyleSheet} from 'react-native'; +import { AppLoading } from 'expo'; +import { Container, Text, Header, Content, Left, Body, Right, Button, Icon, Title, Card, CardItem } from 'native-base'; +import * as Font from 'expo-font'; +import { Ionicons } from '@expo/vector-icons'; +import { LinearGradient } from 'expo-linear-gradient'; +import IconCard from './components/IconCard'; +import Graph from './components/Graph'; + + +export default class App extends React.Component { + constructor(props) { + super(props); + this.state = { + isReady: false, + themeNumber: 0, + }; + } + + async componentDidMount() { + await Font.loadAsync({ + Roboto: require('native-base/Fonts/Roboto.ttf'), + Roboto_medium: require('native-base/Fonts/Roboto_medium.ttf'), + ...Ionicons.font, + }); + this.setState({ isReady: true }); + } + + handleThemeChange = () => { + this.setState( (state, props) => {return {themeNumber: ((state.themeNumber + 1) % themeArray.length) }}) + }; + + render() { + if (!this.state.isReady) { + return ; + } + + return ( + + +
+ + TRAINING LÄUFT + + + + + + + +
+ + + + + {/* + */} + + + + + + + + ); + } +} + +const backgroundColors = { + 'hot': ['#830e5f', '#fd5139'], + 'darkBlue': ['#4265a3', '#cfada7'], + 'lightBlue': ['#50a4db', '#74bbe2'], + 'foggy': ['#bc8db8', '#5d5e90'], +}; + +const themeArray = [ + 'hot', 'darkBlue', 'lightBlue', 'foggy' +]; + +const styles = StyleSheet.create({ + card: { + flexDirection: 'row', + backgroundColor: 'rgba(0, 0, 0, 0.2)', + margin: 5, + padding: 5, + borderRadius: 3, + justifyContent: 'space-between', + /* + shadowColor: "#000", + shadowOffset: { + width: 0, + height: 1, + }, + shadowOpacity: 0.18, + shadowRadius: 1.00, + + elevation: 1,*/ + } +}); diff --git a/App_old.js b/App_old.js new file mode 100644 index 0000000..7581b51 --- /dev/null +++ b/App_old.js @@ -0,0 +1,135 @@ +import React, {useState} from 'react'; +import {StyleSheet, Text, View, Button, TextInput, Dimensions, StatusBar} from 'react-native'; +import { LineChart} from 'react-native-chart-kit'; +import { LinearGradient } from 'expo-linear-gradient'; +import PropValueCard from './components/PropValueCard' + + +export default function App() { + const [outputText, setOutputText] = useState('This is the first text'); + + const [flag, setFlag] = useState(false); + + const initialState = []; + for(let i=0; i < 100; ++i) { + initialState.push( Math.random() * 100); + } + + const [graphData, setGraphData] = useState(initialState); + + const makeNewGraphData = () => { + setGraphData( oldGraphData => { + console.log("Before", oldGraphData) + oldGraphData.pop(); + oldGraphData.unshift(Math.random() * 100); + console.log("After", oldGraphData); + return oldGraphData.slice(); + }) + }; + const makeNewGraphData2 = () => { + graphData.pop(); + graphData.unshift(Math.random() * 100); + setGraphData(graphData); + }; + + let tutorial = ( + + + +