Not work ClipPath/Path on Android

[eXist-FraGGer]

1.)

            <Svg width="200" height="150" viewBox="6 0 200 160" >
                <G>
                    <Defs>
                        <ClipPath
                            id="clip-path">
                            <Path d="M179.33,9.5H13.83S6.1,9.38,3.33,6.58A19,19,0,0,1,0,1.83V123.17A17.33,17.33,0,0,0,17.33,140.5h162a17.33,17.33,0,0,0,17.33-17.33V26.83A17.33,17.33,0,0,0,179.33,9.5Z"
                                fill="none" />
                        </ClipPath>
                    </Defs>
                    <G clipPath="url(#clip-path)">
                        <Image
                            width="240"
                            height="150"
                            href={this.props.image}/>
                    </G>
                </G>
            </Svg>
        </View>

2.) Run on ios - All good!

3.) Run on android - Does not work

Why ?

[SteveIb]

Can I use this.state.image instead of this.prop.image?
href={this.state.image}

[jeggy]

Did you find out why it's not working?

[logvi]

+1

[dusave]

If others are still having issues with this, please post your versions of react-native-svg, react-native, and android to help narrow down the problem.

[logvi]

@dustinsavery
"react-native-svg": "^6.0.0",
"react-native": "0.50.3",
android 5.1.1

clipPath prop for Image is not working. This is my code:

<Svg
  height="100"
  width="100"
>
<Defs>
   <ClipPath id="clip">
          <G>
             <Path d="M 50 100 A 50 50 0 0 0 50 0 L 50 50" />
          </G>
   </ClipPath>
</Defs>
<Image
   width="100%"
   height="100%"
   href={URL}
   clipPath="url(#clip)"
/>
</Svg>

[dusave]

@logvi thanks for posting, I'll take a look

[mleoanbarasan]

@dustinsavery I am also facing the same problem of ClipPath is not working in android, whereas it is working fine in iOS. Can you provide me the alternative or work around for this issue?

Awaiting for your reply.

[dusave]

I haven't had any success locating the source of the problem. I am no android expert though. Hopefully someone with more android experience can help here.

[gogolubev]

Same problem at 6.3.1 version. For iOS everything is fine, but on android ClipPath doesn't working. Is there some solution?

[AricWu]

Well,I have the same problem too,

           <G clipPath="url(#clip-path)">
                        <Image
                            width="240"
                            height="150"
                            href={this.props.image}/>
              </G>

working fine in iOS , And in android it does not work,
but I find that in Android you can write 'clipPath' in <Image/> and it work fine,

 <G >
                        <Image
                            width="240"
                            height="150"
                            href={this.props.image}
                            clipPath="url(#clip-path)"
                          />
 </G>

(This code work different in iOS)

The second code in Android it run good, but run different in iOS. I Because the origin point and Y-axis direction is different .
So I use first code in iOS and run second code in iOS ,then they work fine.

[msand]

I've fixed the transform handling for ClipPath on Android, and the spec conformance on both iOS and Android. Any help in testing would be much appreciated! msand@a1097b8