Thursday, May 2, 2024
HomeiOS DevelopmentReact-Native Modal behaving in a different way in iOS vs Android

React-Native Modal behaving in a different way in iOS vs Android


In my react-native app the modal opens up solely in few screens in iOS however all the mandatory screens in Android.

I’ve a navigator setup the next method

import { createStackNavigator } from '@react-navigation/stack';

const Stack = createStackNavigator();

perform SoupNavigator() {
    return (
        <Stack.Navigator >
            <Stack.Display title="marvel" element = {Marvel} />
            <Stack.Display title="dc" element = {DC}
                choices  = {{
                    title: null
                }}
            />
            <Stack.Display title="blade" element = {Blade} 
                choices  = {{
                    headerShown: false,
                    gestureEnabled: false
                }}
            />
        </Stack.Navigator>
    )
}

Throughout the Marvel element I’m returning a element that has the Modal like beneath

import { Modal }   from 'react-native';

class MarvelScreen extends React.Part {
    constructor (props) {
        tremendous (props);
        this.state = {
            showModal      : false,
        }
    }

    onModalDismiss = () => {
        this.setState({
            showModal: false,
        });
    }
    
    render () {
        return (
            <SafeAreaView type={Model.container}>
                <Modal              
                    animationType="slide"
                    clear={true}
                    seen={this.state.showModal}
                    presentationStyle="overFullScreen"
                >
                    <TouchableWithoutFeedback onPressOut={this.onModalDismiss}>
                        <View type={Kinds.container}>
                          {['Hello', 'Good day'].map((msg, idx) => {
                                return <Textual content key={idx} type={Kinds.textual content}>{msg}</Textual content>
                            })}
                        </View>
                    </TouchableWithoutFeedback>
                </Modal>
                <View>              
                </View>
            </SafeAreaView>
        )
    }
}

In Android the modal opens up after I’m within the following screens Marvel, DC, Blade.

In iOS it solely opens up after I’m in Marvel.

How do i get it to behave in iOS the identical method as in Android.



Supply hyperlink

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments