[BottomNavigation] Renders bottom empty space if tabstrip is not defined #7471
Description
Environment
- CLI: rc
- Cross-platform modules: rc
- Android Runtime: rc
- iOS Runtime: rc
Describe the bug
BottomNavigation component renders empty space at the bottom (where tabstrip would be) when no tabstrip is defined.
To Reproduce
Use the following xml declaration:
<BottomNavigation backgroundColor="yellow">
<!-- <TabStrip>
<TabStripItem title="First"></TabStripItem>
<TabStripItem title="Second"></TabStripItem>
<TabStripItem title="Third"></TabStripItem>
<TabStripItem title="Fourth"></TabStripItem>
</TabStrip> -->
<TabContentItem>
<GridLayout>
<!-- <Label text="First View" /> -->
<Button text="Go to fifth (no tabstrip item)" tap="onTap" />
</GridLayout>
</TabContentItem>
<TabContentItem>
<GridLayout>
<Label text="Second View" />
</GridLayout>
</TabContentItem>
<TabContentItem>
<GridLayout>
<Label text="Third View" />
</GridLayout>
</TabContentItem>
<TabContentItem>
<GridLayout>
<Label text="Fourth View" />
</GridLayout>
</TabContentItem>
<TabContentItem>
<GridLayout>
<Label text="Fifth View" />
</GridLayout>
</TabContentItem>
</BottomNavigation>Expected behavior
BottomNavigation should not render any empty space for missing TabStrip.
Additional context
Android screenshot:
iOS screenshot:
Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.