Skip to content

Commit 30de55b

Browse files
authored
Add screen sharing information to livestreams docs (#213)
## Description Add information about how to start livestream with screen sharing.
1 parent 4991cce commit 30de55b

File tree

2 files changed

+37
-1
lines changed

2 files changed

+37
-1
lines changed

docs/tutorials/livestreaming.mdx

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -174,6 +174,42 @@ We can now start sending media, which we can obtain from the user's camera, scre
174174
```
175175

176176
</TabItem>
177+
<TabItem value="screen" label="Screen Share">
178+
:::tip[Background streaming during screen sharing on iOS]
179+
180+
If you want to continue screen sharing when the app goes to the background, you need to:
181+
182+
1. Enable VoIP background mode by setting `enableVoIPBackgroundMode: true` in the plugin configuration or adding the VoIP background mode to your `Info.plist`
183+
2. Use the [`useCallKitService`](../../api/mobile/variables/useCallKitService) hook in your component to manage the CallKit session
184+
185+
See the [background calls documentation](./background-streaming) for detailed instructions and code examples.
186+
187+
:::
188+
189+
```tsx
190+
import React from 'react';
191+
192+
// All components and hooks needed for livestreaming can be imported from the livestream module
193+
import {
194+
LivestreamStreamer,
195+
useLivestreamScreenSharingStreamer
196+
} from '@fishjam-cloud/react-native-client/livestream';
197+
198+
const streamerToken = '';
199+
const roomId = '';
200+
const { connect, whipClientRef } = useLivestreamScreenSharingStreamer({ audioEnabled: true });
201+
202+
// ...
203+
204+
await connect(streamerToken);
205+
206+
// Render the livestream
207+
<LivestreamStreamer
208+
ref={whipClientRef}
209+
/>
210+
```
211+
212+
</TabItem>
177213
</Tabs>
178214

179215
</TabItem>

0 commit comments

Comments
 (0)