Creating a half-white background for an image in React native ( style question)

The text in my image is displayed but difficult to read because of the dark color of the said image. In order to solve the issue of the color of the text (it must be black), I was thinking of whitening the image. Do you have any solutions? I think I must insert something in a second && but not sure what.

Here is my code :

          const [show, setShow] = useState(false);

   ...

          <View
            style={{
              flex: 7.5,
              justifyContent: "center",
            }}
          >
            <div
              onMouseEnter={() => {
                setShow(true);
              }}
              onMouseLeave={() => setShow(false)}
            >
              {show && (
                <Text
                  style={{
                    zIndex: 15,
                    fontSize: 20,
                    fontWeight: "600",
                    color: "black",
                    position: "absolute",
                    top: 50,
                    right: 250,
                  }}
                >
                  SENSE
                </Text>
              )}
              {show && (
                <Text
                  style={{
                    zIndex: 15,
                    fontSize: 20,
                    fontWeight: "400",
                    color: "black",
                    position: "absolute",
                    top: 100,
                    right: 200,
                    width: 200,
                  }}
                >
                  The small investment research platform
                </Text>
              )}
              <Image
                source={screen2}
                style={{
                  width: "80%",
                  height: "80%",
                  marginBottom: 258,
                  marginTop: 12,
                  marginLeft: "-10%",
                }}
              />
            </div>
          </View>