Please provide the following:
- SDK Version: 35
- Platforms(Android/iOS/web/all): Android Standalone Apps
Start application with portrait
then change to landscape
app.json
{
"name": "Smart QC",
"displayName": "FEA QC",
"expo": {
"name": "FEA QC",
"description": "FEA-Smart QC",
"slug": "FEAQC",
"privacy": "unlisted",
"sdkVersion": "35.0.0",
"platforms": [
"ios",
"android"
],
"version": "5.0.3",
"orientation": "default",
"primaryColor": "#000000",
"icon": "./assets/images/icon_ios.PNG",
"splash": {
"image": "./assets/images/splash_its.PNG",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"notification": {
"icon": "./assets/images/icon_notification.PNG"
},
"updates": {
"fallbackToCacheTimeout": 0
},
"assetBundlePatterns": [
"**/*"
],
"ios": {
"bundleIdentifier": "com.feavn.feaqc",
"buildNumber": "1.0.0",
"supportsTablet": true
},
"android": {
"package": "com.feavn.feaqc",
"versionCode": 1,
"icon": "./assets/images/icon_android.PNG",
"googleServicesFile": "./google-services.json"
}
}
}
Code example
import React from 'react';
import { Image, View, ImageBackground, Text, StyleSheet, TouchableOpacity ,Dimensions } from 'react-native';
import { NavigationStackScreenProps } from 'react-navigation-stack';
import { Container } from '@core/components';
import { shadow, Hd } from '@core/components/style';
import { connect } from 'react-redux';
import { UserObj } from '@core/store/reducers';
type DepartmentProps = NavigationStackScreenProps & {
langs: any;
internal: string;
user: UserObj;
};
class Department extends React.PureComponent<DepartmentProps> {
static navigationOptions = {
header: null,
gesturesEnabled: true,
};
componentDidMount() {
if (this.props.user.UserGroupName === 'QC MQPBoned') {
this.props.navigation.navigate('ListMQP', { route: 'Bonded' });
}
}
go = (route: string) => {
this.props.navigation.navigate('ListMQP', { route });
};
render() {
return (
<Container>
<View style={{ flexDirection: 'row', flex: 1 }}>
<TouchableOpacity style={{ flex: 1 }} onPress={() => this.go('Bonded')}>
<View
style={{
padding: 6,
flex: 1,
margin: 4,
backgroundColor: '#fff',
...shadow({ elevation: 6 }),
borderRadius: 8,
}}>
<ImageBackground
style={{ flex: 1, borderRadius: 8 }}
resizeMode="stretch"
source={require('@assets/images/mqp/bonded.jpg')}>
<View
style={[
StyleSheet.absoluteFill,
{ backgroundColor: 'rgba(0,0,0,0.7)', justifyContent: 'center', alignItems: 'center' },
]}>
<Text style={{ fontSize: Hd(8), color: '#fff', textAlign: 'center' }}>
{(this.props.langs['boned'] as string).toUpperCase()}
</Text>
</View>
</ImageBackground>
</View>
</TouchableOpacity>
<TouchableOpacity style={{ flex: 1 }} onPress={() => this.go('ColorCheck')}>
<View
style={{
padding: 6,
flex: 1,
margin: 4,
backgroundColor: '#fff',
...shadow({ elevation: 6 }),
borderRadius: 8,
}}>
<ImageBackground
style={{ flex: 1, borderRadius: 8 }}
resizeMode="stretch"
source={require('@assets/images/mqp/color.jpg')}>
<View
style={[
StyleSheet.absoluteFill,
{ backgroundColor: 'rgba(0,0,0,0.7)', justifyContent: 'center', alignItems: 'center' },
]}>
<Text style={{ fontSize: Hd(8), color: '#fff' }}>
{(this.props.langs['colorcheck'] as string).toUpperCase()}
</Text>
</View>
</ImageBackground>
</View>
</TouchableOpacity>
</View>
<TouchableOpacity style={{ flex: 1 }} onPress={() => this.go('Labs')}>
<View
style={{
padding: 6,
flex: 1,
margin: 4,
backgroundColor: '#fff',
...shadow({ elevation: 6 }),
borderRadius: 8,
}}>
<ImageBackground
style={{ flex: 1, borderRadius: 8 }}
resizeMode="stretch"
source={require('@assets/images/mqp/labs.png')}>
<View
style={[
StyleSheet.absoluteFill,
{ backgroundColor: 'rgba(0,0,0,0.7)', justifyContent: 'center', alignItems: 'center' },
]}>
<Text style={{ fontSize: Hd(8), color: '#fff' }}>
{(this.props.langs['labs'] as string).toUpperCase()}
</Text>
</View>
</ImageBackground>
</View>
</TouchableOpacity>
</Container>
);
}
}