Question 195135 in React native Question posted in
The official React Native documentation can be found here.

React native – React-Native App doesn't span the full width of the emulator

I’m learning React-Native and using the emulator.
Noticed that for some reason my app doesn’t span (see the attached emulator on the youtube course and mine on the left screen snapshot).
used width with percentage, used flex-direction used anything I could find on the web.
I’m suspecting it is just a display on the emulator but maybe it is not so I’m posting the question here.
Thanks

used width with the percentage used flex-direction used anything I could find on the web.
expected to see the orange box span the full width of the screen.

Tags:

2

Answers


  1. 0

    your problem is not much clear however if you want to create full width component. if you are using flex, you have to set all component’s width as 100% of it’s Root.

    if you no need to create flex just want to create view for full screen you can create like this

    <View style={{
    width:'100%'
}} >

</View

    but this may not work if your root component for this component has no full width.

    explain with your code snippets for more clear understand for others also.

    Login or Signup to reply.
  2. 0

    for this purpose the top most parent View should have the flex 1 so that it takes full width and height of the simulator. i used here a view as a child component . you can take any component, images or whatever you like.

    <View style={{flex: 1}}>
<View style={{width: '100%'}}>
</View>
</View>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search