Actipro WPF Controls v2020.1 development is in progress, and the new version’s main goals are to modernize our UI control features/themes, and make theme customization much easier.

In the previous post, we saw how WindowChrome supported placing a Menu in a Window title bar to maximize window real estate.  In today’s post, we’ll look at an advanced concept of being able to extend Window.Content up into the title bar area.

Title Bar Merge Kinds

Some modern apps have a more stylized design for their windows and don’t wish to have a traditional window title bar appearance.  This is often achieved by merging portions of the window’s content into the title bar area.  New WindowChrome features offer three kinds of merge options.

A merge kind of BackgroundOnly moves the Window.Background fill to cover the title bar background, while keeping the actual Window.Content in its normal location. A merge kind of ContentOnly (used in the sample below) keeps the Window.Background fill where it normally is, but moves the Window.Content to extend over the title bar background. Finally, a merge kind of Full moves both the Window.Background and Window.Content will extend over the title bar background.

Title Bar Merge Example

In this sample, we've merged the content area of the window up into the title bar. The content area contains the left column and the Actipro logo that you see visible in the title bar area. A special property on WindowChrome prevents the centered title bar text from ever covering the left column.

This sample also shows off how new read-only attached WindowChrome properties can be examined on a window to return the height of the title bar, as well as the left and right title bar content widths. In this sample, there is nothing in the left title bar area since the icon is hidden. However the three title bar buttons (minimize, maximize, close) do contribute width in the right title bar area. The final resolved values for these widths and heights can be retrieved and used to help when positioning elements within the window that may overlap the title bar, or that may want to be lined up with elements in the title bar.

Hit Testing

When covering the title bar with Window.Content, it’s important that Windows can still hit test title bar regions in the window so that it can be dragged properly.  We provide an attached property that allows non-client window hit testing to traverse through any WPF element, thereby allowing special elements to be designated as a “title bar” in Windows’ eyes. 

In this sample, the left column background covers the left side of the normal title bar.  Doing that would normally prevent window dragging when clicking on that part of the window.  However we added and top-aligned a transparent Rectangle to the left column and set it to be the height of the title bar.  We then used the special WindowChrome attached property to identify it as a “title bar” so that the upper left portion of the window can still be clicked to support window dragging.

Summary

All these features for merging window content into the title bar area will be available in the 2020.1 version.  WindowChrome will provide everything you’ll need to build custom modernized window appearances.

Post in the comments below if you have any feedback or questions about WindowChrome title bar merging.

Actipro WPF Controls v2020.1 development is in progress, and the new version’s main goals are to modernize our UI control features/themes, and make theme customization much easier.

In the previous post, we saw how WindowChrome supported placing a user profile popup button in a Window title bar.  In today’s post, we’ll add a full Menu control to the title bar instead.

Title Bar Menus

The 2020.1 version makes it easy to add custom title bar content when using WindowChrome.  In fact, you can customize the left, center, or right portions of the title bar however you like.

Let’s put a Menu control into the left side of the title bar.

For this kind of menu, we’ve created special subclass of the native Menu that has some minor adjustments so that the menu looks great in the title bar.

If you wish to use all capitals for the menu items like Visual Studio does, that's a simple change to the Header property of each menu item.

Summary

With the new features coming to WindowChrome, it’s easy to maximize window real estate by placing menus in the title bar.  Many modern apps are using this technique today.

Post in the comments below if you have any feedback or questions about WindowChrome title bar customization.

Actipro WPF Controls v2020.1 development is in progress, and the new version’s main goals are to modernize our UI control features/themes, and make theme customization much easier.

In the previous post, we saw how WindowChrome supported placing a Back button in a Window title bar.  In today’s post, we’ll add a user profile button to the title bar instead.

Title Bar Buttons

The 2020.1 version makes it easy to add custom title bar content when using WindowChrome.  In fact, you can customize the left, center, or right portions of the title bar however you like.

Let’s see how a user profile button looks in the title bar.

When we click the button, a popup opens with some information about the user and a Sign Out menu item.  This sample mimics the user profile button found in the Visual Studio title bar and makes use of our Shared Library's PopupButton control.

PopupButton can open any Popup or ContextMenu in response to a click.  It's extremely flexible in the content it can display.

Summary

With the new features coming to WindowChrome, it’s very easy to add buttons or any other content to any part of the title bar.

Post in the comments below if you have any feedback or questions about WindowChrome title bar customization.

Actipro WPF Controls v2020.1 development is in progress, and the new version’s main goals are to modernize our UI control features/themes, and make theme customization much easier.

In the previous post, we looked at WindowChrome (our class for theming WPF Windows that also adds customization features) and its new ability to support processing overlays.  In this and upcoming posts, we’ll start to look at new features that support title bar customization.

Title Bar Buttons

The 2020.1 version makes it easy to add custom title bar content when using WindowChrome.  In fact, you can customize the left, center, or right portions of the title bar however you like.

Let’s see an example where we’ve hidden the standard title bar icon and put a Back button in its place.

On the first page, the Back button is disabled.  When we click through to a second page, it becomes enabled again.

Summary

Back buttons in title bars are very common in Windows 10 apps.  And with the updates coming to WindowChrome, it’s simple to add them to your own apps.

Post in the comments below if you have any feedback or questions about WindowChrome title bar customization.

Actipro WPF Controls v2020.1 development is in progress, and the new version’s main goals are to modernize our UI control features/themes, and make theme customization much easier.

In yesterday’s post, we took a look at WindowChrome (our class for theming WPF Windows that also adds customization features) and its new ability to support full-window overlays. The example in that post showed an Office-like Backstage menu overlay.

Processing Overlays

Another common use of overlays is for processing indicators. Let’s say you kick off a time-consuming thread and you don’t want the user interacting with anything on the window. This is a perfect scenario for displaying a beautiful processing overlay.

In this sample, we start a worker thread that runs for several seconds. While the thread runs, we show a processing overlay with an animated progress spinner. The overlay uses a subtle fade animation when opening and closing.

Note how the window title bar is still fully accessible while the overlay is displayed. This allows the user to continue interacting with the window itself (e.g. move the window, minimize it, and so on), even though the main content area of the window is blocked from interaction.

Summary

WindowChrome overlay features will be ship in the 2020.1 version and offer up all kinds of exciting possibilities for your apps.

Post in the comments below if you have any feedback or questions about WindowChrome overlays.