XAF - UX Improvements for Design Time Templates, Windows and Web UI (Coming soon in v16.1)

XAF Team Blog
31 May 2016

Design-time enhancements

With our upcoming release, all XAF templates will be available from the DX Template Gallery (look for the DevExpress v16.1 Template Gallery item in the standard Add New Item... dialog or see the "Add DevExpress Item" context menu item for your projects in Solution Explorer):

Additionally, we've provided shortcuts for the most recently used (MRU) item templates to the Add DevExpress Item... menu - invoked for XAF projects under the Solution Explorer:

Notice that there is a new Non-Persistent Object item template that allows you to create non-persistent classes with ease (it contains all the required boilerplate code and example implementations of the INotifyPropertyChanged, IXafEntityObject, IObjectSpaceLink interfaces). Please review my earlier blog post to learn on more improvements with regard to managing non-persistent objects in standard XAF forms. See the Changes to Visual Studio Item Templates in XAF v16.1 KB article for more details.

WinForms SDI: Outlook-Style Navigation Integration

For those of you targeting Windows, XAF's integration of DevExpress WinForms Outlook-Style navigation controls and OfficeNavigationBar is now better than ever.

The OfficeNavigationBar can be displayed in non-compact mode, as in the screenshot above, or in the compact mode (enabled by default) demonstrated below:

You can always switch between compact and non-compact modes via the Navigation Options dialog ().

Each navigation link at the bottom of the OfficeNavigationBar panel corresponds to the root navigation group defined under the NavigationItems node.

Clicking on these group items can be include animations managed by our TransitionManager component  where the SlideFadeTransition type is used by default (view a full-size GIF without losing quality HERE):

This new feature is enabled only in SDI mode (UIType = SingleWindowSDI) with the ribbon menu (FormStyle=Ribbon) when the new RootGroupStyle property is set to OutlookSimple or OutlookAnimated. You can initialize these configurations in code or via the Model Editor:

For a cleaner UI and better end-user experience, the DockPanel previously hosting the NavBarControl was also removed. The NavBarControl is now positioned directly in the form template, which also helped us remove unnecessary borders.

The expand/collapse functions of the removed dock panel are now natively managed by the NavBarControl and the two new buttons added into the status bar. The "Normal View" button expands the NavBarControl while pressing the "Reading View" button collapses the NavBarControl.

SVG icons support in ASP.NET

In XAF ASP.NET applications, SVG images are now supported, which improves your website's appearance on displays with high pixel density (resolution).

If you're adding custom images as per this documentation article, note that image display size is determined by the svg element's viewBox attribute. Also, SVG icons are not grayed out automatically for disabled Actions. You should manually add a disabled variant of an SVG icon with the _Disabled suffix (e.g., MyIcon_Disabled.svg).

Our UX designers also started to redraw standard XAF images, but this is still in works. You can easily view already updated images in the Model Editor's image picker:

Our future plans include completing this image collection and to introduce this same capability for XAF's WinForms UI.

Faster rendering and other performance optimizations for popular Web UI scenarios

In short, the core idea for all these performance improvements in XAF ASP.NET WebForms apps is that under certain circumstances, we intentionally suppress creation and rendering of current web page controls, disable unnecessary data-binding operations, reduce the number of requests to the server and perform updates on the client side where possible. This allows us to produce a web app that behaves faster and is more responsive, which is essential for hand-held devices (e.g., tablets, smart phones). Desktop web browser users will also benefit from these changes, especially in scenarios involving popup windows.

Since several thousand of our unit and complex functional tests have passed, these optimizations are turned on by default in XAF v16.1, so that everyone can benefit from them. For backward compatibility or any unhandled issues in your custom code that might occur due to these optimizations, we also provided various static options in the DevExpress.ExpressApp.Web.WebApplication.OptimizationSettings class allowing you to turn this feature off completely (or partially). I've described these options and scenarios in the following KB Article: https://www.devexpress.com/kb=T386142 

Your feedback is needed!

As always, my team and I look forward to hearing your thoughts on each of these improvements in comments to this blog or via the https://www.devexpress.com/Support/Center/Question/Create service.

Free DevExpress Products - Get Your Copy Today

The following free DevExpress product offers remain available. Should you have any questions about the free offers below, please submit a ticket via the DevExpress Support Center at your convenience. We'll be happy to follow-up.
No Comments

Please login or register to post comments.