Commit 48607868 authored by Pramodh Rajapakse's avatar Pramodh Rajapakse

bottom tab added

parent a7505b57
import React from "react";
import {
StyleSheet,
View,
Text,
TouchableOpacity,
} from "react-native";
import {
Ionicons,
MaterialIcons
} from "@expo/vector-icons";
import { useNavigation } from '@react-navigation/native';
import themeColors from "../assets/colors";
export function AuctionBottomTab() {
const navigation = useNavigation();
return(
<View style={styles.bottomBtn}>
<TouchableOpacity style={styles.barButtonView}
onPress={() => navigation.navigate("gamification")}
>
<Ionicons name="game-controller" size={24} color={themeColors.PRIMARY_COLOR} />
<Text style={styles.iconText}>Buy</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.barButtonView}
onPress={() => navigation.navigate("gamification")}
>
<Ionicons name="hardware-chip-sharp" size={24} color={themeColors.PRIMARY_COLOR} />
<Text style={styles.iconText}>Sell</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.barButtonView}
onPress={() => navigation.navigate("Leaderboard")}
>
<MaterialIcons name="leaderboard" size={24} color={themeColors.PRIMARY_COLOR} />
<Text style={styles.iconText}>Bids</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.barButtonView}
onPress={() => navigation.navigate("gamification")}
>
<Ionicons name="hardware-chip-sharp" size={24} color={themeColors.PRIMARY_COLOR} />
<Text style={styles.iconText}>Auctions</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.barButtonView}
onPress={() => navigation.navigate("AuctionHomeScreen")}
>
<Ionicons name="home" size={24} color={themeColors.PRIMARY_COLOR} />
<Text style={styles.iconText}>Home</Text>
</TouchableOpacity>
</View>
);
}
const styles = StyleSheet.create({
iconText: {
color: themeColors.PRIMARY_COLOR
},
bottomBtn:{
width:"100%",
height:60,
flexDirection:"row",
justifyContent:"space-between",
padding:15,
backgroundColor:"white",
alignItems:"center"
},
barButtonView:{
marginTop:5,
flexDirection:"column",
alignItems:"center"
}
})
\ No newline at end of file
......@@ -17,6 +17,11 @@ const styles = StyleSheet.create({
fontSize: 16,
backgroundColor: themeColors.TERTIARY_COLOR,
borderRadius: 20,
shadowColor: 'rgba(0,0,0, .4)',
shadowOffset: { height: 2, width: 1 },
shadowOpacity: 1,
shadowRadius: 1,
elevation: 2,
marginVertical: 10
},
label: {
......
......@@ -5,23 +5,14 @@
import React from 'react';
import {View, StyleSheet, Text, ScrollView} from 'react-native';
import { AppAuctionItem } from '../components/auction_item.component';
import { AppIconButton } from '../components/icon_button.component';
import { AppContainer } from '../container/container';
import themeColors from '../assets/colors';
import { AuctionBottomTab } from '../Navigations/AuctionBottomTab';
const HomeAuctionScreen = ({navigation}) => {
return (
<View style={styles.container}>
<View style={styles.header}>
</View>
<ScrollView horizontal style={styles.btnRowContainer}>
<View style={styles.contentContainer}>
<AppIconButton label='Buy' onPress = {() => navigation.navigate("SignUp")}/>
<AppIconButton label='Sell'/>
<AppIconButton label='My Bids'/>
<AppIconButton label='My Auctions'/>
</View>
</ScrollView>
<View style={styles.header}/>
<AppContainer>
<Text style={styles.auctionHeading}>Auctions List</Text>
<ScrollView>
......@@ -33,6 +24,7 @@ const HomeAuctionScreen = ({navigation}) => {
</View>
</ScrollView>
</AppContainer>
<AuctionBottomTab/>
</View>
);
};
......@@ -45,9 +37,8 @@ const styles = StyleSheet.create({
},
header: {
height: '35%',
backgroundColor : themeColors.PRIMARY_COLOR,
borderBottomEndRadius: 25,
borderBottomStartRadius: 25
marginBottom: 25,
backgroundColor : themeColors.PRIMARY_COLOR
},
btnRowContainer: {
maxHeight: 100
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment