fix drawer on ios

This commit is contained in:
ammarahm-ed
2020-12-08 10:42:26 +05:00
parent f55c34d6ce
commit 41c653073d
2 changed files with 24 additions and 19 deletions

View File

@@ -1,6 +1,6 @@
import {isNull} from 'lodash'; import {isNull} from 'lodash';
import React, {useEffect, useState} from 'react'; import React, {useEffect, useState} from 'react';
import {Dimensions, View} from 'react-native'; import {Dimensions, Platform, View} from 'react-native';
import ScrollableTabView from 'react-native-scrollable-tab-view'; import ScrollableTabView from 'react-native-scrollable-tab-view';
import SplashScreen from 'react-native-splash-screen'; import SplashScreen from 'react-native-splash-screen';
import {notesnook} from './e2e/test.ids'; import {notesnook} from './e2e/test.ids';
@@ -21,7 +21,7 @@ import {
} from './src/services/EventManager'; } from './src/services/EventManager';
import IntentService from './src/services/IntentService'; import IntentService from './src/services/IntentService';
import SettingsService from './src/services/SettingsService'; import SettingsService from './src/services/SettingsService';
import {editing, setWidthHeight} from './src/utils'; import {dWidth, editing, setWidthHeight} from './src/utils';
import { import {
eCloseFullscreenEditor, eCloseFullscreenEditor,
eCloseSideMenu, eCloseSideMenu,
@@ -30,7 +30,7 @@ import {
eOpenSideMenu, eOpenSideMenu,
} from './src/utils/Events'; } from './src/utils/Events';
import {editorRef, tabBarRef} from './src/utils/Refs'; import {editorRef, tabBarRef} from './src/utils/Refs';
import { sleep } from './src/utils/TimeUtils'; import {sleep} from './src/utils/TimeUtils';
import {EditorWrapper} from './src/views/Editor/EditorWrapper'; import {EditorWrapper} from './src/views/Editor/EditorWrapper';
import {getIntent, getNote, post} from './src/views/Editor/Functions'; import {getIntent, getNote, post} from './src/views/Editor/Functions';
@@ -93,21 +93,18 @@ const _moveResponder = (e) => {
}; };
const _handleTouch = () => { const _handleTouch = () => {
if (currentTab === 0) return;
{ {
if (currentTab === 1 && startLocation > updatedDimensions.height - 70) { if (currentTab === 1 && startLocation > updatedDimensions.height - 70) {
if (currentScroll === 0 || currentScroll === 1) { if (currentScroll === 0 || currentScroll === 1) {
tabBarRef.current?.setScrollEnabled(false); tabBarRef.current?.setScrollEnabled(false);
} }
} /* else if ( } else if (currentTab === 0 && Platform.OS === 'ios') {
currentTab === 0 && if (currentScroll === 0 && startLocationX < 150) {
startLocationX < updatedDimensions.width * 0.75
) {
console.log('here it is here');
if (currentScroll === 0 || currentScroll === 1) {
tabBarRef.current?.setScrollEnabled(false); tabBarRef.current?.setScrollEnabled(false);
} else {
tabBarRef.current?.setScrollEnabled(true);
} }
} */ else { } else {
console.log('blocking'); console.log('blocking');
tabBarRef.current?.setScrollEnabled(true); tabBarRef.current?.setScrollEnabled(true);
} }
@@ -115,7 +112,6 @@ const _handleTouch = () => {
}; };
const _onTouchEnd = (e) => { const _onTouchEnd = (e) => {
if (currentTab === 0) return;
console.log('touch ended'); console.log('touch ended');
startLocation = 0; startLocation = 0;
tabBarRef.current?.setScrollEnabled(true); tabBarRef.current?.setScrollEnabled(true);
@@ -228,7 +224,7 @@ const AppStack = React.memo(
}} }}
onMoveShouldSetResponderCapture={_moveResponder} onMoveShouldSetResponderCapture={_moveResponder}
onTouchEnd={_onTouchEnd} onTouchEnd={_onTouchEnd}
onStartShouldSetResponder={_responder}> onStartShouldSetResponderCapture={_responder}>
{mode && ( {mode && (
<ScrollableTabView <ScrollableTabView
ref={tabBarRef} ref={tabBarRef}

View File

@@ -10,7 +10,7 @@ import {sideMenuRef, tabBarRef} from '../utils/Refs';
import {sleep} from '../utils/TimeUtils'; import {sleep} from '../utils/TimeUtils';
import {NavigatorStack} from './NavigatorStack'; import {NavigatorStack} from './NavigatorStack';
const menuRef =React.createRef(); const menuRef = React.createRef();
const Drawer = createDrawerNavigator(); const Drawer = createDrawerNavigator();
export const NavigationStack = ({component = NavigatorStack}) => { export const NavigationStack = ({component = NavigatorStack}) => {
@@ -27,11 +27,11 @@ export const NavigationStack = ({component = NavigatorStack}) => {
}, []); }, []);
const setGestureDisabled = () => { const setGestureDisabled = () => {
setLocked(true); //setLocked(true);
}; };
const setGestureEnabled = () => { const setGestureEnabled = () => {
setLocked(false); //setLocked(false);
}; };
React.useEffect(() => { React.useEffect(() => {
@@ -43,6 +43,16 @@ export const NavigationStack = ({component = NavigatorStack}) => {
}; };
}, []); }, []);
const onStateChange = (state) => {
let s = state[0];
if (s && s !== State.ACTIVE && s !== State.BEGAN) {
let state = sideMenuRef.current.getRootState();
if (state.history.findIndex((o) => o.type === 'drawer') === -1) {
tabBarRef.current?.setScrollEnabled(true);
}
}
}
return ( return (
<NavigationContainer ref={sideMenuRef}> <NavigationContainer ref={sideMenuRef}>
<Drawer.Navigator <Drawer.Navigator
@@ -50,14 +60,13 @@ export const NavigationStack = ({component = NavigatorStack}) => {
swipeEnabled: locked || deviceMode !== 'mobile' ? false : true, swipeEnabled: locked || deviceMode !== 'mobile' ? false : true,
gestureEnabled: locked || deviceMode !== 'mobile' ? false : true, gestureEnabled: locked || deviceMode !== 'mobile' ? false : true,
}} }}
onStateChange={onStateChange}
drawerStyle={{ drawerStyle={{
width: initRender ? 0 : deviceMode !== 'mobile' ? 0 : '65%', width: initRender ? 0 : deviceMode !== 'mobile' ? 0 : '65%',
height: initRender ? 0 : null, height: initRender ? 0 : null,
borderRightWidth: 0, borderRightWidth: 0,
}} }}
drawerContentOptions={{ drawerContentOptions={{}}
}}
edgeWidth={200} edgeWidth={200}
drawerType="slide" drawerType="slide"
drawerContent={deviceMode !== 'mobile' ? () => <></> : DrawerComponent} drawerContent={deviceMode !== 'mobile' ? () => <></> : DrawerComponent}