Skip to content

Instantly share code, notes, and snippets.

@Peelz
Last active March 27, 2020 17:10
Show Gist options
  • Save Peelz/ca197b8028f04de5586d4e9dd849737d to your computer and use it in GitHub Desktop.
Save Peelz/ca197b8028f04de5586d4e9dd849737d to your computer and use it in GitHub Desktop.
import React, { useEffect } from "react";
import {
Text,
View,
SafeAreaView,
ScrollView,
StyleSheet,
TouchableOpacity,
Image,
Platform
} from "react-native";
import { AppLoading } from "expo";
import * as Font from "expo-font";
import Tabbar from "../../components/Tabbar";
const Notification = props => {
useEffect(async () => {
// await Font.loadAsync({
// CSChatThai: require("../../fonts/CSChatThai.ttf"),
// CSChatThaiUI: require("../../fonts/CSChatThaiUI.ttf")
// });
}, []);
return (
<View style={{ flex: 1 }}>
{/* Logo */}
<View
style={{
flex: 0.075,
backgroundColor: "#0000A0",
justifyContent: "center",
alignItems: "center"
}}
>
<Image
source={require("../../images/wakey-way2.png")}
style={{
width: Platform.OS === "ios" ? 170 : 150,
height: Platform.OS === "ios" ? 50 : 45
}}
/>
</View>
{/* Logo */}
{/* bar */}
<View
style={{
flex: 0.09,
backgroundColor: "#E30025",
// borderWidth: 1,
flexDirection: "row"
}}
>
{/* With Default font */}
<View style={{ flex: 1, alignItems: "center" }}>
<Text
style={{
fontSize: 20,
marginTop: Platform.OS === "ios" ? 12 : 10,
// fontFamily: "CSChatThai",
justifyContent: "center",
alignItems: "center",
color: "#FFFFFF"
}}
>
Default Font
</Text>
</View>
{/* With Custom font */}
<View style={{ flex: 1, alignItems: "center" }}>
<Text
style={{
fontSize: 20,
marginTop: Platform.OS === "ios" ? 12 : 10,
fontFamily: "CSChatThai",
justifyContent: "center",
alignItems: "center",
color: "#FFFFFF"
}}
>
CSChatThai (Custom Font)
</Text>
</View>
</View>
{/* bar */}
<SafeAreaView
style={{
flexGrow: 1
// backgroundColor: "yellow"
}}
>
<View
style={{
flex: 1,
justifyContent: "center",
alignItems: "center"
}}
>
<Text style={{ paddingVertical: 10 }}>Notification</Text>
<ScrollView style={{ flex: 1 }}>
<View
style={{
width: 300,
height: Platform.OS === "ios" ? 300 : 284,
borderWidth: 1,
alignItems: "center"
}}
>
<View style={{ flex: 10, borderWidth: 1, width: "100%" }}></View>
<View style={{ flex: 1, borderWidth: 1, width: "100%" }}></View>
</View>
</ScrollView>
<View
style={{
flex: 0.18,
width: "100%",
flexDirection: "row"
// backgroundColor: "red"
}}
>
<View
style={{
flex: 1
}}
>
{/* box btn */}
<View style={{ flex: 1 }}>
<View
style={{
marginTop: Platform.OS === "ios" ? 5 : 5,
flexDirection: "row",
justifyContent: "space-around"
}}
>
<View
style={{
// backgroundColor: "red",
marginTop: Platform.OS === "ios" ? 5 : 2
}}
>
<TouchableOpacity
activeOpacity={0.5}
onPress={() => {
props.navigation.navigate("Map");
}}
>
<Image
source={require("../../images/plus.png")}
style={{
height: 50,
width: 50,
marginLeft: Platform.OS === "ios" ? 10 : 10
}}
/>
<View style={{}}>
<Text style={{ justifyContent: "center" }}>
เพิ่มจุดหมาย
</Text>
</View>
</TouchableOpacity>
</View>
<View
style={{
// backgroundColor: "red",
marginTop: Platform.OS === "ios" ? 5 : 2
}}
>
<TouchableOpacity
activeOpacity={0.5}
onPress={() => {
props.navigation.navigate("");
}}
>
<Image
source={require("../../images/add-friend.png")}
style={{
height: 50,
width: 50,
marginLeft: Platform.OS === "ios" ? 7 : 7
}}
/>
<View style={{ marginTop: 4, justifyContent: "center" }}>
<Text style={{ marginLeft: 5 }}>เพิ่มเพื่อน</Text>
</View>
</TouchableOpacity>
</View>
</View>
</View>
</View>
</View>
</View>
</SafeAreaView>
<View style={{ flex: 0.09 }}>
<Tabbar navigation={props.navigation} col={"Notification"} />
</View>
</View>
);
};
export default Notification;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment