UWP pop-up box screen adaptation problem, uwp pop-up screen adaptation problem

UWP pop-up box screen adaptation problem, uwp pop-up screen adaptation problem

In the message prompt box (2) in UWP last time, we talked about the problem that the pop-up box is blocked on the mobile phone in the virtual navigation bar. Today we are talking about it.

The width and height specified for the user control last time are windows. current. bounds width and height, and the obtained Rect value contains the height and width of the application window (in the unit of valid (View) pixels, the height of the status bar and virtual Navigation Bar on the mobile phone is also included, so it is not so accurate to set the width and height of some controls through this width and height.

In fact, there is another API: Windows. UI. viewManagement. applicationView. getForCurrentView (). visibleBounds, VisibleBounds, as its name implies, is a visible area for obtaining the window (application view). The height of the status bar and virtual navigation bar is not included on the mobile phone, therefore, this API may be better suited to the need to place buttons at the bottom of the screen for some pop-up windows.

However, only specify the window width and height as Windows. UI. viewManagement. applicationView. getForCurrentView (). there is still a problem with the width and height obtained by VisibleBounds. When Popup is displayed, the default anchor is the top left corner of the screen (the status bar is not excluded ), therefore, when the status bar is displayed, the bottom height is on the top. You also need to set a Margin from the top Margin to the height of the status bar. Do not forget that the mobile phone in the virtual navigation bar can hide and display the virtual navigation bar. Therefore, you must subscribe to the VisibleBoundsChanged event.

Let's take a look at the code. To Modify the last code, you need to specify the width and height in the user control structure and the visible zone width and height change time zone. Therefore, write a method:

 private void MeasurePopupSize()        {            this.Width = Windows.UI.ViewManagement.ApplicationView.GetForCurrentView().VisibleBounds.Width;            double marginTop = 0;            if (Windows.Foundation.Metadata.ApiInformation.IsTypePresent("Windows.UI.ViewManagement.StatusBar"))                marginTop = Windows.UI.ViewManagement.StatusBar.GetForCurrentView().OccludedRect.Height;            this.Height = Windows.UI.ViewManagement.ApplicationView.GetForCurrentView().VisibleBounds.Height;            this.Margin = new Thickness(0, marginTop, 0, 0);        }

Structure changed:

 private MessagePopupWindow()        {            this.InitializeComponent();            m_Popup = new Popup();            Windows.UI.ViewManagement.ApplicationView.GetForCurrentView().VisibleBoundsChanged += (s,e)=>            {                MeasurePopupSize();            };            MeasurePopupSize();            m_Popup.Child = this;            this.Loaded += MessagePopupWindow_Loaded;            this.Unloaded += MessagePopupWindow_Unloaded;        }

The sample code is also updated, welcome to the https://github.com/kkkeyboy/UWPPopup