Skip to content

<Modal /> doesn't handle screen sizes and orientations properly #7708

@satya164

Description

@satya164

So today I was trying to refactor my code to migrate from a custom imperative Modal API to React Native's <Modal /> and found some issues which made me write my own component in JS instead.

  • Modal's height doesn't include the statusbar, so when the app has a translucent statusbar, Modal is drawn under the statusbar and there's empty space left at the bottom
  • Modal is not responsive to orientation, even if the device is in landscape mode, Modal is drawn according to potrait mode, so it kinda covers half the screen and the bottom part gets hidden
  • It would be nice if the native Modal could respond to screen size and orientation change like a JS based Modal does
  • With the slide animation, the animating Modal has a strip at the top which resembles the statusbar for some reason

Metadata

Metadata

Assignees

No one assigned

    Labels

    Good first issueInterested in collaborating? Take a stab at fixing one of these issues.Help Wanted :octocat:Issues ideal for external contributors.Resolution: LockedThis issue was locked by the bot.

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions