Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

zIndex breaking in Animated.View #74

Open
peto59 opened this issue Mar 14, 2023 · 0 comments
Open

zIndex breaking in Animated.View #74

peto59 opened this issue Mar 14, 2023 · 0 comments

Comments

@peto59
Copy link

peto59 commented Mar 14, 2023

I have multiple dropdowns in my scroll view

<KeyboardAwareScrollView
      style={{ backgroundColor: "#fff" }}
      contentContainerStyle={{ alignItems: "center", justifyContent: "center", flexGrow: 1 }}
      keyboardShouldPersistTaps="always"
>
dropdown1
dropdown2
dropdown3
dropdown4
<Animated.View style={{ height: specificZameranieOpacity, opacity: specificZameranieOpacity }} >
                        <AutocompleteDropdown
                            clearOnFocus={false}
                            closeOnBlur={false}
                            controller={controller => {
                                zameraniaMainController.current = controller;
                            }}
                            onChevronPress={() => {
                                if (zameraniaMain == null) {
                                    setZameraniaMain(vars.zamerania);
                                    if (zameraniaMainController != null) {
                                        zameraniaMainController.current.open();
                                    }
                                } else {
                                    if (zameraniaMainController != null) {
                                        zameraniaMainController.current.close();
                                    }
                                }
                            }}
                            onSelectItem={setSelectedItemMainZamerania}
                            dataSet={zameraniaMain}
                            showClear={true}
                            showChevron={true}
                            suggestionsListMaxHeight={Dimensions.get('window').height * 0.2}
                            onChangeText={getSuggestionsZameraniaMain}
                            suggestionsListContainerStyle={{
                                minWidth: Dimensions.get('window').width * 0.75,
                                maxWidth: Dimensions.get('window').width * 0.75,
                            }}
                            emptyResultText={"Zameranie nenájdené"}
                            textInputProps={{
                                placeholder: "Najbližšie zameranie",
                                editable: selectedItemZamerania != null ? selectedItemZamerania.title == "Iné" : false,
                            }}
                            inputContainerStyle={{
                                minWidth: Dimensions.get('window').width * 0.75,
                                maxWidth: Dimensions.get('window').width * 0.75,
                            }}
                        />
                        <TextInput/>
                    </Animated.View>
//more code

Each dropdown that is direct descendant of KeyboardAwareScrollView works perfectly fine
The one in Animated.View displays it's dropdown under elements that are under it. If I add zIndex to Animated.View it breaks scrolling for the given dropdown.
If I add zIndex to the dropdown in Animated.View nothing changes. I tried multiple combinations and nothing works. Can you help me figure out what am I doing wrong?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant