Skip to content
Snippets Groups Projects
Commit 62b01cb6 authored by Andrea Magnussen's avatar Andrea Magnussen
Browse files

Added message to process image activity indicator

parent 7b743117
No related branches found
No related tags found
1 merge request!57Resolve "Add message option on the activity indicatior"
import React from 'react' import React from 'react'
import { StyleSheet, View, Modal } from 'react-native' import { StyleSheet, View, Modal, Text } from 'react-native'
import { Colors, ActivityIndicator } from "react-native-paper"; import { Colors, ActivityIndicator } from "react-native-paper";
const CustomActivityIndicator = (props) => { const CustomActivityIndicator = (props) => {
...@@ -13,6 +13,9 @@ const CustomActivityIndicator = (props) => { ...@@ -13,6 +13,9 @@ const CustomActivityIndicator = (props) => {
color={Colors.white} color={Colors.white}
size='large' size='large'
/> />
<Text style={styles.text}>
{props.text}
</Text>
</View> </View>
</Modal> </Modal>
) )
...@@ -35,5 +38,10 @@ const styles = StyleSheet.create({ ...@@ -35,5 +38,10 @@ const styles = StyleSheet.create({
alignItems: "center", alignItems: "center",
justifyContent: "center", justifyContent: "center",
backgroundColor: `rgba(0,0,0,${0.1})` backgroundColor: `rgba(0,0,0,${0.1})`
},
text: {
alignContent: "center",
marginTop: 100,
color: 'white'
} }
}) })
...@@ -101,6 +101,7 @@ const _CameraScreen = (props) => { ...@@ -101,6 +101,7 @@ const _CameraScreen = (props) => {
<View style={styles.takeImage}> <View style={styles.takeImage}>
<CustomActivityIndicator <CustomActivityIndicator
style={styles.activityIndicator} style={styles.activityIndicator}
text="Processing image. Please wait."
visible={showIndicator} visible={showIndicator}
/> />
<CustomImagePicker setImageUri={(uri) => setImage(uri)} /> <CustomImagePicker setImageUri={(uri) => setImage(uri)} />
...@@ -154,7 +155,7 @@ const _CameraScreen = (props) => { ...@@ -154,7 +155,7 @@ const _CameraScreen = (props) => {
)} )}
{image && ( {image && (
<CustomButton <CustomButton
title="Start Image Processing" title="Start Processing"
mode="contained" mode="contained"
style={styles.button} style={styles.button}
onPress={() => { onPress={() => {
...@@ -184,13 +185,7 @@ const styles = StyleSheet.create({ ...@@ -184,13 +185,7 @@ const styles = StyleSheet.create({
paddingTop: 25, paddingTop: 25,
}, },
button: { button: {
width: 150, width: 200,
marginTop: 50,
marginBottom: 20,
alignSelf: "center",
},
button: {
width: 250,
marginTop: 50, marginTop: 50,
marginBottom: 20, marginBottom: 20,
alignSelf: "center", alignSelf: "center",
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment