reza checked bottom navigation in ios and android

master
Reza_ashrafi 3 years ago
parent dbd05f287a
commit d1f46bd12e
  1. 19
      navigation/index.js
  2. 38
      src/components/Search.js
  3. 4
      src/screens/Blogs/layouts/New.js
  4. 16
      src/screens/Blogs/layouts/Single.js
  5. 4
      src/screens/Blogs/layouts/Target.js
  6. 5
      src/screens/Home/components/Blogs.js
  7. 7
      src/screens/Home/components/Videos.js
  8. 28
      src/screens/Home/index.js
  9. 176
      src/screens/Login/index.js
  10. 60
      src/screens/Products/components/Main.js
  11. 11
      src/screens/VideoDisplay/index.js

@ -1,6 +1,6 @@
import React, { useEffect } from "react"; import React, { useEffect } from "react";
import Svg, { G, Path } from "react-native-svg"; import Svg, { G, Path } from "react-native-svg";
import { Appearance } from "react-native"; import { Appearance, Platform } from "react-native";
import { NavigationContainer } from "@react-navigation/native"; import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack"; import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs"; import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
@ -40,29 +40,35 @@ import fontSize from "../src/constants/fontSize";
import Colors from "../src/constants/Colors"; import Colors from "../src/constants/Colors";
import tw from "tailwind-react-native-classnames"; import tw from "tailwind-react-native-classnames";
const ios = Platform.OS === "ios";
const Tab = createBottomTabNavigator(); const Tab = createBottomTabNavigator();
const BottomTabNavigator = () => { const BottomTabNavigator = () => {
const [height, setHeight] = React.useState(88);
const colorScheme = Appearance.getColorScheme(); const colorScheme = Appearance.getColorScheme();
React.useEffect(() => {
setTimeout(() => {
setHeight(89);
},1000);
},[]);
return ( return (
<Tab.Navigator <Tab.Navigator
initialRouteName="HomeTab" initialRouteName="HomeTab"
screenOptions={{ screenOptions={{
tabBarHideOnKeyboard: true, tabBarHideOnKeyboard: true,
headerShown: false, headerShown: false,
tabBarLabelPosition : "below-icon",
tabBarActiveTintColor: Colors.theme1[colorScheme].green79, tabBarActiveTintColor: Colors.theme1[colorScheme].green79,
tabBarInactiveTintColor: "grey", tabBarInactiveTintColor: "grey",
tabBarStyle: { tabBarStyle: {
backgroundColor: Colors.theme1[colorScheme].greenFF1, backgroundColor: Colors.theme1[colorScheme].greenFF1,
height: 70, height
}, },
tabBarLabelStyle: { tabBarLabelStyle: {
fontSize: fontSize.sm, fontSize: fontSize.sm,
fontFamily: "bold", fontFamily: "bold",
transform: [{ translateY: -7 }],
}, },
tabBarShowLabel: true, tabBarShowLabel: true,
// tabBarLabel : 'reza'
}} }}
> >
<Tab.Screen <Tab.Screen
@ -342,8 +348,9 @@ const HomeStackScreen = () => {
> >
<HomeStack.Screen name="Home" component={Home} /> <HomeStack.Screen name="Home" component={Home} />
<HomeStack.Screen name="VOD" component={Videos} /> <HomeStack.Screen name="VOD" component={Videos} />
<HomeStack.Screen name="Video" component={Video} unmountOnExit={true} />
<HomeStack.Screen name="VideoDisplay" component={VideoDisplay} />
<HomeStack.Screen name="Products" component={Products} /> <HomeStack.Screen name="Products" component={Products} />
<HomeStack.Screen name="Video" component={Video} />
<HomeStack.Screen name="Product" component={Product} /> <HomeStack.Screen name="Product" component={Product} />
<HomeStack.Screen name="Blogs" component={Blogs} /> <HomeStack.Screen name="Blogs" component={Blogs} />
<HomeStack.Screen name="Blog" component={Blog} /> <HomeStack.Screen name="Blog" component={Blog} />

@ -1,28 +1,22 @@
import React, {useState} from 'react'; import React, { useState } from "react";
import { import {
TextInput, TextInput,
View, View,
Dimensions, Dimensions,
StyleSheet, StyleSheet,
Pressable, Pressable,
Appearance Appearance,
} from 'react-native'; } from "react-native";
import tw from 'tailwind-rn'; import tw from "tailwind-rn";
import { AntDesign } from '@expo/vector-icons'; import { AntDesign } from "@expo/vector-icons";
//style //style
import Colors from "../constants/Colors"; import Colors from "../constants/Colors";
import fontSize from '../constants/fontSize'; import fontSize from "../constants/fontSize";
const width = Dimensions.get('window').width; const width = Dimensions.get("window").width;
const Search = ({ const Search = ({ placeholder, textAlign, direction, onChange, value }) => {
placeholder,
textAlign,
direction,
onChange,
value,
}) => {
const colorScheme = Appearance.getColorScheme(); const colorScheme = Appearance.getColorScheme();
const styles = StyleSheet.create({ const styles = StyleSheet.create({
inputStyle: { inputStyle: {
@ -35,19 +29,19 @@ const Search = ({
direction: direction, direction: direction,
textAlign: textAlign, textAlign: textAlign,
backgroundColor: Colors.theme1[colorScheme].white, backgroundColor: Colors.theme1[colorScheme].white,
fontFamily : 'regular' fontFamily: "regular",
}, },
}); });
return ( return (
<View style={[{marginTop: 18}, tw('w-full relative')]}> <View style={[{ marginTop: 18 }, tw("w-full relative")]}>
<TextInput <TextInput
style={[styles.inputStyle, tw('rounded-md')]} style={[styles.inputStyle, tw("rounded-md")]}
onChangeText={text => onChange(text)} onChangeText={(text) => onChange(text)}
placeholder={placeholder} placeholder={placeholder}
placeholderTextColor={Colors.theme1[colorScheme].gray2077} placeholderTextColor={Colors.theme1[colorScheme].gray2077}
value={value} value={value}
/> />
<Pressable style={tw('absolute left-3 top-0 inset-y-3.5')}> <Pressable style={tw("absolute left-3 top-3")}>
<AntDesign name="search1" size={20} color="#52796F" /> <AntDesign name="search1" size={20} color="#52796F" />
</Pressable> </Pressable>
</View> </View>
@ -57,6 +51,6 @@ const Search = ({
export default Search; export default Search;
Search.defaultProps = { Search.defaultProps = {
direction: 'rtl', direction: "rtl",
textAlign: 'right', textAlign: "right",
}; };

@ -45,7 +45,7 @@ export const New = ({ blog }) => {
fontFamily: "bold", fontFamily: "bold",
color: Colors.theme1[colorScheme].gray20, color: Colors.theme1[colorScheme].gray20,
marginTop: 5, marginTop: 5,
textAlign: ios ? "right" : "", textAlign: ios ? "right" : "auto",
}} }}
> >
{blog?.title} {blog?.title}
@ -55,7 +55,7 @@ export const New = ({ blog }) => {
fontSize: fontSize.sm, fontSize: fontSize.sm,
fontFamily: "regular", fontFamily: "regular",
color: Colors.theme1[colorScheme].gray2077, color: Colors.theme1[colorScheme].gray2077,
textAlign: ios ? "right" : "", textAlign: ios ? "right" : "auto",
marginTop: 5, marginTop: 5,
}} }}
> >

@ -6,6 +6,7 @@ import {
Dimensions, Dimensions,
Image, Image,
Appearance, Appearance,
Platform,
} from "react-native"; } from "react-native";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { LinearGradient } from "expo-linear-gradient"; import { LinearGradient } from "expo-linear-gradient";
@ -17,6 +18,7 @@ import fontSize from "../../../constants/fontSize";
import Colors from "../../../constants/Colors"; import Colors from "../../../constants/Colors";
const { height, width } = Dimensions.get("window"); const { height, width } = Dimensions.get("window");
const ios = Platform.OS === "ios";
export const Single = ({ blog }) => { export const Single = ({ blog }) => {
const navigation = useNavigation(); const navigation = useNavigation();
@ -58,7 +60,11 @@ export const Single = ({ blog }) => {
<Text <Text
style={[ style={[
tw("text-gray-100"), tw("text-gray-100"),
{ fontFamily: "bold", fontSize: fontSize.tiny }, {
fontFamily: "bold",
fontSize: fontSize.tiny,
textAlign: ios ? "right" : "auto",
},
]} ]}
> >
{"نوشته از:" + " " + "کامران ایزدی"} {"نوشته از:" + " " + "کامران ایزدی"}
@ -66,7 +72,11 @@ export const Single = ({ blog }) => {
<Text <Text
style={[ style={[
tw("text-gray-100 mt-2"), tw("text-gray-100 mt-2"),
{ fontFamily: "bold", fontSize: fontSize.sm }, {
fontFamily: "bold",
fontSize: fontSize.sm,
textAlign: ios ? "right" : "auto",
},
]} ]}
> >
{"سردبیر بخش وبلاگ دانوین"} {"سردبیر بخش وبلاگ دانوین"}
@ -101,6 +111,7 @@ export const Single = ({ blog }) => {
fontFamily: "bold", fontFamily: "bold",
fontSize: fontSize.xl, fontSize: fontSize.xl,
color: Colors.theme1[colorScheme].gray20, color: Colors.theme1[colorScheme].gray20,
textAlign: ios ? "right" : "auto",
}} }}
> >
{blog?.title} {blog?.title}
@ -112,6 +123,7 @@ export const Single = ({ blog }) => {
color: Colors.theme1[colorScheme].gray2077, color: Colors.theme1[colorScheme].gray2077,
lineHeight: 25, lineHeight: 25,
marginTop: 10, marginTop: 10,
textAlign: ios ? "right" : "auto",
}} }}
> >
هر نفسی که فرو می بریم، مرگی را که مدام به ما دست اندازی میکند پس هر نفسی که فرو می بریم، مرگی را که مدام به ما دست اندازی میکند پس

@ -49,7 +49,7 @@ const Target = ({ blogs }) => {
{ {
fontFamily: "bold", fontFamily: "bold",
fontSize: fontSize.xl, fontSize: fontSize.xl,
textAlign: ios ? "right" : "", textAlign: ios ? "right" : "auto",
}, },
]} ]}
> >
@ -139,7 +139,7 @@ const Target = ({ blogs }) => {
{ {
fontFamily: "bold", fontFamily: "bold",
fontSize: fontSize.lg, fontSize: fontSize.lg,
textAlign: ios ? "right" : "", textAlign: ios ? "right" : "auto",
}, },
]} ]}
> >

@ -7,7 +7,8 @@ import {
TouchableOpacity, TouchableOpacity,
FlatList, FlatList,
Pressable, Pressable,
Appearance Appearance,
Platform
} from "react-native"; } from "react-native";
import { connect } from "react-redux"; import { connect } from "react-redux";
import Svg, { G, Path } from "react-native-svg"; import Svg, { G, Path } from "react-native-svg";
@ -24,6 +25,7 @@ import fontSize from "../../../constants/fontSize";
import userImage from "../assets/user.png"; import userImage from "../assets/user.png";
const { width } = Dimensions.get("window"); const { width } = Dimensions.get("window");
const ios = Platform.OS === "ios";
function Blogs({ blogs }) { function Blogs({ blogs }) {
const colorScheme = Appearance.getColorScheme(); const colorScheme = Appearance.getColorScheme();
@ -64,6 +66,7 @@ function Blogs({ blogs }) {
color: Colors.theme1[colorScheme].gray20, color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold", fontFamily: "bold",
fontSize: fontSize.tiny, fontSize: fontSize.tiny,
textAlign: ios ? "right" : "auto",
}, },
]} ]}
> >

@ -5,6 +5,7 @@ import {
TouchableOpacity, TouchableOpacity,
FlatList, FlatList,
Appearance, Appearance,
Platform
} from "react-native"; } from "react-native";
import { useNavigation } from "@react-navigation/native"; import { useNavigation } from "@react-navigation/native";
import tw from "tailwind-rn"; import tw from "tailwind-rn";
@ -18,6 +19,8 @@ import Header from "../components/Header";
import Colors from "../../../constants/Colors"; import Colors from "../../../constants/Colors";
import fontSize from "../../../constants/fontSize"; import fontSize from "../../../constants/fontSize";
const ios = Platform.OS === "ios";
function Videos({ videos, grades }) { function Videos({ videos, grades }) {
const colorScheme = Appearance.getColorScheme(); const colorScheme = Appearance.getColorScheme();
const Video = ({ video }) => { const Video = ({ video }) => {
@ -44,6 +47,7 @@ function Videos({ videos, grades }) {
color: Colors.theme1[colorScheme].gray20, color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold", fontFamily: "bold",
fontSize: fontSize.base, fontSize: fontSize.base,
textAlign: ios ? "right" : "auto",
}, },
]} ]}
> >
@ -54,8 +58,9 @@ function Videos({ videos, grades }) {
tw("mt-1 pr-1"), tw("mt-1 pr-1"),
{ {
color: Colors.theme1[colorScheme].gray20, color: Colors.theme1[colorScheme].gray20,
fontFamily: "light", fontFamily: "regular",
fontSize: fontSize.tiny, fontSize: fontSize.tiny,
textAlign: ios ? "right" : "auto",
}, },
]} ]}
> >

@ -11,8 +11,9 @@ import {
StatusBar, StatusBar,
LayoutAnimation, LayoutAnimation,
} from "react-native"; } from "react-native";
//components
import Navbar from "../../components/Navbar"; import Navbar from "../../components/Navbar";
import tw from "tailwind-rn";
import Scroll from "./components/Scroll"; import Scroll from "./components/Scroll";
import MyBooks from "./components/MyBooks"; import MyBooks from "./components/MyBooks";
import Videos from "./components/Videos"; import Videos from "./components/Videos";
@ -20,6 +21,9 @@ import Blogs from "./components/Blogs";
import Drawer from "../../components/Drawer"; import Drawer from "../../components/Drawer";
import Header from "./components/Header"; import Header from "./components/Header";
//style
import tw from "tailwind-rn";
// Within your render function // Within your render function
const Home = ({ const Home = ({
blogs, blogs,
@ -33,7 +37,7 @@ const Home = ({
useEffect(() => { useEffect(() => {
getBlogs(); getBlogs();
getBooks({vod : true}); getBooks({ vod: true });
getUserProducts(); getUserProducts();
}, []); }, []);
@ -41,7 +45,7 @@ const Home = ({
LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut); LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
setPosition(position === "100%" ? "0%" : "100%"); setPosition(position === "100%" ? "0%" : "100%");
}; };
return ( return (
<SafeAreaView <SafeAreaView
style={{ style={{
@ -61,19 +65,20 @@ const Home = ({
back: false, back: false,
}} }}
/> />
<Drawer setBoxPosition={setBoxPosition} position={position} /> <Drawer setBoxPosition={setBoxPosition} position={position} />
<ScrollView <ScrollView
contentContainerStyle={styles.contentContainerStyle} contentContainerStyle={styles.contentContainerStyle}
style={[styles.container, tw("flex")]} style={[styles.container]}
> >
{userProduct?.length > 0 && <MyBooks books={userProducts} />} {userProduct?.length > 0 && <MyBooks books={userProducts} />}
<View style={tw("px-4 w-full")}> <View style={tw("px-4 w-full")}>
<Header title={"فروشگاه"} route={"Products"} /> <Header title={"فروشگاه"} route={"Products"} />
</View> </View>
{books?.length > 0 && <Scroll books={books} />} {books?.length > 0 && <Scroll books={books} />}
{books?.length > 0 && <Videos videos={books} />} {books?.length > 0 && <Videos videos={books} />}
{blogs?.length > 0 && <Blogs blogs={blogs} />} {/* {blogs?.length > 0 && <Blogs blogs={blogs} />} */}
</ScrollView> </ScrollView>
</SafeAreaView> </SafeAreaView>
); );
}; };
@ -81,10 +86,13 @@ const Home = ({
// Later on in your styles.. // Later on in your styles..
const styles = StyleSheet.create({ const styles = StyleSheet.create({
contentContainerStyle: { contentContainerStyle: {
paddingBottom: 20, paddingBottom: 100,
// alignItems: "",
}, },
container: { container: {
width: Dimensions.get("window").width,
backgroundColor: "white", backgroundColor: "white",
flexDirection: "column",
paddingVertical: 0, paddingVertical: 0,
paddingHorizontal: 0, paddingHorizontal: 0,
}, },

@ -1,5 +1,5 @@
import React, { useState } from "react"; import React, { useState } from "react";
import {connect} from 'react-redux'; import { connect } from "react-redux";
import { import {
View, View,
@ -9,18 +9,20 @@ import {
Dimensions, Dimensions,
TouchableHighlight, TouchableHighlight,
Appearance, Appearance,
Platform Platform,
TouchableWithoutFeedback,
KeyboardAvoidingView,
} from "react-native"; } from "react-native";
import Logo from "./assets/logo.png"; import Logo from "./assets/logo.png";
import CustomTextInput from "../../components/CustomTextInput"; import CustomTextInput from "../../components/CustomTextInput";
import onInput from '../../utils/onInput'; import onInput from "../../utils/onInput";
import { asyncAwesomeAlert } from "../../utils/AsyncWrappers"; import { asyncAwesomeAlert } from "../../utils/AsyncWrappers";
import tw from "tailwind-rn"; import tw from "tailwind-rn";
import {user} from '../../redux/actions'; import { user } from "../../redux/actions";
import Colors from "../../constants/Colors"; import Colors from "../../constants/Colors";
import fontSize from "../../constants/fontSize"; import fontSize from "../../constants/fontSize";
const ios = Platform.OS === 'ios'; const ios = Platform.OS === "ios";
const { width } = Dimensions.get("window"); const { width } = Dimensions.get("window");
@ -34,7 +36,7 @@ function Login(props) {
}; };
const checkPhoneNumber = () => { const checkPhoneNumber = () => {
return phone.split("").length === 11 && phone.slice(0, 2) === '09'; return phone.split("").length === 11 && phone.slice(0, 2) === "09";
}; };
const submit = async () => { const submit = async () => {
@ -45,100 +47,100 @@ function Login(props) {
showCancelButton: false, showCancelButton: false,
}); });
} }
props.sendPhoneNumber({cellphone : phone}); props.sendPhoneNumber({ cellphone: phone });
props.navigation.navigate("Otp", { phone : phone}); props.navigation.navigate("Otp", { phone: phone });
setLoading(false); setLoading(false);
}; };
return ( return (
<View <KeyboardAvoidingView
behavior={ios ? "padding" : "height"}
style={[ style={[
tw("flex flex-col flex-1 justify-center items-center bg-white px-4"), tw("flex flex-col flex-1 justify-center items-center bg-white px-4"),
]} ]}
> >
<Image {/* <TouchableWithoutFeedback> */}
source={Logo} <Image
style={{ source={Logo}
width: 55, style={{
height: 80, width: 55,
}} height: 80,
/> }}
<Text
style={[
tw(`w-full mt-5 ${ios ? "text-right" : ""}`),
{
fontSize: fontSize.xl2,
fontFamily: "bold",
color: Colors.theme1[colorScheme].black,
},
]}
>
{"سلام"}
</Text>
<Text
style={[
tw(`w-full mb-5 ${ios ? "text-right" : ""}`),
{
fontSize: fontSize.xl2,
fontFamily: "bold",
color: Colors.theme1[colorScheme].black,
},
]}
>
{"خوش برگشتی!"}
</Text>
<View style={[tw("w-full rounded-md overflow-hidden relative"), {}]}>
<CustomTextInput
label="شماره موبایل"
textAlign="left"
name="phone"
maxLength={11}
value={phone}
onChange={onChangePhone}
autoFocus={true}
direction="ltr"
regex={onInput.phonenumber}
/> />
</View> <Text
<TouchableHighlight style={[
disabled={loading} tw(`w-full mt-5 ${ios ? "text-right" : ""}`),
style={[ {
tw("w-full py-2.5 rounded-md"), fontSize: fontSize.xl2,
{ fontFamily: "bold",
backgroundColor: Colors.theme1[colorScheme].greenCF, color: Colors.theme1[colorScheme].black,
alignItems: "center", },
justifyContent: "center", ]}
marginTop: 15, >
fontFamily: "light", {"سلام"}
}, </Text>
]} <Text
onPress={() => submit()} style={[
> tw(`w-full mb-5 ${ios ? "text-right" : ""}`),
{loading ? ( {
<ActivityIndicator size={"small"} color={"white"} /> fontSize: fontSize.xl2,
) : ( fontFamily: "bold",
<Text color: Colors.theme1[colorScheme].black,
style={{ },
color: "white", ]}
fontSize: fontSize.xl, >
fontWeight: "bold" {"خوش برگشتی!"}
}} </Text>
> <View style={[tw("w-full rounded-md overflow-hidden relative"), {}]}>
{"ادامه"} <CustomTextInput
</Text> label="شماره موبایل"
)} textAlign="left"
</TouchableHighlight> name="phone"
</View> maxLength={11}
value={phone}
onChange={onChangePhone}
autoFocus={true}
direction="ltr"
regex={onInput.phonenumber}
/>
</View>
<TouchableHighlight
disabled={loading}
style={[
tw("w-full py-2.5 rounded-md"),
{
backgroundColor: Colors.theme1[colorScheme].greenCF,
alignItems: "center",
justifyContent: "center",
marginTop: 15,
fontFamily: "light",
},
]}
onPress={() => submit()}
>
{loading ? (
<ActivityIndicator size={"small"} color={"white"} />
) : (
<Text
style={{
color: "white",
fontSize: fontSize.xl,
fontWeight: "bold",
}}
>
{"ادامه"}
</Text>
)}
</TouchableHighlight>
{/* </TouchableWithoutFeedback> */}
</KeyboardAvoidingView>
); );
} }
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({});
})
const mapDispatchToProps = { const mapDispatchToProps = {
sendPhoneNumber : user.otp sendPhoneNumber: user.otp,
} };
export default connect(mapStateToProps, mapDispatchToProps)(Login); export default connect(mapStateToProps, mapDispatchToProps)(Login);

@ -5,6 +5,7 @@ import {
Image, Image,
Dimensions, Dimensions,
Appearance, Appearance,
Platform,
} from "react-native"; } from "react-native";
import React from "react"; import React from "react";
import { connect } from "react-redux"; import { connect } from "react-redux";
@ -17,6 +18,7 @@ import Colors from "../../../constants/Colors";
import fontSize from "../../../constants/fontSize"; import fontSize from "../../../constants/fontSize";
const width = Dimensions.get("window").width; const width = Dimensions.get("window").width;
const ios = Platform.OS === "ios";
const Main = ({ books, filterOptions, grades }) => { const Main = ({ books, filterOptions, grades }) => {
const colorScheme = Appearance.getColorScheme(); const colorScheme = Appearance.getColorScheme();
@ -90,15 +92,35 @@ const Main = ({ books, filterOptions, grades }) => {
<Text <Text
style={[ style={[
tw("mb-1"), tw("mb-1"),
{ fontFamily: "bold", fontSize: fontSize.xl2, color : Colors.theme1[colorScheme].gray20 }, {
fontFamily: "bold",
fontSize: fontSize.lg,
color: Colors.theme1[colorScheme].gray20,
textAlign: ios ? "right" : "auto",
},
]} ]}
> >
{'دوره ویدئویی' + ' ' + product?.name} {"دوره ویدئویی" + " " + product?.name}
</Text> </Text>
<Text style={[tw("mb-4"), { fontSize: fontSize.tiny, fontFamily : 'regular', color : Colors.theme1[colorScheme].greenBA }]}> <Text
style={[
tw("mb-4"),
{
fontSize: fontSize.tiny,
fontFamily: "regular",
color: Colors.theme1[colorScheme].greenBA,
textAlign: ios ? "right" : "auto",
},
]}
>
{"پایه" + " " + grades[product?.gradeId]} {"پایه" + " " + grades[product?.gradeId]}
</Text> </Text>
<Text style={[tw("w-full flex flex-row text-left"), {fontSize : fontSize.xl, fontFamily : 'bold'}]}> <Text
style={[
tw("w-full flex flex-row text-left"),
{ fontSize: fontSize.xl, fontFamily: "bold" },
]}
>
{separate(product?.product[2]?.price) + " " + "تومان"} {separate(product?.product[2]?.price) + " " + "تومان"}
</Text> </Text>
</Pressable> </Pressable>
@ -120,7 +142,10 @@ const Main = ({ books, filterOptions, grades }) => {
tw("flex justify-between px-2 pt-2 rounded-md"), tw("flex justify-between px-2 pt-2 rounded-md"),
]} ]}
onPress={() => onPress={() =>
navigation.navigate("Product", { id: product?.id, type: "book" }) navigation.navigate("Product", {
id: product?.id,
type: "book",
})
} }
> >
<View style={tw("w-full flex")}> <View style={tw("w-full flex")}>
@ -135,11 +160,12 @@ const Main = ({ books, filterOptions, grades }) => {
/> />
<Text <Text
style={{ style={{
fontSize: fontSize.lg, fontSize: fontSize.base,
marginTop: 5, marginTop: 5,
color: "#05335F", color: "#05335F",
fontFamily: "bold", fontFamily: "bold",
width: "100%", width: "100%",
textAlign: ios ? "right" : "auto",
}} }}
> >
{"کتاب دیجیتال" + " " + product?.name} {"کتاب دیجیتال" + " " + product?.name}
@ -151,6 +177,7 @@ const Main = ({ books, filterOptions, grades }) => {
marginTop: 5, marginTop: 5,
fontFamily: "regular", fontFamily: "regular",
width: "100%", width: "100%",
textAlign: ios ? "right" : "auto",
}} }}
> >
{"پایه" + " " + grades[product?.gradeId]} {"پایه" + " " + grades[product?.gradeId]}
@ -176,7 +203,7 @@ const Main = ({ books, filterOptions, grades }) => {
<Text <Text
style={{ style={{
fontSize: fontSize.sm, fontSize: fontSize.sm,
color: Colors.theme1[colorScheme].grayCC, color: Colors.theme1[colorScheme].gray2077,
fontFamily: "regular", fontFamily: "regular",
}} }}
> >
@ -200,7 +227,10 @@ const Main = ({ books, filterOptions, grades }) => {
tw("flex justify-between px-2 pt-2 rounded-md"), tw("flex justify-between px-2 pt-2 rounded-md"),
]} ]}
onPress={() => onPress={() =>
navigation.navigate("Product", { id: product?.id, type: "book" }) navigation.navigate("Product", {
id: product?.id,
type: "book",
})
} }
> >
<View style={tw("w-full flex")}> <View style={tw("w-full flex")}>
@ -215,11 +245,12 @@ const Main = ({ books, filterOptions, grades }) => {
/> />
<Text <Text
style={{ style={{
fontSize: fontSize.lg, fontSize: fontSize.base,
marginTop: 5, marginTop: 5,
color: "#05335F", color: "#05335F",
fontFamily: "bold", fontFamily: "bold",
width: "100%", width: "100%",
textAlign: ios ? "right" : "auto",
}} }}
> >
{"کتاب فیزیکی" + " " + product?.name} {"کتاب فیزیکی" + " " + product?.name}
@ -231,6 +262,7 @@ const Main = ({ books, filterOptions, grades }) => {
marginTop: 5, marginTop: 5,
fontFamily: "regular", fontFamily: "regular",
width: "100%", width: "100%",
textAlign: ios ? "right" : "auto",
}} }}
> >
{"پایه" + " " + grades[product?.gradeId]} {"پایه" + " " + grades[product?.gradeId]}
@ -256,7 +288,7 @@ const Main = ({ books, filterOptions, grades }) => {
<Text <Text
style={{ style={{
fontSize: fontSize.sm, fontSize: fontSize.sm,
color: Colors.theme1[colorScheme].grayCC, color: Colors.theme1[colorScheme].gray2077,
fontFamily: "regular", fontFamily: "regular",
}} }}
> >
@ -271,9 +303,11 @@ const Main = ({ books, filterOptions, grades }) => {
return ( return (
<View <View
style={[tw( style={[
"flex w-full px-4 flex-row flex-wrap justify-between bg-white pb-20" tw(
)]} "flex w-full px-4 flex-row flex-wrap justify-between bg-white pb-20"
),
]}
> >
{filterOptions?.productType === "دوره ویدئویی" && Items(2)} {filterOptions?.productType === "دوره ویدئویی" && Items(2)}
{filterOptions?.productType === "کتاب دیجیتال" && Items(0)} {filterOptions?.productType === "کتاب دیجیتال" && Items(0)}

@ -9,6 +9,7 @@ import {
LayoutAnimation, LayoutAnimation,
Appearance, Appearance,
Text, Text,
Platform,
} from "react-native"; } from "react-native";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { publicApi } from "../../redux/actions"; import { publicApi } from "../../redux/actions";
@ -26,6 +27,7 @@ import fontSize from "../../constants/fontSize";
import Colors from "../../constants/Colors"; import Colors from "../../constants/Colors";
const { width } = Dimensions.get("window"); const { width } = Dimensions.get("window");
const ios = Platform.OS === "ios";
function VideoDisplay({ route }) { function VideoDisplay({ route }) {
const colorScheme = Appearance.getColorScheme(); const colorScheme = Appearance.getColorScheme();
@ -53,7 +55,7 @@ function VideoDisplay({ route }) {
return ( return (
<SafeAreaView <SafeAreaView
style={{ style={{
paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0, paddingTop: !ios ? StatusBar.currentHeight : 0,
position: "relative", position: "relative",
}} }}
> >
@ -88,7 +90,12 @@ function VideoDisplay({ route }) {
onPlaybackStatusUpdate={(status) => setStatus(() => status)} onPlaybackStatusUpdate={(status) => setStatus(() => status)}
/> />
<Text <Text
style={{ fontSize: fontSize.xl, fontFamily: "bold", marginTop: 8 }} style={{
fontSize: fontSize.xl,
fontFamily: "bold",
marginTop: 8,
textAlign: ios ? "right" : "auto",
}}
> >
{route.params.unit?.name} {route.params.unit?.name}
</Text> </Text>

Loading…
Cancel
Save