透明 React Native 與 Expo

Question

我在 React Native Expo 中的視圖透明度有問題，在視圖中我有文本，但這在 iphone 設備和 androids 上看不到，文本是透明的，但這不是我想要的。

代碼：

<View style= {{paddingHorizontal:30, borderRadius:1, marginTop:5}}>
        <View style={{alpha = 1.0, alignItems:'center', borderRadius:10, backgroundColor: 'white', alignContent:'center', paddingVertical:10}}>
          <Text style={{fontSize:15, color:'white', fontWeight: 'bold'}}>Iniciar Sesión</Text>
        </View>
      </View>

我想做什么：在此處輸入圖片說明

我得到了什么：在此處輸入圖像描述

Answer 1

樣式上的alpha應用於整個視圖，因此也會導致所有子組件變得透明。 您只想將 alpha 應用於父視圖的背景顏色。 在 react-native 中，您可以通過定義 backgroundcolor rgba 格式來實現

可以找到顏色文檔https://reactnative.dev/docs/colors

這是展示這種行為的世博小吃。 https://snack.expo.io/sl8VafHil