如何在expo中的borderColor上添加线性渐变颜色本机反应？

问题描述

在边框上添加线性渐变颜色 我想知道如何在样式表中使用线性渐变。

 borderColor:['color1',color2]

解决方法

enter image description here 请检查输出图像

首先创建一个新按钮：

<TouchableOpacity 
onPress={() => {})}
style={styles.buttonContainer}>
<Text style={style.buttonText}>Login</Text>

样式：

 buttonContainer: {
    width: 200,alignItems: 'center',},buttonText: {
    textAlign: 'center',color: '#4C64FF',padding: 15,width: 200
}

从安装react-native-linear-gradient软件包开始

<LinearGradient
      colors={['#00FFFF','#17C8FF','#329BFF','#4C64FF','#6536FF','#8000FF']}
      start={{x: 0.0,y: 1.0}} end={{x: 1.0,y: 1.0}}
      style={{ height: 48,width: 200,justifyContent: 'center',width: 200}}
    >

有关更多信息：https://codeburst.io/linear-gradient-for-border-color-in-react-native-5bcab3eea1c9

,

为了添加线性渐变，首先运行squeue

然后为了添加水平渐变

expo add expo-linear-gradient

对于垂直渐变

 <LinearGradient
            start={[0,1]}
            end={[1,0]}
            colors={[color1,color2]}
          />