The following forum(s) are migrating to a new home on Microsoft Q&A (Preview): Developing Universal Windows apps!

Ask new questions on Microsoft Q&A (Preview).
Interact with existing posts until December 13, 2019, after which content will be closed to all new and existing posts.

Learn More

 none
[UWP] How to change the text of the Application Title bar? RRS feed

  • Question

  • Hi,

    I want to change the text of the application Title bar. Currently its the "AppName" we set in manifest. I want to show this in bar:

    AppName - RandomTextWhichMayChangeRunTime

    When I am do using 

    ApplicationView appView = ApplicationView.GetForCurrentView();
    appView.Title = "RandomTextWhichMayChangeRunTime";

    It displays this:

    RandomTextWhichMayChangeRunTime - AppName

    It is the swapped version which I need actually. App name is appended automatically but at the end, I need it in the beginning. 

    Photos app does it. It shows the "Photos - Imagename.jpg" at the top. I want to do it in the same way. 

    Then I searched more and tried this in App.xaml.cs OnLaunched:

    var coreTitleBar = CoreApplication.GetCurrentView().TitleBar; coreTitleBar.ExtendViewIntoTitleBar = true; AppTitleBar appbar = new AppTitleBar();

    Window.Current.SetTitleBar(appbar);

    AppTitleBar is a separate page defined like this:

     <Grid x:Name="AppTitleBar1" Background="Transparent" Height="40" Width="100" HorizontalAlignment="Left" VerticalAlignment="Center">
    
            <TextBlock x:Name="NameText" Text="Hello bro!" Foreground="Black"
                   Margin="44,8,0,0" HorizontalAlignment="Left" VerticalAlignment="Center"/>
        </Grid>
    But it just removes the default top bar with white screen and nothing else.

    Can you suggest how I can achieve it?

    Thanks.






    Tuesday, October 30, 2018 1:16 PM

All replies

  • Hi,

    You can customize the title bar to match the personality of your app. The title bar customization APIs let you specify colors for title bar elements(buttons, text), or extend your app content into the title bar area and take full control of it. Please refer to this document.

    For this issue, you opt for full customization via setting CoreApplicationViewTitleBar.ExtendViewIntoTitleBar property to true, Window.Current.SetTitleBar could not show the custom title for a separate page or UserControl, even the UIElement is instanced dynamically. You can either declare and set the title bar in a root page that doesn’t change, or declare and set a title bar region in each page that your app can navigate to, but you can’t set the title bar in app OnLauched method. Please see following code.

    App.xaml.cs

      protected override void OnLaunched(LaunchActivatedEventArgs e)
            {
                . . .
    
                // Hide default title bar.
                var coreTitleBar = CoreApplication.GetCurrentView().TitleBar;
                coreTitleBar.ExtendViewIntoTitleBar = true;
            }
    

    MainPage.Xaml

        <Grid x:Name="AppTitleBar" Background="Transparent">
            <!-- Width of the padding columns is set in LayoutMetricsChanged handler. -->
            <!-- Using padding columns instead of Margin ensures that the background
             paints the area under the caption control buttons (for transparent buttons). -->
            <TextBlock Text="Custom Title Bar" 
                       x:Name="TextAppTitle"
                   Style="{StaticResource CaptionTextBlockStyle}" 
                   Margin="12,8,0,0"/>
        </Grid>
    

    MainPage.Xaml.cs

            public MainPage()
            {
                this.InitializeComponent();
    
                Package package = Package.Current;
                var appName = package.DisplayName;
                TextAppTitle.Text = $"{appName} - RandomTextWhichMayChangeRunTime";
                Window.Current.SetTitleBar(AppTitleBar);
            }
    


    Best regards,

    Roy


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    Wednesday, October 31, 2018 7:56 AM
    Moderator
  • Hi Roy,

    Thanks for the details. 

    >> and set a title bar region in each page that your app can navigate to

    I have 2-3 pages in the app in which only page need to have this custom title bar. On rest of the pages, it should be default only. I need to ExtentViewIntoTitleBar to false-true-false-true when we switch to page? or something else as well I need to do?

    >>  you can’t set the title bar in app OnLauched method.

    Why is it so? 

    Thanks.

    Wednesday, October 31, 2018 8:21 AM
  • Hi,

    >>I have 2-3 pages in the app in which only page need to have this custom title bar. On rest of the pages, it should be default only. I need to ExtentViewIntoTitleBar to false-true-false-true when we switch to page? or something else as well I need to do?

    You need to move the coreTitleBar.ExtendViewIntoTitleBar property setting from OnLaunched method to each page constructor method. On the rest pages which you want to keep with default, set ExtendViewIntoTitleBar as false, or else set as true.

    >>Why is it so? 

    As mentioned in my last reply, Window.Current.SetTitleBar could not show the custom title for a separate page or UserControl, even the UIElement is instanced dynamically, it need to set a renderable  UIElement in page XAML file. So in app's OnLaunched , SetTitleBar method call with an UIElement as parameter which is defined in target page.

    Best regards,

    Roy


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    Thursday, November 1, 2018 9:20 AM
    Moderator