diff --git a/components/TitleBar/OpenSolution.bat b/components/TitleBar/OpenSolution.bat new file mode 100644 index 000000000..814a56d4b --- /dev/null +++ b/components/TitleBar/OpenSolution.bat @@ -0,0 +1,3 @@ +@ECHO OFF + +powershell ..\..\tooling\ProjectHeads\GenerateSingleSampleHeads.ps1 -componentPath %CD% %* \ No newline at end of file diff --git a/components/TitleBar/samples/Assets/AppTitleBarIcon.png b/components/TitleBar/samples/Assets/AppTitleBarIcon.png new file mode 100644 index 000000000..9b7414291 Binary files /dev/null and b/components/TitleBar/samples/Assets/AppTitleBarIcon.png differ diff --git a/components/TitleBar/samples/Assets/Avatar.png b/components/TitleBar/samples/Assets/Avatar.png new file mode 100644 index 000000000..5fd88928d Binary files /dev/null and b/components/TitleBar/samples/Assets/Avatar.png differ diff --git a/components/TitleBar/samples/Assets/icon.png b/components/TitleBar/samples/Assets/icon.png new file mode 100644 index 000000000..5f574ceca Binary files /dev/null and b/components/TitleBar/samples/Assets/icon.png differ diff --git a/components/TitleBar/samples/Dependencies.props b/components/TitleBar/samples/Dependencies.props new file mode 100644 index 000000000..e622e1df4 --- /dev/null +++ b/components/TitleBar/samples/Dependencies.props @@ -0,0 +1,31 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/components/TitleBar/samples/SamplePages/FirstPage.xaml b/components/TitleBar/samples/SamplePages/FirstPage.xaml new file mode 100644 index 000000000..135a5b9bd --- /dev/null +++ b/components/TitleBar/samples/SamplePages/FirstPage.xaml @@ -0,0 +1,18 @@ + + + + + + diff --git a/components/TitleBar/samples/SamplePages/FirstPage.xaml.cs b/components/TitleBar/samples/SamplePages/FirstPage.xaml.cs new file mode 100644 index 000000000..c2fb661be --- /dev/null +++ b/components/TitleBar/samples/SamplePages/FirstPage.xaml.cs @@ -0,0 +1,15 @@ +// Licensed to the .NET Foundation under one or more agreements. +// The .NET Foundation licenses this file to you under the MIT license. +// See the LICENSE file in the project root for more information. + +namespace TitleBarExperiment.Samples; +/// +/// An empty page that can be used on its own or navigated to within a Frame. +/// +public sealed partial class FirstPage : Page +{ + public FirstPage() + { + this.InitializeComponent(); + } +} diff --git a/components/TitleBar/samples/SamplePages/SecondPage.xaml b/components/TitleBar/samples/SamplePages/SecondPage.xaml new file mode 100644 index 000000000..5be84e0cf --- /dev/null +++ b/components/TitleBar/samples/SamplePages/SecondPage.xaml @@ -0,0 +1,18 @@ + + + + + + diff --git a/components/TitleBar/samples/SamplePages/SecondPage.xaml.cs b/components/TitleBar/samples/SamplePages/SecondPage.xaml.cs new file mode 100644 index 000000000..917c00f9b --- /dev/null +++ b/components/TitleBar/samples/SamplePages/SecondPage.xaml.cs @@ -0,0 +1,15 @@ +// Licensed to the .NET Foundation under one or more agreements. +// The .NET Foundation licenses this file to you under the MIT license. +// See the LICENSE file in the project root for more information. + +namespace TitleBarExperiment.Samples; +/// +/// An empty page that can be used on its own or navigated to within a Frame. +/// +public sealed partial class SecondPage : Page +{ + public SecondPage() + { + this.InitializeComponent(); + } +} diff --git a/components/TitleBar/samples/SamplePages/ShellPage.xaml b/components/TitleBar/samples/SamplePages/ShellPage.xaml new file mode 100644 index 000000000..4ce0d4bb3 --- /dev/null +++ b/components/TitleBar/samples/SamplePages/ShellPage.xaml @@ -0,0 +1,88 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/components/TitleBar/samples/SamplePages/ShellPage.xaml.cs b/components/TitleBar/samples/SamplePages/ShellPage.xaml.cs new file mode 100644 index 000000000..56d609414 --- /dev/null +++ b/components/TitleBar/samples/SamplePages/ShellPage.xaml.cs @@ -0,0 +1,56 @@ +// Licensed to the .NET Foundation under one or more agreements. +// The .NET Foundation licenses this file to you under the MIT license. +// See the LICENSE file in the project root for more information. + +namespace TitleBarExperiment.Samples; +/// +/// An empty page that can be used on its own or navigated to within a Frame. +/// +public sealed partial class ShellPage : Page +{ +#if WINAPPSDK + public ShellPage(Window window) + { + this.InitializeComponent(); + appTitleBar.Window = window; + } +#else + public ShellPage() + { + this.InitializeComponent(); + Microsoft.UI.Xaml.Controls.BackdropMaterial.SetApplyToRootOrPageBackground(this, true); + } +#endif + private void appTitleBar_BackButtonClick(object sender, RoutedEventArgs e) + { + if (NavFrame.CanGoBack) + { + NavFrame.GoBack(); + } + } + + private void appTitleBar_PaneButtonClick(object sender, RoutedEventArgs e) + { + NavView.IsPaneOpen = !NavView.IsPaneOpen; + } + + private void NavView_SelectionChanged(MUXC.NavigationView sender, MUXC.NavigationViewSelectionChangedEventArgs args) + { + switch ((string)((MUXC.NavigationViewItem)NavView.SelectedItem).Tag) + { + case "1": NavFrame.Navigate(typeof(FirstPage)); break; + case "2": NavFrame.Navigate(typeof(SecondPage)); break; + } + + } + + private void NavView_Loaded(object sender, RoutedEventArgs e) + { + NavView.SelectedItem = NavView.MenuItems[0]; + } + + private void NavFrame_Navigated(object sender, NavigationEventArgs e) + { + appTitleBar.IsBackButtonVisible = NavFrame.CanGoBack; + } +} diff --git a/components/TitleBar/samples/TitleBar.Samples.csproj b/components/TitleBar/samples/TitleBar.Samples.csproj new file mode 100644 index 000000000..6d58d58db --- /dev/null +++ b/components/TitleBar/samples/TitleBar.Samples.csproj @@ -0,0 +1,25 @@ + + + TitleBar + + + + + + + + + + + + PreserveNewest + + + PreserveNewest + + + PreserveNewest + + + + diff --git a/components/TitleBar/samples/TitleBar.md b/components/TitleBar/samples/TitleBar.md new file mode 100644 index 000000000..b7ef40dd6 --- /dev/null +++ b/components/TitleBar/samples/TitleBar.md @@ -0,0 +1,28 @@ +--- +title: TitleBar +author: niels9001 +description: A control that provides a modern TitleBar +keywords: TitleBar, Control, Layout +dev_langs: + - csharp +category: Controls +subcategory: Layout +discussion-id: 0 +issue-id: 0 +icon: assets/icon.png +--- + +The `TitleBar` provides an easy way to display a modern titlebar experience. The control handles all the required APIs to extend content into the titlebar area and set custom drag regions. The control is set up in a way that it handles the correct design guidelines while being flexible in what content to show. + +> [!Sample TitleBarConfigSample] + +> [!Sample TitleBarFullSample] + +## Using TitleBar in WASDK apps +If `AutoConfigureCustomTitleBar` is enabled, the `TitleBar` will make the required code-behind changes to make your content extend into the titlebar area and setting the correct caption background brushes. However, launching the app might briefly show the standard titlebar. To overcome this, make sure you set the following code in the `OnLaunched` method (in `App.xaml.cs`) or wherever you create your window: + +```CS +currentWindow.AppWindow.TitleBar.ExtendsContentIntoTitleBar = true; +currentWindow.AppWindow.TitleBar.ButtonBackgroundColor = Microsoft.UI.Colors.Transparent; +` + diff --git a/components/TitleBar/samples/TitleBarConfigSample.xaml b/components/TitleBar/samples/TitleBarConfigSample.xaml new file mode 100644 index 000000000..49736cb03 --- /dev/null +++ b/components/TitleBar/samples/TitleBarConfigSample.xaml @@ -0,0 +1,104 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/components/TitleBar/samples/TitleBarConfigSample.xaml.cs b/components/TitleBar/samples/TitleBarConfigSample.xaml.cs new file mode 100644 index 000000000..645efe4eb --- /dev/null +++ b/components/TitleBar/samples/TitleBarConfigSample.xaml.cs @@ -0,0 +1,26 @@ +// Licensed to the .NET Foundation under one or more agreements. +// The .NET Foundation licenses this file to you under the MIT license. +// See the LICENSE file in the project root for more information. + +using CommunityToolkit.WinUI.Controls; + +namespace TitleBarExperiment.Samples; + +/// +/// An example sample page of a custom control inheriting from Panel. +/// +[ToolkitSampleTextOption("TitleText", "Contoso", Title = "Title")] +[ToolkitSampleTextOption("SubtitleText", "Preview", Title = "Subtitle")] +[ToolkitSampleBoolOption("ShowBackButtonSetting", false, Title = "ShowBackButton")] +[ToolkitSampleBoolOption("ShowPaneButtonSetting", false, Title = "ShowPaneButton")] + +[ToolkitSample(id: nameof(TitleBarConfigSample), "Full titlebar sample", description: $"A sample for showing how to create and use a {nameof(TitleBar)} in a window.")] +public sealed partial class TitleBarConfigSample : Page +{ + public TitleBarConfigSample() + { + this.InitializeComponent(); + } + + +} diff --git a/components/TitleBar/samples/TitleBarFullSample.xaml b/components/TitleBar/samples/TitleBarFullSample.xaml new file mode 100644 index 000000000..bec6c3a0e --- /dev/null +++ b/components/TitleBar/samples/TitleBarFullSample.xaml @@ -0,0 +1,20 @@ + + + + + +