[Tizen] App shows blank screen when wrap app with UI lib
Closed this issue · 0 comments
nttung291 commented
Describe the bug
I'm using Samsung TV tizen version 3.0 and I have an issue with my app when I used react-native-paper UI provider
It shows black blank screen when I wrap app in Provider of react-native-paper like this
It's working with simulator but happen on real TV device. There's no error return or logs
import { Provider as PaperProvider } from "react-native-paper";
<PaperProvider>
<AppContextContainer>
<View style={theme.styles.wrapper}>
<ScrollView
style={theme.styles.scrollView}
contentContainerStyle={theme.styles.container}
>
<StatusBar
backgroundColor={theme.styles.container.backgroundColor}
barStyle={dark ? "light-content" : "dark-content"}
/>
<Image
style={theme.styles.image}
source={ICON_LOGO}
{...testProps("template-starter-home-screen-renative-image")}
/>
<Text
style={theme.styles.textH2}
{...testProps(
"template-starter-home-screen-welcome-message-text"
)}
>
{CONFIG.welcomeMessage}
</Text>
<Text
style={theme.styles.textH2}
{...testProps("template-starter-home-screen-version-number-text")}
>
v {packageJson.version}
</Text>
{isClient ? (
<Text style={theme.styles.textH3}>
{`platform: ${Api.platform}, factor: ${Api.formFactor}, engine: ${Api.engine}`}
</Text>
) : null}
<Text style={theme.styles.textH3}>{`hermes: ${
typeof HermesInternal === "object" && HermesInternal !== null
? "yes"
: "no"
}`}</Text>
<Text
style={theme.styles.textH3}
>{`pixelRatio: ${pixelRatio}, ${fontScale}`}</Text>
<TouchableOpacity
ref={buttonRef}
onPress={toggle}
onFocus={() => setIsFocused(true)}
onBlur={() => setIsFocused(false)}
style={[
theme.styles.button,
isFocused && { ...theme.styles.focusedButton, outline: "none" },
]}
// Set the initial AndroidTV and tvOS focus to be on the button
hasTVPreferredFocus
// On AndroidTV going up can appear as lost focus, so block focus up
nextFocusUp={findNodeHandle(buttonRef.current) || undefined}
{...testProps("template-starter-home-screen-try-my-button")}
>
<Text style={theme.styles.buttonText}>Try me!</Text>
</TouchableOpacity>
</ScrollView>
</View>
</AppContextContainer>
</PaperProvider>
To Reproduce
Steps to reproduce the behavior:
- Create rnv project
- Install react-native-paper library
- Wrap app with Provider of react-native-paper in app.tsx
RNV versions: 1.0.0-rc21, 1.5,0, 1.7.0-rc0 (I tried on these 3 versions)
Node: v20