Question

我正在使用RNPickerSelect和自定义样式（使用styled-components/native）。但是，由于useNativeAndroidPickerStyle属性设置为false，所以太长的文本不会省略大小，而是向右移动。

将useNativeAndroidPickerStyle设置为true后，文本会变为椭圆大小，但样式会丢失。添加textInputProps={{numberOfLines: 1}}似乎也不能解决问题，因为它只是被忽略了。将numberOfLines属性添加到样式化的组件中，但是会引发错误，因为这不是样式化属性。

pickdr的编码如下

<RNPickerSelect
          placeholder={{
            label: `${i18n.t('selectABoard')}`,
            value: null,
          }}
          items={items}
          onValueChange={
            value => {
              if (value != null && value !== selected) {
                if (boards.find(board => board.name === value.name)) {
                  onBoardSelected(value);
                } else {
                  onCommitteeSelected(value);
                }
              }
            }
          }
          value={selected}
          style={stylesPicker}
          Icon={() => (
            <IconContainer>
              <Entypo
                name="chevron-down"
                color={colors.PRIMARY_BLUE}
                size={20}
              />
            </IconContainer>
          )}
          useNativeAndroidPickerStyle={false}
          textInputProps={{numberOfLines: 1}}
        />

const stylesPicker = StyleSheet.create({
  placeholder: {
    color: colors.PRIMARY_BLUE,
  },
  inputIOS: {
    color: colors.PRIMARY_BLUE,
    height: NAVBAR_HEIGHT,
    paddingLeft: 16,
    paddingRight: 16,
  },
  inputAndroid: {
    color: colors.PRIMARY_BLUE,
    height: NAVBAR_HEIGHT,
    paddingLeft: 16,
    paddingRight: 16,
  },
  iconContainer: {
    alignItems: 'center',
    height: NAVBAR_HEIGHT,
    justifyContent: 'center',
    paddingRight: 16,
  }
});

The whole text is "Nahual Prueba NGO - Finance Committee", the expected placeholder should be something like "Nahual Prueba NG..."

占位符不会使用react-native-picker-select椭圆化

0 个答案: