如何实现instagram故事线性梯度反应本机

Question

我想在没有动画的情况下实现下面的示例，但是我在这里遇到的困难是我到目前为止所拥有的。

我想要什么：

代码：

<LinearGradient colors={['#403B4A', '#4AAE9B', '#603813']} style={{ width: 82, height: 82, borderRadius: 83 / 2 }}>
                            <Image
                                source={{ uri: item.image }}
                                style={{
                                    width: 80,
                                    height: 80,
                                    borderRadius: 80 / 2,
                                    padding: 10,
                                }}
                                resizeMode="cover"
                            />
                        </LinearGradient>

Answer 1

<LinearGradient
  colors={['#CA1D7E', '#E35157', '#F2703F']}
  start={{x: 0.0, y: 1.0}} end={{x: 1.0, y: 1.0}}
  style={{ height: 82,width: 82,alignItems: 'center',justifyContent: 'center',borderRadius:82 / 2}}>
     <Image source={{ uri: item.image }} style={{width: 75,height: 75,borderRadius: 75/2,alignSelf: 'center',borderColor: '#fff',borderWidth: 3}}/>
</LinearGradient>