1. Developed a fishing app
I made a simple app: Fishing.
As shown in the picture above, this app only has one button. Click and pretend to start Windows Update, and then users can fish openly.
Don't underestimate Yuyu. All genius ideas are not inspired by typing on the keyboard. When your work is blocked, the more you devote yourself to your work, the more you can't find a solution. At this time, you can move your eyes away from the screen. Maybe you can be playing with the little yellow duck while taking a bath, while staring out the window while in a daze, while sleeping. When you buckle your stomach, the inspiration to solve the problem suddenly fell into your mind.
So I shamelessly released this app to the ** Efficient Work ** category, and Microsoft also approved it. Now I can download this app here:
https://www.microsoft.com/zh-cn/p/loaf-a-winui3-app/9ndj3q12nrrm
Of course, as the title says, this is a WinUI 3 app.
2. What is WinUI 3?
WinUI 3 is a native user experience (UX) framework for Windows desktop applications and UWP applications provided with the Windows App SDK. Simply put, WinUI 3 separates the UI layer of UWP for use by Win32 Windows Apps. To better understand WinUI 3, refer to the following links:
- Windows UI 库 (WinUI) - Windows apps
- Windows UI 库 (WinUI) 3 - Windows apps
- 通过 Windows 应用 SDK 生成桌面 Windows 应用 - Windows apps
- Windows 应用 SDK 的稳定通道发行说明 - Windows apps
- microsoftmicrosoft-ui-xaml Windows UI Library_ the latest Windows 10 native controls and Fluent styles for your applications
- microsoft-ui-xaml_roadmap
- WinUI 3 试玩报告
- WinUI 3 Preview 3 发布了，再一次试试它的性能
After a long wait, recently, WinUI 3 seems to have quietly released an official version. There is neither large-scale publicity nor integration into the just-released Visual Studio 2022. I haven't even seen decent emails or news or blogs. If I check the documentation, it seems to have been released together with the Windows App SDK. In short, the 1.0 version of WinUI 3 is now available. After playing with it for a while, I feel that I can't migrate my app to WinUI 3 for the time being, although I have been looking forward to it for a long time. Because I couldn't use existing applications and in order to try WinUI 3 more deeply, I made the little application "Fishing".
3. development process
Let's talk about the development process below. Overall it was fun, but there were also many challenges.
首先，如果要使用 Visual Studio 2022 开发 WinUI 3 的 C# App，需要下载 Visual Studio 2022 的扩展：WindowsAppSDK.Cs.Extension.Dev17.Standalone.vsix。安装扩展后才可以创建 WinUI 3 项目。
Extensions to C++ or Visual Studio 2019 can be found with their respective download links in the following documents:
Windows 应用 SDK 的稳定通道发行说明 - Windows apps
After creating the project, you will find that WinUI 3 has no design view (and it should not be there in the future), so it is best to create another UWP project at this time, design XAML in the UWP project and copy it to the WinUI 3 project.
迁移过程中需要将大部分 Windows.* 命名空间替换成 Microsoft.*。不过 Win2D 里还在用 Windows.* 命名空间，所以搞得有些混乱。
然后就是引用各种包，微软自己管理的 UWP 最常用的包大致上都有对应的 WinUI 版本，例如 Microsoft.Toolkit.Uwp.UI 替换为 CommunityToolkit.WinUI.UI，而 Win2D.uwp 替换为 Microsoft.Graphics.Win2D。
Most of UWP's development experience can be used on WinUI 3. The biggest problem encountered in the small app of Yuyu is Window management. Maybe WinUI 3 's Window Api has not been decided yet, which makes it troublesome to even modify the title, requiring several lines of code:
namespace SampleApp
{
/// <summary>
/// An empty window that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class MainWindow : Window
{
private AppWindow m_appWindow;
public MainWindow()
{
this.InitializeComponent();
// Get the AppWindow for our XAML Window
m_appWindow = GetAppWindowForCurrentWindow();
if (m_appWindow != null)
{
// You now have an AppWindow object and can call its methods to manipulate the window.
// Just to do something here, let's change the title of the window...
m_appWindow.Title = "WinUI ❤️ AppWindow";
}
}
private AppWindow GetAppWindowForCurrentWindow()
{
IntPtr hWnd = WinRT.Interop.WindowNative.GetWindowHandle(window);
WindowId myWndId = Microsoft.UI.Win32Interop.GetWindowIdFromWindow(hWnd);
return AppWindow.GetFromWindowId(myWndId);
}
}
}
The code to enter full screen is also different from UWP:
///进入全屏
m_appWindow.SetPresenter(AppWindowPresenterKind.FullScreen);
///退出全屏
m_appWindow.SetPresenter(AppWindowPresenterKind.Default);
而且全屏和 UWP 还不一样，没法按 Esc 键退出全屏，也没有了屏幕顶部隐藏的标题栏。所以要自己捕获全局的 Esc 键事件再调用代码退出全屏（至于平板状态怎么退出全屏我就不知道了）。
Another point is that the styles of WinUI 3 and UWP are somewhat different. For example, the style of Progress Ring is not the style that has rotated around several dots since Windows 8. Fortunately, you can copy UWP's Style with just a few modifications.
虽然开发过程遇到很多问题，对这个小 App 来说还算轻松愉快。有趣的是，当遇到 WinUI 3 没提供想要的 API 的时候可以直接调用 Win32 API 实现需求。更有趣的是，这些 Win32 API 有些有效，有些无效。
After all the code is completed, the last step is to publish it to the store. Fortunately, the release process is basically the same as UWP, and now the app can be downloaded in the store.
4. the problems encountered
There is no design view, which is a serious problem. I can accept it myself, because at least there are hot heavy loads available, but it is not friendly to get started.
文档混乱，几乎所有 UWP 和 Windows App SDK 的文档合并了，这就要命了，真的要命，例如 WinUI 3 的文档有指向 Mica 的导航，明明 WinUI 3 都不支持 Mica。现在在 https://docs.microsoft.com/en-us/windows/apps/ 页面里甚至找不到 UWP 的入口，总之无论 UWP 还是 Windows App SDK 的文档都一片混沌。
The demo is useless. It's okay to give me a UWP demo, but it's too much to even give me a Windows 8 demo.
The name Windows App SDK itself is not good. All engines found a lot of Windows things, but not Windows App SDK.
There are no Background acrylic and RevealBoraderBrush, and Win 2D also lacks CanvasAnimatedControl. The absence of these things makes it more difficult to migrate from UWP to WinUI 3.
We encountered various unspeakable bugs and minor problems along the way from development to release.
5. last
I remember that it was quite easy to get started with WinForms, WPF, and Silverlight. Later, Microsoft's UIs became more and more difficult, and WinUI 3 was the most difficult one. WinUI 3 should have huge advantages over UWP, but now I suggest waiting for the new version. You can play with small applications, but the production environment must be cautious.
Instead, WinUI 2 seems to be getting more and more fun, or we can play WinUI 2 while waiting for a new version of WinUI 3.
6. source code
https://github.com/DinoChan/Loaf
Author: Dino.C
Source: https://www.example.com
Copyright: This article is licensed under the "CC BY 4.0" Creative Commons License Agreement.