Browse Source

Enabling to close loading modal

master
GabrielTrettel 3 years ago
parent
commit
c8c7efd0e8
  1. 24
      src/app/components/LoadingMarkersModal.js

24
src/app/components/LoadingMarkersModal.js

@ -1,10 +1,11 @@
import React from "react";
import React, { useState } from "react";
import {
Modal,
StyleSheet,
Text,
TouchableHighlight,
View,
TouchableOpacity,
} from "react-native";
import { MaterialCommunityIcons } from "@expo/vector-icons";
@ -12,10 +13,27 @@ import colors from "../config/colors";
import { dimensions, screen_height } from "../config/dimensions";
export default function LoadingMarkersModal({ show }) {
if (show) {
const [closed, setClosed] = useState(false);
if (show && !closed) {
return (
// NOTE:
// 267 = (tabBar height = 49) + (data menu btn height = 48) + (this modal = 170/2)
<View style={[styles.container, { bottom: (screen_height - 267) / 2 }]}>
<View
style={{
justifyContent: "flex-start",
alignSelf: "flex-end",
}}
>
<TouchableOpacity onPress={() => setClosed(true)}>
<MaterialCommunityIcons
name="close"
size={20}
color={colors.primary}
alignItems="center"
/>
</TouchableOpacity>
</View>
<MaterialCommunityIcons
name="sync"
size={48}
@ -37,7 +55,7 @@ const styles = StyleSheet.create({
position: "absolute",
width: "80%",
height: 170,
justifyContent: "center",
// justifyContent: "center",
alignSelf: "center",
backgroundColor: colors.lightestGray,
borderColor: colors.primary,

Loading…
Cancel
Save