Skip to content

Multiline TextInput backgroundColor does not fully cover surface #4469

@donutdonate

Description

@donutdonate

Current behaviour

Multiline TextInput background color does not cover all the surface on iOS if background color have opacity.

Expected behaviour

Multiline TextInput background color should cover all the surface on iOS.

How to reproduce?

https://snack.expo.dev/@konstantin_bonn/textinput

Preview

Снимок экрана 2024-07-30 в 17 16 33

What have you tried so far?

Try to apply contentStyle with the same color, but it just got worse.
Works fine if comment background in this workaround for iOS

{!isAndroid && multiline && !!label && !disabled && (
          // Workaround for: https://github.com/callstack/react-native-paper/issues/2799
          // Patch for a multiline TextInput with fixed height, which allow to avoid covering input label with its value.
          <View
            testID="patch-container"
            pointerEvents="none"
            style={[
              StyleSheet.absoluteFill,
              dense ? styles.densePatchContainer : styles.patchContainer,
              {
                // backgroundColor:
                //   viewStyle.backgroundColor || containerStyle.backgroundColor,
                left: paddingLeft,
                right: paddingRight,
              },
            ]}
          />
        )}

Your Environment

software version
ios 17.2
react-native "0.73.6"
react-native-paper "^5.12.3"
node v20.5.0
yarn 1.22.19

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions