mybigday
Support on Expo?
Wondering how to use this module in Expo? Would be great if there could have a simple example.
It may be work with own build dev-client, or bare workflow. I'd happy to accepted a PR for add an example if anyone can try it out.
.I installed it with eas local building, it's surprisingly painless, I used https://github.com/mybigday/react-native-external-display/blob/master/packages/RNExternalDisplayExample/src/Touch.js to make a local testing, removed a bunch of unrelated packages like react-native-gesture-handler. it surprisingly works, I didn't change much code.
it works instantly on my machine, I only tested it on android tho
import ExternalDisplay, { useExternalDisplay } from 'react-native-external-display';
const screens = useExternalDisplay({
onScreenConnect: () => {
Alert.alert('Display connected');
},
onScreenChange: () => {
Alert.alert('Display disconnected');
},
onScreenDisconnect: (error) => {
Alert.alert('Display error', error);
}
});
const isScreenConnected = Object.keys(screens).length > 0;
const externalScreen = Object.keys(screens)[0];
{isScreenConnected && (
<ExternalDisplay
mainScreenStyle={{ flex: 1 }}
fallbackInMainScreen={false}
screen={externalScreen}
>
<View
style={{
flex: 1,
justifyContent: 'center',
alignItems: 'center',
}}
>
<SecondaryScreen /> // ur component (UI)
</View>
</ExternalDisplay>
)}
This is a sample working code for an Expo app (client dev, you have to rebuild eas else u will get error "TypeError: Cannot read property 'getInitialScreens' of null, js engine: hermes") It took me quite some time to study the Presentation API and Display Manager. However, I was stuck on integrating the feature into my Expo app using expo module. Fortunately, I found this module, which saved me a lot of time. Much appreciated!
