search

AgoraIO-Extensions / react-native-agora

React Native around the Agora RTC SDKs for Android and iOS agora
https://www.agora.io
MIT License
620 stars 227 forks source link

Rounded Corners? #782

Closed AB-70 closed 2 months ago

AB-70 commented 4 months ago

Is there any way to get rounded corners on android for the RTC Surface View?

I've tried so many ways, including overflow: hidden on parent, masked view (from react-native-community package), and none of them seem to work.

The video is always rendered with sharp corners and this doesn't align with my app's theme.

Any help in this regard will be appreciated.

Using react native 0.73.5 React Native Agora: 4.3.0

guoxianzhe commented 4 months ago

@AB-70 Thanks for your PR, we will make a fully test and release it in the future , maybe in 4.4.0.

BTW you can use RTCTextureView to get rounded corners.

guoxianzhe commented 2 months ago 
<View style={{ flex: 1, borderRadius: 50, overflow: 'hidden' }}>
  <RtcSurfaceView style={{ flex:1 }}/>
</View>

Without native side changes, I use these simple code can make borderRadius happen(tested in Android and iOS), so I will not add this in sdk. So If you still get problems we can look into them again.

image image