siemiatj / react-native-modal-dropdown

Fork of the original https://github.com/sohobloo/react-native-modal-dropdown
MIT License
118 stars 98 forks source link

Pressing on dropdown crashing app [IOS only] #38

Closed bulent-eroglu closed 3 years ago

bulent-eroglu commented 3 years ago

Whenever I press on the selector the app crashes

Error: scrollToIndex should be used in conjunction with getItemLayout or onScrollToIndexFailed, otherwise there is no way to know the location of offscreen indices or handle failures.

Code:

<ModalDropdown
        ref={(el) => (dropDownRef = el)}
        onDropdownWillShow={() => setDropdownOpen(true)}
        onDropdownWillHide={() => setDropdownOpen(false)}
        onSelect={(index, value) => onSelect(index, value)}
        defaultIndex={initialIndex}
        scrollEnabled={false}
        defaultValue={options[initialIndex]}
        showsVerticalScrollIndicator={false}
        renderRowProps={{ underlayColor: 'lightgray' }}
        renderRow={(option, index, isSelected) => {
          return (
            <Box margin="l" flexDirection="row">
              <Box
                alignItems="center"
                justifyContent="center"
                borderRadius={12.5}
                width={25}
                height={25}
                borderWidth={1}
                borderColor="primaryTextColor">
                {isSelected && (
                  <Box
                    borderRadius={9}
                    backgroundColor="primaryTextColor"
                    width={18}
                    height={18}
                  />
                )}
              </Box>
              <Box marginLeft="m" position="relative">
                <Text variant="header4">
                  {option}
                </Text>
              </Box>
            </Box>
          )
        }}
        textStyle={[
          header ? theme.textVariants.header : theme.textVariants.body,
          {
            color: theme.colors.primaryTextColor,
            fontSize: header ? 34 : 16,
            alignSelf: 'flex-start',
          },
        ]}
        options={options}
        dropdownStyle={{
          borderWidth: 0,
          shadowColor: theme.colors.shadowColor,
          elevation: theme.dropShadowCard.elevation,
          shadowOffset: theme.dropShadowCard.shadowOffset,
          shadowOpacity: theme.dropShadowCard.shadowOpacity,
          borderRadius: theme.borderRadius.s,
          height: measurements ? 95 * options.length : 75 * options.length,
        }}
        renderSeparator={() => {
          return (
            <Box
              marginHorizontal="l"
              height={0.5}
              backgroundColor="borderColor"
            />
          )
        }}
        style={{ backgroundColor: 'transparent' }}
      />

image

iam-manikandan commented 3 years ago

@bulent-eroglu Hi, I am facing exactly the same issue. Please let me know how you solved the issue?

bulent-eroglu commented 3 years ago

@bulent-eroglu Hi, I am facing exactly the same issue. Please let me know how you solved the issue?

Hi, I solved it by using react-native-modal-dropdown-v2 instead so do npm i react-native-modal-dropdown-v2" and import ModalDropdown from 'react-native-modal-dropdown-v2' try that - hope it helps

iam-manikandan commented 3 years ago

@bulent-eroglu Hi, I am facing exactly the same issue. Please let me know how you solved the issue?

Hi, I solved it by using react-native-modal-dropdown-v2 instead so do npm i react-native-modal-dropdown-v2" and import ModalDropdown from 'react-native-modal-dropdown-v2' try that - hope it helps

thank you, let me try👍🏻

Deep-CB commented 3 years ago

@bulent-eroglu Hi, I am also facing exactly the same issue. Please let me know how you solved the issue?

for Ios Platform ERROR Invariant Violation: scrollToIndex should be used in conjunction with getItemLayout or onScrollToIndexFailed, otherwise there is no way to know the location of offscreen indices or handle failures.

98rahul commented 1 year ago

@bulent-eroglu Hi, I am facing exactly the same issue. Please let me know how you solved the issue?

Hi, I solved it by using react-native-modal-dropdown-v2 instead so do npm i react-native-modal-dropdown-v2" and import ModalDropdown from 'react-native-modal-dropdown-v2' try that - hope it helps

i was also facing the same issue with android-app RN-0.71.1 and "react-native-modal-dropdown": "^1.0.1", @bulent-eroglu Appreciate!