-
Notifications
You must be signed in to change notification settings - Fork 42
Open
Description
Problem is when i use multiple or single SpatialNavigationVirtualizedlist then this element height size consume full screen
Screenhot
Code :
{/* Main Content */}
<SpatialNavigationRoot
isActive={!isMenuOpen}
onDirectionHandledWithoutMovement={(dir) => {
if (dir === 'left') setIsMenuOpen(true);
}}
>
<SpatialNavigationNode direction='vertical'>
{/* --- FIRST ROW --- */}
<SpatialNavigationView
>
<SpatialNavigationVirtualizedList
data={[1, 2, 3, 4, 5, 6]}
orientation="horizontal"
itemSize={420}
style={{
backgroundColor: 'green',
}}
renderItem={(item, index) => (
<SpatialNavigationFocusableView
style={{
marginHorizontal: 10,
backgroundColor: 'red',
borderRadius: 10,
}}>
{({isFocused})=>(
<SpatialNavigationView
style={{
borderWidth:isFocused? 1:0,
borderColor: 'white',
height: 200,
width: 400,
justifyContent: 'center',
alignItems: 'center',
}}>
<Image
source={{
uri: 'https://img.uxcel.com/cdn-cgi/image/format=auto/tags/thumbnail-1706285994493-2x.jpg',
}}
style={{ height: 100, width: 100 }}
/>
</SpatialNavigationView>
)}
</SpatialNavigationFocusableView>
)}
/>
</SpatialNavigationView>
<SpatialNavigationView
>
<SpatialNavigationVirtualizedList
data={[1, 2, 3, 4, 5, 6]}
orientation="horizontal"
itemSize={420}
style={{
backgroundColor: 'white',
}}
renderItem={(item, index) => (
<SpatialNavigationFocusableView
style={{
marginHorizontal: 10,
backgroundColor: 'gray',
borderRadius: 10,
}}>
{({isFocused})=>(
<SpatialNavigationView
style={{
borderWidth:isFocused? 1:0,
borderColor: 'white',
height: 200,
width: 400,
justifyContent: 'center',
alignItems: 'center',
}}>
<Image
source={{
uri: 'https://img.uxcel.com/cdn-cgi/image/format=auto/tags/thumbnail-1706285994493-2x.jpg',
}}
style={{ height: 100, width: 100 }}
/>
</SpatialNavigationView>
)}
</SpatialNavigationFocusableView>
)}
/>
</SpatialNavigationView>
</SpatialNavigationNode>
</SpatialNavigationRoot>
Metadata
Metadata
Assignees
Labels
No labels