react native nativewind open dialog on center

Question

I'm making a form and I have a button that I need to open a popup with information in the center of the app, but I can't imagine how to do this, could anyone help me?

my main:

import { Image, View, ScrollView } from "react-native"

import { Input } from "@/components/Input"
import { Button } from "@/components/Button"

export function Main() {
    return (
        <View className="flex flex-1 flex-col space-between bg-slate-700">

        <View className="flex justify-center ">
            <View className="flex items-center">
                <Image  className="mt-10" source={require("@/assets/banner.png")}/>
            </View>
        </View>

        <View className="flex flex-1  pt-4">
            <ScrollView className="flex px-10">
                <Input placeholder="field_one" inputClasses="mb-6" label="field_one" />
                <Input placeholder="field_two" inputClasses="mb-6" label="field_two" />
                <Input placeholder="field_three" inputClasses="mb-6" label="field_three" />
            </ScrollView>
         </View>


        <View className="flex justify-center ">
            <View className="flex py-10 px-10">
                <Button label="Open Modal" labelClasses="text-indigo-950" onPress={() => console.log("implement")} />
            </View> 
        </View>

        </View>
    )

}

this is my app:

but I can't imagine how to make a dialog (modal) open in the center of the app.

like this: