71 lines
2.0 KiB
JavaScript
71 lines
2.0 KiB
JavaScript
|
import React from 'react';
|
||
|
|
import { LinearGradient } from 'expo-linear-gradient';
|
||
|
|
import { NavigationContainer } from '@react-navigation/native';
|
||
|
|
import { createStackNavigator } from '@react-navigation/stack';
|
||
|
|
import { BlurView } from 'expo-blur';
|
||
|
|
import { StyleSheet } from 'react-native';
|
||
|
|
import backgroundColors from './Themes';
|
||
|
|
|
||
|
|
// Own views
|
||
|
|
import LiveTrainingView from './LiveTrainingView';
|
||
|
|
import HomeView from './HomeView';
|
||
|
|
import { connect } from 'react-redux';
|
||
|
|
|
||
|
|
|
||
|
|
const Stack = createStackNavigator();
|
||
|
|
|
||
|
|
|
||
|
|
function ThemedStackNavigation(props) {
|
||
|
|
|
||
|
|
const screenOptions = {
|
||
|
|
cardStyle: {
|
||
|
|
backgroundColor: "transparent",
|
||
|
|
opacity: 1
|
||
|
|
},
|
||
|
|
headerTransparent: "true",
|
||
|
|
headerTitleStyle: {
|
||
|
|
color: 'white',
|
||
|
|
fontWeight: 'bold',
|
||
|
|
fontSize: "1.5em",
|
||
|
|
},
|
||
|
|
headerTintColor: "white",
|
||
|
|
headerBackground: () => (
|
||
|
|
<BlurView
|
||
|
|
tint="dark"
|
||
|
|
intensity={30}
|
||
|
|
style={StyleSheet.absoluteFill}
|
||
|
|
/>
|
||
|
|
),
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<LinearGradient
|
||
|
|
colors={backgroundColors[props.themeName]}
|
||
|
|
start={[0, 0]}
|
||
|
|
end={[0.5, 1]}
|
||
|
|
style={{ flex: 1 }}
|
||
|
|
>
|
||
|
|
<NavigationContainer>
|
||
|
|
<Stack.Navigator initialRouteName="Home">
|
||
|
|
<Stack.Screen
|
||
|
|
name="Home"
|
||
|
|
component={HomeView}
|
||
|
|
options={{ ...screenOptions, headerTitle: "SwimTracker" }}
|
||
|
|
/>
|
||
|
|
<Stack.Screen
|
||
|
|
name="Training"
|
||
|
|
component={LiveTrainingView}
|
||
|
|
options={{ ...screenOptions, headerTitle: "Training" }}
|
||
|
|
/>
|
||
|
|
</Stack.Navigator>
|
||
|
|
</NavigationContainer>
|
||
|
|
</LinearGradient>
|
||
|
|
)
|
||
|
|
};
|
||
|
|
|
||
|
|
const mapStateToProps = (state) => {
|
||
|
|
return { themeName: state.settings.theme };
|
||
|
|
};
|
||
|
|
|
||
|
|
export default connect(mapStateToProps)(ThemedStackNavigation);
|