forked from cemaden-educacao/WPD-MobileApp
GabrielTrettel
4 years ago
4 changed files with 173 additions and 2 deletions
-
3src/app/components/forms/FormDatePicker.js
-
151src/app/screens/PluviometerDiaryScreen.js
-
20src/package-lock.json
-
1src/package.json
@ -0,0 +1,151 @@ |
|||
import React, { useState, useContext, useEffect } from "react"; |
|||
import { StyleSheet, Text, View } from "react-native"; |
|||
|
|||
import Screen from "../components/Screen"; |
|||
import { dimensions, scaleDimsFromWidth } from "../config/dimensions"; |
|||
import colors from "../config/colors/"; |
|||
|
|||
import { FontAwesome5 } from '@expo/vector-icons'; |
|||
import { MaterialIcons } from "@expo/vector-icons"; |
|||
|
|||
const dims = scaleDimsFromWidth(85, 85, 25); |
|||
|
|||
function PluviometerDiaryScreen(props) { |
|||
//Substituir por dados vindos da API
|
|||
const school = "Escola registrada do pluviômetro"; |
|||
const profile = "Tipo de perfil do usuário"; |
|||
const local = "Endereço registrado do pluviômetro" |
|||
return ( |
|||
<Screen style={styles.container}> |
|||
<View style={{ flex: 1 }}> |
|||
<Text style={{ textAlign: "center" }}> |
|||
Gráfico do pluviometro |
|||
</Text> |
|||
|
|||
</View> |
|||
<View |
|||
style={{ |
|||
flex: 1, |
|||
flexDirection: "column", |
|||
alignContent: "flex-start", |
|||
justifyContent: "space-between", |
|||
}}> |
|||
{/* Endereço */} |
|||
< View style={{ flex: 1 }}> |
|||
<View style={styles.location}> |
|||
<View style={styles.mapIcon}> |
|||
<MaterialIcons |
|||
name="location-on" |
|||
size={28} |
|||
color="white" |
|||
alignItems="center" |
|||
alignContent="center" |
|||
/> |
|||
</View> |
|||
<View style={styles.adressText}> |
|||
<Text style={{ |
|||
fontSize: dimensions.text.default, |
|||
}}> |
|||
{local} |
|||
</Text> |
|||
</View> |
|||
</View> |
|||
</View> |
|||
|
|||
{/* Escola */} |
|||
<View style={{ flex: 1 }}> |
|||
<View style={styles.location}> |
|||
<View style={styles.mapIcon}> |
|||
<FontAwesome5 |
|||
name="university" |
|||
size={28} |
|||
color="white" |
|||
alignItems="center" |
|||
alignContent="center" |
|||
/> |
|||
</View> |
|||
<View style={styles.adressText}> |
|||
<Text style={{ |
|||
fontSize: dimensions.text.default, |
|||
}}> |
|||
{ school } |
|||
</Text> |
|||
</View> |
|||
</View> |
|||
</View> |
|||
|
|||
{/* Usuário */} |
|||
<View style={{ flex: 1 }}> |
|||
<View style={styles.location}> |
|||
<View style={styles.mapIcon}> |
|||
<FontAwesome5 |
|||
name="user-alt" |
|||
size={28} |
|||
color="white" |
|||
alignItems="center" |
|||
alignContent="center" |
|||
/> |
|||
</View> |
|||
<View style={styles.adressText}> |
|||
<Text style={{ |
|||
fontSize: dimensions.text.default, |
|||
}}> |
|||
{ profile } |
|||
</Text> |
|||
</View> |
|||
</View> |
|||
</View> |
|||
</View> |
|||
</Screen > |
|||
); |
|||
} |
|||
|
|||
const styles = StyleSheet.create({ |
|||
container: { |
|||
padding: 10, |
|||
flex: 1, |
|||
}, |
|||
image: { |
|||
width: dims.width * 0.8, |
|||
height: dims.height * 0.8, |
|||
justifyContent: "center", |
|||
alignItems: "center", |
|||
}, |
|||
label: { |
|||
fontSize: dimensions.text.secondary, |
|||
fontWeight: "bold", |
|||
textAlign: "left", |
|||
color: colors.lightBlue, |
|||
}, |
|||
title: { |
|||
fontSize: 20, |
|||
fontWeight: "bold", |
|||
textAlign: "center", |
|||
color: colors.primary, |
|||
}, |
|||
location: { |
|||
width: "100%", |
|||
flexDirection: "row", |
|||
alignItems: "flex-start", |
|||
justifyContent: "space-between", |
|||
}, |
|||
adressText: { |
|||
flex: 0.90, |
|||
height: "100%", |
|||
flexDirection: "column", |
|||
justifyContent: "center", |
|||
paddingLeft: 5, |
|||
}, |
|||
mapIcon: { |
|||
backgroundColor: colors.primary, |
|||
padding: 8, |
|||
width: 20, |
|||
alignItems: "center", |
|||
borderRadius: 5, |
|||
flex: 0.10, |
|||
marginTop: 8, |
|||
}, |
|||
|
|||
}); |
|||
|
|||
export default PluviometerDiaryScreen; |
Write
Preview
Loading…
Cancel
Save
Reference in new issue