Announcing Uno Platform 6.1: CommandBarFlyout, Studio Updates, and More

Two months ago, we launched our most monumental release yet: Uno Platform 6.0. It introduced a unified Skia rendering engine for Uno Platform across all target platforms and officially declared our premium tooling, Uno Platform Studio, as generally available. Together, they streamline your .NET development, allowing you to build cross-platform .NET apps in record time.

Two months may seem like a long time (and yes, we took a bit of a breather after our 6.0 release), but even during that time, our team and community still managed to finalize over 300 pull requests, refining previous releases and adding new features.

Let’s break down everything that’s new in both the open-source Uno Platform and our premium tooling: Uno Platform Studio.

What’s new in Uno Platform 6.1

If you haven’t already migrated to our version 6, you are missing out. In this short video, Martin from our team shows you exactly how. And our 6.1 release makes the core Uno Platform robust and brings in new features across all pillars of our free and open source offering .

New control – CommandBarFlyout

Uno Platform 6.1, introduces a brand-new UI control CommandBarFlyout ! This floating contextual toolbar brings a modern commanding experience to your apps, allowing you to present both primary and secondary commands right where users need them. The secondary command area is collapsible, allowing you to keep your UI clean and focused.

Fully integrated with Uno Platform, CommandBarFlyout supports keyboard accelerators and the StandardUICommand API, so you can easily plug in familiar, localized commands like Copy, Cut, or Paste with minimal effort.

To see it in action, check out this short Uno Tech Bite video:

Best of the rest of the Uno Platform 6.1.

There is so much more spread over 300 PRs made in the last release. Here are a few highlights and for the rest check out our GitHub release notes.

Status Bar APIs for Mobile: You can now directly customize the background and foreground colors of the status bar on both iOS and Android, giving you more control over your app’s mobile presence.
Cookie Handling for WebAssembly: Building web applications that require session management or storing user preferences just got easier with the introduction of cookie handling support in the WASM runtime.
Enhanced Input Experience: We’ve added support for the InputReturnType property on iOS (UIKit) and Android. This allows you to change the keyboard’s return key to better suit the context of your input fields (e.g., showing a “Search” or “Go” button).
Updated NumberBox Control: The NumberBox control has been updated to align with the latest version from WinUI 1.7.1, bringing in the most recent features and improvements for numeric input.
Smoother Scrolling & Gestures: We’ve made significant under-the-hood improvements to gesture recognition and have fine-tuned the scrolling inertia on a per-OS basis, resulting in a smoother and more responsive user experience.

What’s new in Uno Platform Studio?

Uno Platform Studio is a powerful toolset designed to help you build .NET applications faster than ever. It currently includes Hot Design, Hot Reload, and a Design-to-Code Figma plugin. You can read all the details about it in our 6.0 release. However, the 6.1 release enables some very neat scenarios for Hot Design, so for the purpose of this blog post we’ll focus on Hot Design in detail.

Hot Design is a Visual Designer for cross-platform .NET applications built with Uno Platform. It transforms your live running application to a design surface. This unique, and patent-pending approach brings with itself a slew or benefits both for beginner and expert .NET / XAML / C# developers:

Real-Time UI Editing: No need to stop, rebuild, or redeploy. See XAML changes instantly as you make them.
Lightning-Fast Iteration: Modify layouts, styles, and bindings in real-time, saving hours of build time and drastically reducing development cycles.
Ideal for XAML Beginners: Visually discover properties and bind to data sources without needing to know the exact syntax upfront.
Powerful for XAML Experts: Quickly find relevant data contexts and properties in a complex app, speeding up data binding and reducing errors.
Perfect for UI Testing & Prototyping: Visually experiment with designs on real devices before committing to code.

Hot Design works seamlessly with other Studio components like Hot Reload and the Figma plugin for an end-to-end visual development experience. Also, it works with all IDEs and on all operating systems.

But let’s turn to what’s new. This release brings significant improvements to the Uno Platform Studio UX.

New Thickness Editor in Hot Design

The new Thickness editor experience in Hot Design aims to make setting Margin, Padding, Border Thickness and any other Thickness property, making it easier to understand and use.

Margin and Padding

For Margin and Padding, the illustrations below show arrows indicating the direction, related to the element itself, of the selected thickness. Margin refers to the space outside an element. Padding refers to the internal space between the edge of the control and its internal content.

BorderThickness

For BorderThickness and other Thickness properties, a more generic design is used that doesn’t have arrows but still indicates the size of each dimension of the thickness.

Full, Axis, and Asymmetrical Symmetry

When working with these values, you’ll find that all four dimensions can be set the same in Full symmetry mode. If you move to the second input option, or choose Axis symmetry, the editor visually pairs the left and right values, and the top and bottom values, allowing you to adjust them in tandem (imagine an image here).

Moving to the third input option reveals the Asymmetrical mode, where each dimension can be recorded separately, offering precise control over every side.

New Visualizations for Margin/Padding/Spacing

It’s often difficult to see how much space an element takes up, or perhaps how much space there is between the border and the internal content.

Take the Button in this illustration.

When selected, Hot Design shows, using overlays, the Margin and Padding values. Hovering over the respective overlay will show a tooltip with the current value.

If you attempt to drag an element within a container, you will see some of the properties of the parent container being highlighted. In this case, dragging either element within a StackPanel, both Padding and Spacing is highlighted, making it clearer where the element is and where it can be moved to.

New Design-Time Values Support

Previously, when you added an item from the Toolbox, we set various initial property values (placeholders). These design-time values are highlighted in the property grid with a yellow dot (🟡) and a border around the property. Elements that have properties with these placeholders are also marked with a yellow dot in the Elements tree.

When you change a property that has a placeholder, the yellow dot and border in the property grid are replaced with a blue dot (🔵). This blue dot indicates that the property is now explicitly set in XAML. The yellow dot in the Elements tree will be removed once all properties with a placeholder value for that element have been changed.

If you attempt to exit Hot Design or leave a template or UserControl editor without changing a property that still has a placeholder, a warning prompt will be displayed.

You can always proceed, but doing so will remove those placeholder values.

Get Started Today

The innovation in Uno Platform 6.1 and our ‘Wave 6’ products makes this the perfect time to build.

Update your NuGet Packages to Uno Platform 6.1 to get all the new features.
Explore our Chefs sample to see real-world architecture, MVUX patterns, and cross-platform UI in action. Fork it, run it, and see how 6.1 comes together!