Customize React Native UI

You can customise different parts of the video UI by referring to the following examples:

Customize Participant List

The participant list is used for customizing the content of the container. Typically, the display of all action buttons against each participant name is configured using the participant list.

For example, you can add a button named Disconnect to disconnect a specific participant or add a Chat button to initiate a private chat with a specific participant.

Depending on the user's role (the user who sees the participant list), all or some of the added buttons are displayed.

For example, the Disconnect button is displayed only for a moderator because only the moderator can forcibly remove a participant from a session.

• an action button, add true for it.
• To configure multiple action buttons, pass the following array in setting:

participantOption=[ 
			{VIDEO: true},		// To enable hard stop Video
			{AUDIO: false},		// To enable hard mute Audio 
			{CHAT: true},		// To enable Private Chat
			{DISCONNECT: true},	// To enable force disconnect 
		]

Customize Features

The complete setting array will look like this:

setting: [
		/* Enable Tools in Bottombar */
		enxRequiredEventOption=[
			{AUDIO:true},{VIDEO:true},{SWITCH_CAMERA:true},{SWITCH_AUDIO:true},
			{GROUP_CHAT:true},{DISCONNECT:true},
			{MUTE_ROOM:true},{RECORDING:true},{SCREEN_SHARE:true},{ANNOTATION:true},
			{LOBBY:true},{REQUEST:true},
			{ROOM_SETTING:true},{POLLING:true},{QNA:true}
			{CUSTOM_BUTTON: true,imagePath: require('./image_asset/recording_on.png')}
			],
		participantOption= [ 
			{VIDEO: true},		// Enable hard stop Video
			{AUDIO: false},		// Enable hard mute Audio 
			{CHAT: true},		// Enable Private Chat
			{DISCONNECT: true},	// Enable force disconnect 
		]
	]

Monitoring Page Activities

Use OnPageSlide to track the opening and closing of pages, providing valuable insights into user interactions and engagement.

onPageSlide=(pageName,isShow)=>{
console.log(pageName+"page slide "+ isShow)}

Manage Send User Data over Session

Receive User data when any of the users sending the data in session.

onUserDataReceived=(data)=>{
console.log("userData Recieved App level"+{data})
}