Xamarin forms, UWP Windows 10 App, TitleBar and Status bar customization

Customize the title bar of your Universal App for Windows 10 is quite easy, but you need to write different code for PC and Mobile. The class that allows you to customize the title bar:

  • when running on a PC is called TitleBar
  • when running on a Mobile is called StatusBar

Before to call the API you first need to check if it exists (true if you are running on that platform):

//PC customization
if (ApiInformation.IsTypePresent(
                   "Windows.UI.ViewManagement.ApplicationView"))
{
    var titleBar = ApplicationView.GetForCurrentView().TitleBar;
    if (titleBar != null)
    {
        titleBar.ButtonBackgroundColor = Colors.DarkBlue;
        titleBar.ButtonForegroundColor = Colors.White;
        titleBar.BackgroundColor = Colors.Blue;
        titleBar.ForegroundColor = Colors.White;
    }
 }

//Mobile customization
if (ApiInformation.IsTypePresent("Windows.UI.ViewManagement.StatusBar"))
{

    var statusBar = StatusBar.GetForCurrentView();
    if (statusBar != null)
    {
        statusBar.BackgroundOpacity = 1;
        statusBar.BackgroundColor = Colors.DarkBlue;
        statusBar.ForegroundColor = Colors.White;
    }
}

You could receive an error

StatusBar doesn't exist in context

You resolve it to add in the reference for UWP project Windows Mobile Extensions for the UWP and Windows Desktop Extensions for the UWP.

Extensions

Happy coding!

How to deploy an Universal Windows Project on real device mobile?

I'm trying to debbuging my app on real device (lumia 830 with windows 10 mobile 10.0.10581.0) Developer Mode is ON on both devices (mobile and PC), but when I'm deploying my app on my device I've got an error (DEP6100 and DEP6200). Howevere i can easily emulate on emulators and my PC, couldn’t understand whats the problem.

I googled a bit and I discovered how to resolve the problem.

Visual-Studio-2105-Deploy-Real-Device

  • Create a Registry Key in: [HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\SirepClient] (Probably you will need to create it)
  • Create a dword with name "DisableProtocol3" and value 00000001
  • Restart Visual Studio and try deploying the solution back again.

It's a provisional solution meanwhile a patch is included in Windows 10 mobile. We will have to consider deleting this key after that.

If you want to inspect your device, connect your device via USB and open a browser and type

https://127.0.0.1:10443

And you can watch your device in action!

Windows 10 Device – Home

Windows-10-Device-Home

Windows 10 Device – App Manager

Windows-10-Device-AppManager

Windows 10 Device – File Explorer

Windows-10-Device-FileExplorer

Windows 10 Device – Processes

Windows-10-Device-Processes

Windows 10 Device – Performances (in real time!)

Windows-10-Device-Performances

Advertsing

125X125_06


Subscribe to our mailing list

* indicates required


TagCloud

MonthList

CommentList