From d50999c35314cc4a4aacdeca51ecd4b341ec4904 Mon Sep 17 00:00:00 2001 From: Reza_ashrafi Date: Mon, 14 Mar 2022 14:32:58 +0330 Subject: [PATCH] reza added add new user to drawer --- src/components/Drawer.js | 69 ++++++++++++++++++++++---- src/components/Navbar.js | 2 +- src/screens/Blog/index.js | 2 +- src/screens/Product/components/Book.js | 2 +- src/screens/Video/index.js | 2 +- 5 files changed, 63 insertions(+), 14 deletions(-) diff --git a/src/components/Drawer.js b/src/components/Drawer.js index d36372c..707afe9 100644 --- a/src/components/Drawer.js +++ b/src/components/Drawer.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useState, useEffect } from "react"; import { View, Platform, @@ -9,6 +9,7 @@ import { TouchableOpacity, Image, Appearance, + LayoutAnimation, } from "react-native"; import { useNavigation } from "@react-navigation/native"; import { Ionicons, AntDesign } from "@expo/vector-icons"; @@ -20,6 +21,9 @@ import Svg, { Path } from "react-native-svg"; import tw from "tailwind-rn"; import fontSize from "../constants/fontSize"; import Colors from "../constants/Colors"; +import { drop } from "lodash"; + +const ios = Platform.OS === "ios"; if ( Platform.OS === "android" && @@ -31,6 +35,8 @@ if ( const Drawer = ({ position, setBoxPosition, user, mobile }) => { const [height, setHeight] = useState(Dimensions.get("window").height); const [width, setWidth] = useState(Dimensions.get("window").width); + const [dropdown, setDropdown] = useState(false); + const [dropdownHeight, setDropdownHeight] = useState(0); const colorScheme = Appearance.getColorScheme(); const [routes, setRoutes] = useState([ @@ -113,6 +119,12 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => { setWidth(Dimensions.get("window").width); }; + const animateDropdown = () => { + LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut); + setDropdown(() => !dropdown); + setDropdownHeight(dropdownHeight === 0 ? fontSize.base + 30 : 0); + }; + return ( { @@ -163,15 +175,16 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => { )} - + {user?.firstName + " " + user?.lastName} @@ -182,6 +195,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => { color: "white", fontFamily: "bold", marginTop: 5, + textAlign: ios ? "right" : "auto", }} > {user?.cellphone} @@ -192,8 +206,8 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => { xmlns="http://www.w3.org/2000/svg" width={24} height={24} - style={{ transform: [{ rotate: "-90deg" }] }} - onClick={() => setAddUserDropdown(() => !addUserDropdown)} + style={{ transform: [{ rotate: dropdown ? "90deg" : "-90deg" }], padding : 10 }} + onPress={() => animateDropdown()} > { - - {routes.map((route, index) => ( - - ))} + + + + افزودن حساب کاربری جدید + + + + + + + + {routes.map((route, index) => ( + + ))} + diff --git a/src/components/Navbar.js b/src/components/Navbar.js index 294477e..a8e666d 100644 --- a/src/components/Navbar.js +++ b/src/components/Navbar.js @@ -98,7 +98,7 @@ const Navbar = ({ notification, setBoxPosition, headerOptions }) => { {notification && ( )} diff --git a/src/screens/Blog/index.js b/src/screens/Blog/index.js index 5782cef..6c1a6bf 100644 --- a/src/screens/Blog/index.js +++ b/src/screens/Blog/index.js @@ -65,7 +65,7 @@ export const Blog = ({ getInfo, blog, getList, blogs, route }) => { diff --git a/src/screens/Product/components/Book.js b/src/screens/Product/components/Book.js index aee17d4..a567666 100644 --- a/src/screens/Product/components/Book.js +++ b/src/screens/Product/components/Book.js @@ -90,7 +90,7 @@ function Book({ source={{ uri: `https://dnvn.ir/api/v1/file/${book?.fileIds}` }} resizeMode="contain" style={[ - tw("rounded-sm bg-red-400"), + tw("rounded-sm"), { height: ((width / 3) * 4) / 2.6, width: width / 3 }, ]} /> diff --git a/src/screens/Video/index.js b/src/screens/Video/index.js index 2413844..fed6cbb 100644 --- a/src/screens/Video/index.js +++ b/src/screens/Video/index.js @@ -89,7 +89,7 @@ function Product({ source={{ uri: `https://dnvn.ir/api/v1/file/${book?.fileIds}` }} resizeMode="contain" style={[ - tw("rounded-sm ml-2 bg-red-400"), + tw("rounded-sm ml-2"), { height: mobile ? width / 3 * 4 / 2.6 : 300, width: mobile ? width / 3 : 210 }, ]} />