Skip to content

Commit

Permalink
Merge pull request #6 from Tharuka-Nimesha/master
Browse files Browse the repository at this point in the history 
QR Code Functionality
  • Loading branch information
@dilinade
dilinade authored Aug 20, 2020
2 parents b2f174c + 4fc662c commit d428c3f
Show file tree
Hide file tree
Showing 8 changed files with 404 additions and 119 deletions.
2 changes: 1 addition & 1 deletion Mobile/android/build.gradle
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,6 @@ buildscript {

allprojects {
repositories {
google()
mavenLocal()
maven {
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
Expand All @@ -32,6 +31,7 @@ allprojects {
url("$rootDir/../node_modules/jsc-android/dist")
}

google()
jcenter()
maven { url 'https://www.jitpack.io' }
}
Expand Down
283 changes: 179 additions & 104 deletions Mobile/package-lock.json
View file

Large diffs are not rendered by default.

1 change: 0 additions & 1 deletion Mobile/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@
"lint": "eslint ."
},
"dependencies": {
"@react-native-community/cli-platform-android": "^4.10.1",
"@react-native-community/masked-view": "^0.1.10",
"@react-navigation/bottom-tabs": "^5.3.3",
"@react-navigation/material-top-tabs": "^5.1.14",
Expand Down
2 changes: 1 addition & 1 deletion Mobile/src/navigation/mainTab_navigation.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ export default function MainTab_navigation() {
inactiveTintColor: 'gray',
}}
>
<Tab.Screen name="Scan" component={ScanStack_navigation} />
<Tab.Screen name="Scan" component={ScanStack_navigation} />
<Tab.Screen name="Products" component={ProductStack_navigation} />
<Tab.Screen name="History" component={Maintab_history_screen} />
</Tab.Navigator>
Expand Down
2 changes: 1 addition & 1 deletion Mobile/src/navigation/productTab_navigation.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import Product_website_screen from '../screens/product_website_screen';

const Tab = createMaterialTopTabNavigator();

export default function ProductTab_navigation() {
export default function ProductTab_navigation() {
return (
<Tab.Navigator
tabBarOptions={{
Expand Down
8 changes: 3 additions & 5 deletions Mobile/src/screens/maintab_scan_screen.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,11 @@ import { StyleSheet, View, Text, Button, Linking, TouchableOpacity } from 'react

import QRCodeScanner from 'react-native-qrcode-scanner';
import { widthPercentageToDP as wp, heightPercentageToDP as hp } from 'react-native-responsive-screen';
import AntDesign from 'react-native-vector-icons/Ionicons';

export default function MainTab_scan_screen({ navigation }) {
onSuccess = e => {
Linking.openURL(e.data).catch(err =>
console.error('An error occured', err)
);
console.log(e.data)
navigation.navigate('product', {scanData:e})
};

return (
Expand All @@ -26,7 +24,7 @@ export default function MainTab_scan_screen({ navigation }) {
cameraStyle={{ marginTop: -hp(8), }}
bottomContent={
<>
<Text>Sca a QR code to recieve details</Text>
<Text>Scan a QR code to recieve details</Text>
<Text></Text>
<Text>To view a list of supported brands, go to Prodcuts</Text>
</>
Expand Down
219 changes: 216 additions & 3 deletions Mobile/src/screens/product_info_screen.js
View file
Original file line number Diff line number Diff line change
@@ -1,18 +1,231 @@
/* eslint-disable prettier/prettier */

import React from 'react';
import { StyleSheet, View, Text, Image } from 'react-native';
import { StyleSheet, View, Text, Image, ScrollView } from 'react-native';
import { widthPercentageToDP as wp } from 'react-native-responsive-screen';

export default function Product_info_screen() {
export default function Product_info_screen() {
const accreditations = [
{
id: 1,
url: 'https://5.imimg.com/data5/JK/BR/RG/SELLER-1781089/iso-22000-2018-certification-service-500x500.jpeg',
title:'ISO 22000:2018'
},
{
id: 2,
url: 'https://5.imimg.com/data5/FK/OI/MY-25087216/iso-9001-2015-certification-500x500.jpg',
title:'ISO 9001:2015'
},
{
id: 3,
url: 'https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcS5UxOhb40cUDwBSk9f-B8xo1yi8PZwJdj9gQ&usqp=CAU',
title:'HACCP'
},
];

var items = []

accreditations.map(element => {
items.push(
<View style={styles.imageColumn}>
<View style={styles.imageContainer}>
<Image
source={{ uri: element.url }}
resizeMode='contain'
style={styles.image}
/>
</View>
<Text>{element.title}</Text>
</View>
)
});

return (
<View style={styles.container}>
<Text>Product Info Screen</Text>
<ScrollView>
<View style={styles.topImageContainer}>
<Image
source={{ uri: 'https://www.lavazza.it/content/dam/lavazza/products/caffe/intl/com/Lavazza_Grani_thumb.png' }}
resizeMode='contain'
style={styles.image}
/>
</View>
<View style={styles.titleContainer}>
<Text style={styles.titleBig}>Lavazza Dark Coffee</Text>
</View>

<View style={styles.infoCirclesContainer}>
<View style={styles.col}>
<Text style={styles.titleBigWhite}>2</Text>
<Text style={{color:'white'}}>Calories</Text>
</View>
<View style={styles.col}>
<Text style={styles.titleBigWhite}>0g</Text>
<Text style={{color:'white'}}>Sugar</Text>
</View>
<View style={styles.col}>
<Text style={styles.titleBigWhite}>0g</Text>
<Text style={{color:'white'}}>Fat</Text>
</View>
<View style={styles.col}>
<Text style={styles.titleBigWhite}>0g</Text>
<Text style={{color:'white'}}>Carb.</Text>
</View>
</View>

<View style={styles.servingInfoContainer}>
<View style={styles.row}>
<View style={styles.colLeft}>
<Text style={styles.title}>Serving Size</Text>
</View>
<View style={styles.colRight}>
<Text style={styles.title}>20 g</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.colLeft}>
<Text style={styles.title}>Serving per Container</Text>
</View>
<View style={styles.colRight}>
<Text style={styles.title}>12.5</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.colLeft}>
<Text style={styles.title}>Total Calories</Text>
</View>
<View style={styles.colRight}>
<Text style={styles.title}>2</Text>
</View>
</View>
</View>

<View style={styles.accreditationsContainer}>
<View style={styles.header}>
<Text style={styles.title}>Accreditations</Text>
</View>
<View style={styles.bottomContainer}>
<View style={styles.imagesRow}>
{items}
</View>
</View>
</View>
</ScrollView>
</View>
);
}

const styles = StyleSheet.create({
col: {
alignItems: 'center',
justifyContent: 'center',
height: wp(18.5),
width:wp(18.5),
borderWidth:1,
borderRadius:50,
marginHorizontal:wp(2),
borderColor:'gray',
backgroundColor:'#6b2b3d'
},
row: {
paddingHorizontal: wp(5),
paddingVertical:wp(1),
flexDirection:'row',
flex:1,
},
colLeft: {
flex:9,
},
colRight: {
flex:1,
},
imagesRow: {
width: '100%',
flexDirection: 'row',
flexWrap: 'wrap',
justifyContent: 'flex-start',
},
bottomContainer: {
paddingHorizontal: wp(5),
},
header: {
alignItems: 'center',
justifyContent: 'center',
height: wp(8),
marginTop:wp(5)
},
title: {
fontSize: 16,
},
titleBig: {
fontSize: 20,
},
titleBigWhite: {
fontSize: 20,
color:'white'
},
image: {
height: '100%',
width: '100%',
},
imageColumn: {
width: '50%',
alignItems: 'center',
justifyContent: 'center',
marginTop:wp(5)
},
imageContainer: {
marginBottom:wp(2),
backgroundColor: 'white',
height: wp(41),
width: wp(41),
padding: wp(3),
alignItems: 'center',
justifyContent: 'center',
elevation: 2,
},
accreditationsContainer:{
height:'auto',
width:wp(100),
justifyContent:'center',
paddingBottom:wp(5)
},
servingInfoContainer:{
height:'auto',
width:wp(100),
alignItems:'center',
justifyContent:'center',
borderColor:'gray',
borderBottomWidth:.8,
paddingVertical:wp(6),
backgroundColor: 'rgba(255, 218, 194, .5)'
},
infoCirclesContainer:{
height:wp(30),
flex:1,
flexDirection:'row',
alignItems:'center',
justifyContent:'center',
borderColor:'gray',
borderBottomWidth:.8,
paddingHorizontal:wp(5)
},
titleContainer:{
height:wp(20),
width:wp(100),
alignItems:'center',
justifyContent:'center',
borderColor:'gray',
borderBottomWidth:.8,
backgroundColor: 'rgba(255, 218, 194, .5)'
},
topImageContainer:{
height:wp(80),
width:wp(100),
alignItems:'center',
justifyContent:'center', borderColor:'gray',
borderBottomWidth:.8,
},
container: {
flex: 1,
justifyContent: 'center',
Expand Down
6 changes: 3 additions & 3 deletions Mobile/yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -989,9 +989,9 @@
chalk "^3.0.0"

"@react-native-community/async-storage@^1.6.1":
version "1.11.0"
resolved "https://registry.yarnpkg.com/@react-native-community/async-storage/-/async-storage-1.11.0.tgz#bf81b8813080846f150c67f531987c429b442166"
integrity sha512-Pq9LlmvtCEKAGdkyrgTcRxNh2fnHFykEj2qnRYijOl1pDIl2MkD5IxaXu5eOL0wgOtAl4U//ff4z40Td6XR5rw==
version "1.12.0"
resolved "https://registry.yarnpkg.com/@react-native-community/async-storage/-/async-storage-1.12.0.tgz#d2fc65bc08aa1c3e9514bbe9fe7095eab8e8aca3"
integrity sha512-y3zVxuVyiOxI8TXrvajmYfDbIt2vFNxzV5MiA28v15DQTxDk6uJH3rpc9my+la7u2Tiwt3PpdU2+59ZgZ4h7wA==
dependencies:
deep-assign "^3.0.0"

Expand Down

0 comments on commit d428c3f

Please sign in to comment.