4

I am looking to change the colors of the title bar to better suit my app similar to what has been done in the Mail app. How would I go about doing that?

Rohit Rajendran
  • 629
  • 9
  • 27

3 Answers3

8

The background and foreground colors of parts of the TitleBar can be changed as follows.

ApplicationViewTitleBar titleBar = ApplicationView.GetForCurrentView().TitleBar;
titleBar.BackgroundColor = Colors.Black;
titleBar.ForegroundColor = Colors.White;
titleBar.ButtonBackgroundColor = Colors.Black;
titleBar.ButtonForegroundColor = Colors.White;

Be aware that these changes happen after the app has displayed so the user will see the colors change.

thomasforth
  • 665
  • 7
  • 13
  • It doesn't seem to be changing the color of the status bar on Windows 10 mobile. Do I have to do something different for that? – Rohit Rajendran Aug 17 '15 at 06:07
  • 2
    Not sure if still needed, but when you want to change the color of the statusbar, you'll need to add extra code. First see if you are on a Mobile family : `if(Windows.System.Profile.AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Mobile")` After that, grab the statusbar and set the ForegroundColor and BackgroundColo – Depechie Aug 18 '15 at 08:42
  • 4
    @Depechie Do not inspect the DeviceFamily; that is analytics information, not for programmatic decisions. To see if the status bar API is available (note: Status bar may be present on devices other than Mobile), use `Windows.Foundation.Metadata.ApiInformation.IsTypePresent("Windows.UI.ViewManagement.StatusBar")`. – Raymond Chen Sep 23 '15 at 05:08
  • @RaymondChen true... wasn't aware of that API info key until recently :) – Depechie Sep 23 '15 at 06:50
2

You can customize the background of the title bar by doing the following:

var appView = Windows.UI.ViewManagement.ApplicationView.GetForCurrentView();
var titleBar = appView.TitleBar;
titleBar.BackgroundColor = Colors.Black;

You can change the other colors of the title bar like the foreground color or the button colors by changing the color in the other properties.

Rohit Rajendran
  • 629
  • 9
  • 27
0

You can customize the buttons and title text by adding a extend view into the title bar. please find the code snippet for this.

private void ExtendViewOftitleBar()
{
        CoreApplication.GetCurrentView().TitleBar.ExtendViewIntoTitleBar = true;
        ApplicationView view = ApplicationView.GetForCurrentView();
        ApplicationViewTitleBar titleBar = view.TitleBar;
        view.SuppressSystemOverlays = true;
        titleBar.BackgroundColor = Windows.UI.Color.FromArgb(0, 0, 0, 0);
        titleBar.ForegroundColor = Windows.UI.Color.FromArgb(0, 0, 0, 0);
        titleBar.InactiveBackgroundColor = Windows.UI.Color.FromArgb(0, 0, 0, 0);
        titleBar.InactiveForegroundColor = Windows.UI.Color.FromArgb(0, 0, 0, 0);
        titleBar.ButtonBackgroundColor = Windows.UI.Color.FromArgb(0, 0, 0, 0);
        titleBar.ButtonHoverBackgroundColor = Windows.UI.Color.FromArgb(0, 0, 0, 0);
        titleBar.ButtonPressedBackgroundColor = Windows.UI.Color.FromArgb(0, 0, 0, 0);
        titleBar.ButtonInactiveBackgroundColor = Windows.UI.Color.FromArgb(0, 0, 0, 0);

}

Ajaya Nayak
  • 93
  • 6