react-native-agora icon indicating copy to clipboard operation
react-native-agora copied to clipboard

How to add borderRadius to RtcLocalView.SurfaceView ?

Open emmanuel-D opened this issue 3 years ago • 4 comments

How to add borderRadius to RtcLocalView.SurfaceView in React Native ? I tried the following code, but the video is still square without rounded border :

<RtcLocalView.SurfaceView
    channelId={roomParticipant.roomId}
    renderMode={VideoRenderMode.Hidden}
    zOrderMediaOverlay={false}
    zOrderOnTop={false}
    style={{width: 65, height: 65, borderRadius: 55}}
/>

emmanuel-D avatar Feb 27 '22 16:02 emmanuel-D

pls try textureview on Android

LichKing-2234 avatar Mar 04 '22 02:03 LichKing-2234

Yess, this works on Android. But on iOS, the RtcLocalView.TextureView is not allowed (Also mentioned in Agora docs).

emmanuel-D avatar Mar 06 '22 09:03 emmanuel-D

You can check the platform and use the different widgets.

LichKing-2234 avatar Mar 09 '22 07:03 LichKing-2234

use overflow: hidden and borderRadius on SurfaceView style object

yogeshydvme avatar Jun 01 '22 11:06 yogeshydvme