martin
/
swimtracker-app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Frontend stuff

This commit is contained in:
Martin Bauer 2020-05-16 12:36:05 +02:00
parent 648d26f69f
commit 2e0baca485
4 changed files with 766 additions and 923 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
App.js
View File

@ -6,7 +6,8 @@ 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';
/*import Graph from './components/Graph';*/
import DeviceHttpDataSource from './components/DeviceHttpDataSource';
export default class App extends React.Component {
@ -36,8 +37,13 @@ export default class App extends React.Component {
return <AppLoading />;
}
const handleNewData = data => {
console.log("new data callback", data);
};
return (
<Container>
<DeviceHttpDataSource deviceUrl="http://smartswim" onNewData={handleNewData}></DeviceHttpDataSource>
<LinearGradient
colors={backgroundColors[themeArray[this.state.themeNumber]]}
start={[0, 0]}
@ -63,9 +69,9 @@ export default class App extends React.Component {
<Content padder contentContainerStyle={{justifyContent: 'space-around', flex: 1}}>
<IconCard label="ZÜGE" value="1234" iconName="dashboard" iconType="AntDesign" />
<IconCard label="BAHNEN" value="42" iconName="retweet" iconType="AntDesign" />
{/*<IconCard label="KRAFT" value="120" iconName="ruler" iconType="Entypo" />
<IconCard label="ZEIT" value="20:12" iconName="clock" iconType="Feather" fontSize={55} /> */}
<Graph></Graph>
<IconCard label="KRAFT" value="120" iconName="ruler" iconType="Entypo" />
<IconCard label="ZEIT" value="20:12" iconName="clock" iconType="Feather" fontSize={55} />
{/*<Graph></Graph> */}
</Content>
</LinearGradient>

20
components/IconCard.js
View File

@ -1,24 +1,24 @@
import React from 'react';
import {View, StyleSheet, Text} from 'react-native';
import {Icon} from "native-base";
import { View, StyleSheet, Text } from 'react-native';
import { Icon } from "native-base";
const IconCard = props => {
return (
<View style={styles.card}>
<View style={{alignItems: 'center', justifyContent: 'center', paddingLeft: 20}}>
<Icon style={{color: 'white', fontSize: 40}} name={props.iconName} type={props.iconType}/>
<Text style={{color: 'white', marginTop: 5}}> {props.label}</Text>
<View style={{ alignItems: 'center', justifyContent: 'center', paddingLeft: 20 }}>
<Icon style={{ color: 'white', fontSize: 40 }} name={props.iconName} type={props.iconType} />
<Text style={{ color: 'white', marginTop: 5 }}> {props.label}</Text>
</View>
<View style={{paddingRight: 20}}>
<Text style={{color: 'white', fontSize: props.fontSize}}> {props.value}</Text>
<View style={{ paddingRight: 20 }}>
<Text style={{ color: 'white', fontSize: props.fontSize }}> {props.value}</Text>
</View>
</View>
);
};
const styles = StyleSheet.create({
card : {
card: {
flexDirection: 'row',
backgroundColor: 'rgba(0, 0, 0, 0.2)',
margin: 5,
@ -28,8 +28,8 @@ const styles = StyleSheet.create({
}
});
IconCard.defaultProps = {
fontSize: 85
IconCard.defaultProps = {
fontSize: 85
};
export default IconCard;

1645
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

10
package.json
View File

@ -10,12 +10,14 @@
"dependencies": {
"expo": "^34.0.1",
"expo-linear-gradient": "^6.0.0",
"native-base": "^2.13.8",
"msgpack5": "^4.2.1",
"native-base": "2.13.8",
"prop-types": "^15.7.2",
"react": "16.8.3",
"react-dom": "^16.8.6",
"react-dom": "^16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-34.0.0.tar.gz",
"react-native-chart-kit": "^3.3.1",
"react-native-svg": "^9.9.3",
"react-native-chart-kit": "^3.13.0",
"react-native-svg": "^9.13.6",
"react-native-unimodules": "^0.5.4",
"react-native-web": "^0.11.4"
},