Home > ASP.NET, Developing Using CodeFluent Entities, News, Presentation, SharePoint, SoftFluent Products, WPF > User Interfaces generated by CodeFluent Entities using out-of-the-box producers

User Interfaces generated by CodeFluent Entities using out-of-the-box producers


Over the past articles we showed you how to use the following UI producers provided out of the box by CodeFluent Entities:

· Windows Store producer

· ASP.NET Web Forms Producer / AJAX/JSON

· WPF Smart Client Producer

· SharePoint Web Part Producer

In this article I want to emphasize the fact that CodeFluent Entities is totally UI-agnostic. Indeed from the same and unique model you can generate screens that will be rendered in the targeted platforms of your choice. Here is for instance the list of all UI producers available:

UI_Producer

Let see all the user interfaces that CodeFluent Entities has been able to generate from the exact same model, using those different producers.

Note that the generated applications are not just a set of user interfaces; they are actually complete interactive applications sharing the same business object model, database and are 100% functional.

We used the “ContactManager Sample Model” supply by CodeFluent Entities:

ContactManagerModel

Here is the ContactManager model:

ContactManagerSurface

Since we’ve already seen how to use the producers provided by CodeFluent Entities in previous blog posts I’m going to skip their configurations and directly present you the generated UIs:

UI generated using the Windows 8 Store Producer:

The homepage generated by default lists all namespaces and their contained entities:

Windows Store (1)

Clicking on an entity gets you to the entity page.
On this entity page you’ll find a screenshot of the entity from which this page was generated.

Right Clicking on this page or typing Ctrl+Z will bring up a menu at the bottom where you’ll find the list of actions available on this entity. Those actions correspond in fact to business methods provided by the entity:

Windows Store (2)

Here is the screen displaying for the Contact entity when clicking on the “LoadAll” button and then selecting a contact:

Windows Store (3)

Bringing back the menu by hitting Ctrl+z or right clicking will enable you to create, edit or delete an entry:

Windows Store (4)

For instance, pushing the Edit button will give you the following screen:

Windows Store (5)

UI generated using the ASP .NET MVC Producer:

The homepage generated by default lists all namespaces and their contained entities:

ASP NET WebApp (1)

Clicking on an entity gets you to the entity page.
On this entity page you’ll find a screenshot of the entity from which this page was generated.

On the left side of the page you’ll find a list of actions available on this entity. Those actions correspond to business methods provided by the entity:

ASP NET WebApp (2)

Here is the screen displaying for the Contact entity when clicking on the “LoadAll” button:
It lists all the contacts through an HTML table and enables sorting.
From it you can detail, edit or remove a contact.

ASP NET WebApp (3)

Clicking on the “Details” hyperlink will bring up the following screen:

ASP NET WebApp (4)

Clicking on the “Edit” hyperlink will enable you to edit the entry:

ASP NET WebApp (5)

UI generated using the ASP .NET AJAX Producer:

The homepage generated by default lists all namespaces and their contained entities:

ASP NET AJAX-JSON (1)

Clicking on an entity gets you to the entity page.
On this entity page you’ll find a screenshot of the entity from which this page was generated.

On the left side of the page you’ll find a list of actions available on this entity. Those actions correspond to business methods provided by the entity:

ASP NET AJAX-JSON (2)

Here is the screen displaying for the Contact entity when clicking on the “LoadAll” button:
It lists all the contacts through an Ajax grid supporting sorting and paging.
From it you can detail, edit or remove a contact.

ASP NET AJAX-JSON (3)

And the one when clicking on the “Edit” button:

ASP NET AJAX-JSON (4)

UI generated using the ASP .NET WebForms Producer:

The homepage generated by default lists all namespaces and their contained entities:

ASP NET WebForms (1)

Clicking on an entity gets you to the entity page.
On this entity page you’ll find a screenshot of the entity from which this page was generated.

On the left side of the page you’ll find a list of actions available on this entity. Those actions correspond to business methods provided by the entity:

ASP NET WebForms (2)

Here is the screen displaying for the Contact entity when clicking on the “LoadAll” button:
It lists all the contacts through an HTML table and enables sorting.
From it you can edit or remove a contact.

ASP NET WebForms (3)

And the one when clicking on the “Edit” button:

ASP NET WebForms (4)

UI generated using the Smart Client (WPF) Producer:

The first screen generated by default lists all namespaces and their contained entities:

SmartClient (1)

Clicking on an entity will load all the data corresponding to it:
From it you can create, edit or remove an entry.

SmartClient (2)

Clicking on an entry will open a window to edit it:

SmartClient (3)

UI generated using the SharePoint WebParts Producer:

The homepage generated by default lists all namespaces:

SharePoint (1)

Clicking on a namespace lists all its entities:

SharePoint (2)

Clicking on an entity gets you to the entity page:
It lists all the data of that entity through a Web Part.
From it you can create a new entry, detail, edit or delete one.
SharePoint (3)

For instance, clicking on an entry brings up its details:

SharePoint (4)

and clicking on the “Edit” button brings up the editor:

SharePoint (5)

As you can see, from a same model we have generated several UIs all consistent with each other.

Besides, thanks to the Platform Independent Form Editor you can also define forms directly on their entities which will then be translated into actual screens by user interface producers. We talked about it in details in this article.

Finally, in the case you did not find the desired producer, I remind you that you can create your own template and use it with the Template Producer or you can even create your own custom producer. All you’ll need to do would be to implement the IProducer interface.

To sum up, CodeFluent Entities is able to generate 100% functional applications with the UI of your choice just by using the right producer.

Cheers,

Thibault Nestor

  1. November 27, 2012 at 11:14 pm

    That was a great illustration and emphasizing the fact that CodeFluent Entities is totally UI-agnostic. This s really helpful and very valuable information. Great thanks and I admire so much of your work.

    • SoftFluent
      November 28, 2012 at 9:59 am

      Glad you like it, thank you Julia.

  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s