Search This Blog

Showing posts with label form. Show all posts
Showing posts with label form. Show all posts

Wednesday, April 25, 2018

UPDATE on Customization Forms - XAF WinForms v18.1.3+

With v18.1.3 (RTM or Beta2), a tooltip will be shown for complex property paths to avoid confusion from fields with the same name. Refer to the attached video:



Note that since multiple customization forms can be opened at the same time, now the form's header also includes the View's caption. We hope your end-users will appreciate these minor usability improvements. Refer to the original Support Center ticket for more details.

See Also:
Customization Forms and Model Editor Improvements - XAF v17.2.6

Tuesday, July 9, 2013

A possible way to improve the ergonomics of a large and complex detail form

When something gets very complex and there is no space for all the info on the screen (imagine a form with 300 text boxes and other controls on it - yes, I saw such forms in my life!)  you can use various techniques to temporarily hide or completely remove certain info (probably rarely used) or allocate it in a way it will occupy less space.

Many container UI elements like tab controls, panels and our layout control are designed to help you with this task. Talking about XAF apps, the most popular way of accomplishing this I saw was putting unwanted fields behind the tab groups, which were activated by end-users on demand:



This approach does not involve any refactoring of your underlying data model, but just means re-layouting the default form in a way where most often used data appears on top while having less popular data hidden. It seems that this all comes from trying to mimic the behavior and look & feel of legacy apps or even papers, because many end-users might be accustomed to such a UI in the past.

Another, but less popular approach I saw was in refactoring a huge data model, which technically means aggregating similar data into a separate part, adding a reference to it from the main object and then showing a separate detail form on demand, e.g. via a button in the toolbar. A perfect example of this can be our ObjectPropertyEditor that can be used for an aggregated reference property and that displays a nice UI for editing its details:



Today, I would like to show you an alternative way of solving the problem of complex detail forms usability. I am double excited about this solution, because it comes from our XAF customer, Sergey Zaycev and his team from Galaktika, whom I recently blogged about.
These guys implemented a custom Property Editor - TabbedDetailPropertyEditor (check this help link to learn more on how it is possible to create such extensions yourself), which is essentially a tree-like navigation panel at the left side and a detail panel on the right. Each node in the tree represents a small portion of data, which is then displayed on the right side as user focuses it in the tree:


This hierarchy is fully customizable at runtime, thus allows you to meet the needs of a very demanding client right in front of his/her PC.


In my opinion, this is a very good alternative to the standard approaches described above. If you think about it, you may find the analogy with how the main application navigation works. Of course, this displaying a small portion of data at a time also works faster and thus is more usable.

I liked this idea very much, what about you?

If you liked this stuff, then I suggest you learn more on it as well as check out other XAFARI platform features at http://xafari.ru/

Wednesday, May 29, 2013

Discussing custom forms and controls (again)

I recently updated the E911 example to 13.1 (it was very smooth, btw - only one change from IComplexPropertyEditor to IComplexViewItem) and refactored it a bit (improved some code, added more code comments and fully rewrote the description).

I think that you may be interested in checking this updated example (I reposted its description below), because it may help you better understand ideas behind XAF as well as how it works and is built internally.

In addition, I recommend you check out the following help articles in the XAF documentation:

eXpressApp Framework > Concepts > UI Construction
eXpressApp Framework > Concepts > UI Construction > UI Element Overview
because they should give you a better understanding of reusable XAF building blocks and see how to customize or replace them.

==========================
This example implements the following scenarios when an end-user clicks on a custom item in the navigation control:
- a custom non-XAF form is opened as a result;
- a standard XAF View containing a custom user control is opened as a result.
Both custom form and user controls display persistent data from the XAF application database:


To accomplish this, you can follow the instructions below:

1. Define a base structure of the navigation control in your XAF application, as shown in the E911.Module\Model.DesignedDiffs.xafml file.
You can simply copy and paste the contents of the NavigationItems element into the corresponding file (pre-opened via the text editor) of your platform-agnostic module.
The same customizations can be achieved via the Model Editor visually.

This navigation structure will be further customized in the WinForms and ASP.NET executable projects later.

2. Intercept events of the navigation control to display a custom form when a custom navigation item is clicked.
To do this, implement a WindowController into your platform-agnostic module and handle events of the ShowNavigationItemController class as per the E911.Module\Controllers\ShowCustomFormWindowController.xx file. This controller will be abstract and be overridden in WinForms and ASP.NET modules.

3. Declare a custom ViewItem class that is supposed to host a custom user control in the standard XAF View. To do this, implement a custom ViewItem descendant and related types in the platform-agnostic module as shown in the E911.Module\Editors\CustomUserControlViewItem.xx file.
This ViewItem will also be abstract and platform-agnostic as it will not create platform-dependent controls, and will just provide a common customization code for both platforms. For instance, the OnControlCreated method will be overridden to bind the created control to data. To access persistent data from the database used by an XAF application, the ViewItem will implement the IComplexViewItem interface that consists of a single Setup method, receiving the IObjectSpace and XafApplication objects as parameters.
To unify our data binding code for both platforms, the IXpoSessionAwareControl interface and an auxiliary XpoSessionAwareControlInitializer class are introduced.
The interface provides a single UpdateDataSource method that is implemented by custom forms and user controls to bind them to data received by means of XPO.
You can use a similar mechanism and modify these auxiliary types to pass other custom data into your custom forms and controls.

4. Define a base structure of the standard XAF View with a custom ViewItem as shown in the E911.Module\Model.DesignedDiffs.xafml file.
You can simply copy and paste the contents of the Views element into the corresponding file (pre-opened via the text editor) of your platform-agnostic module.


5. Create custom forms and user controls in WinForms and ASP.NET executable projects analogous with what is shown in the example. The easiest way to do this is to copy the contents of the E911.Win\Controls and E911.Web\Controls folders and then include the necessary files into your solution. Take special note that these custom forms and controls implement the IXpoSessionAwareControl interface to automatically receive persistent data and other parameters when they are created.


6. Implement platform-dependent behavior to open and customize custom forms and controls. To do this, copy the following files into your WinForms and ASP.NET module projects:
WinForms:
E911.Module.Win\Controllers\WinShowCustomFormWindowController.xx - contains an WinForms version of the WindowController, which is inherited from the platform-agnostic
E911.Module.Win\Editors\WinCustomUserControlViewItem.xx - contains an WinForms version of the ViewItem, which is inherited from the platform-agnostic one;
E911.Module.Win\WinModuleEx.xx - contains a registration code for WinForms version of the ViewItem;
one;

ASP.NET:
E911.Module.Web\Editors\WebCustomUserControlViewItem.xx - contains an ASP.NET version of the ViewItem, which is inherited from the platform-agnostic one;
E911.Module.Web\WebModuleEx.xx - contains a registration code for ASP.NET version of the ViewItem;
E911.Module.Web\Controllers\WebShowCustomFormWindowController.xx - contains an ASP.NET version of the WindowController, which is inherited from the platform-agnostic one;

These platform-dependent versions of the WindowController and ViewItem are required to implement the creation and display of custom forms and controls using the means specific for each platform. They are also designed to provide the capability to be able to set custom forms and control settings via the Model Editor. For that purpose, custom Application Model extensions are implemented for the Navigation Item and View Item model elements.

7. Set the custom forms and controls settings for each platform.
To do this, copy the contents of the E911.Win\Model.xafml and E911.Web\Model.xafml files into the Model.xafml file in the executable WinForms and ASP.NET projects:
WinForms:


ASP.NET:



That is it.

IMPORTANT NOTES
1. It is also possible to mix the traditional and XAF development approaches (consult our Support Team if you are not sure how to integrate your standard non-XAF solution into XAF), because an XAF application is a regular .NET application built of reusable blocks like View, ViewItem, Property and List Editors, etc. that eventually create and customize platform-dependent controls exactly the same way you do this without XAF. So, using XAF does not mean something absolutely new and allows you to reuse your existing development skills and practices. Of course, it is possible to create your own reusable blocks if the standard ones do not meet your needs. For instance, the example of a custom View class designed to show a custom form can be found on CodeProject here.

2. This solution contains some generic code (e.g., base WindowController and ViewItem) that is mainly required because our XAF application is for both Windows and the Web. You may avoid this generic code and make a simpler implementation if you are developing for only one platform.

3. You can display custom forms not only when interacting with the navigation control, but from any other place. To do this, intercept the events of a required entity, e.g., an XAF Controller, Action or a View. Refer to the product documentation or consult with our Support Team in case of any difficulties.

4. By default controls layout and user customizations are preserved only for built-in XAF ListEditors, because they have special code for that. If you embed a custom user control into XAF, you need to preserve its settings yourself as well, exactly like you would do when implementing this task in the "old way" in a non-XAF application. Refer to the control's documentation to learn more on how to accomplish this task.
Feel free to contact the respective product team if you experience any difficulties customizing this control.