StreamingMedia causes Status bar to overlap the Header

Ionic Native
1

Hello,

I am having an issue with the StreamingMedia plugin.

When I play a video, and click “Done” to close the video player, the status bar in my app overlaps the header in all pages. If I rotate the device to switch the app to landscape mode, the overlapping gets fixed, even after I switch it back to Portrait.

I can assure that it’s not the header that is faulty, because I have a separate header on all pages.

The issue exists on iOS devices.

This is an urgent issue and I would really appreciate any help that I can get.

Thank you.

2

I had a similar issue, and found this workaround using the cordova-plugin-statusbar

In app.components.ts set:

import { StatusBar } from ‘@ionic-native/status-bar’;

statusBar.show();
statusBar.overlaysWebView(true);
statusBar.styleDefault();

Then add margin to your header scss class

margin-top: calc(env(safe-area-inset-top) + 1px);
margin-top: calc(constant(safe-area-inset-top) + 1px);