Add fixed color in LinearGradient using react-native-svg

Question

I am workign on a Svg component where i'm using LinearGradient from react-native-svg. I want to used fixed colors on stop points. But using LinearGradient, it's not being possible to do that. How can i add fixed color and achieve something like this:

Here's my current code for this Svg:

<Svg width={svgSize} height={svgSize}>
        
    <LinearGradient
      id="gradient"
      start={{x: 0.0, y: 0.0}} end={{x: 1.0, y: 1.0}}
    >
       <Stop offset="0%" stopColor= 'green' stopOpacity= {1}/>
       <Stop offset="50%" stopColor= 'red'  />
       <Stop offset="100%" stopColor= 'blue'  />
    </LinearGradient>

    <Path
      strokeWidth={strokeWidth}
      stroke="url(#gradient)"
      d={`M${startPoint.x},${startPoint.y} A ${radius},${radius},0,${startRadian - openingRadian >= Math.PI ? '1' : '0'},1,${endPoint.x},${endPoint.y}`}
    />
    <Path
      strokeWidth={strokeWidth}
      stroke="url(#gradient)"
      fill="none"
      d={`M${startPoint.x},${startPoint.y} A ${radius},${radius},0,${startRadian - currentRadian >= Math.PI ? '1' : '0'},1,${curPoint.x},${curPoint.y}`}
    />
    <Circle
      cx={curPoint.x}
      cy={curPoint.y}
      r={buttonRadius}
      fill={buttonFillColor || buttonBorderColor}
      stroke={buttonBorderColor}
      strokeWidth={buttonStrokeWidth}
      {...this._panResponder.panHandlers}
    />
 </Svg>

I just need help with the LinearGradient fixed color set part. How can i achieve that?