我无法让影子在我的搜索栏上工作

Question

我的搜索栏周围没有阴影。我正在使用反应原生元素搜索栏，可以在这里找到here。我正在按照下面的代码显示的方式实现它。我假设我的 containerStyle 是你们需要看的。

非常感谢您的任何见解。我比你知道的更感激它。

 <View style={{ justifyContent: 'center', alignItems: 'center', }}>
          <SearchBar
            placeholder="Search..."
            onChangeText={this.updateSearch}
            value={search}
            round="true"
            containerStyle={styles.searchBarContainer}
            inputContainerStyle={{
              height: scale(45),
              width: scale(200),
              backgroundColor: '#FFFFFF',
              borderRadius: 10
              
            }}
            searchIcon={() => (
              <MaterialCommunityIcons
                name="glass-mug-variant"
                size={25}
                color="#87909A"
              />
            )}
            clearIcon="null"
          />
          </View>

const styles = ScaledSheet.create({
    searchBarContainer: {
      textShadowOffset: { width: 1, height: 1 },
      textShadowRadius: 2,
      textShadowColor: 'black',
      backgroundColor: '#d1cfcf',
      borderBottomColor: 'transparent',
      borderTopColor: 'transparent',
      paddingRight: scale(20),
      paddingLeft: scale(20),
             
    },
})

Answer 1

替换这一行backgroundColor: '#FFFFFF' 到这个 backgroundColor: '#e0dbdb' 或使用颜色选择器找到您选择的颜色的十六进制代码。