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>