Hi Guys,

I wanted to share with you, another list view enhancement which allows to add a panel control to each list view item. Combined with the previous enhancement of adding a control in sub items, you can achieve allot of interesting user interfaces. We have been creating those enhancements as part of our professional services for some very interesting projects which where able with these enhancements to create very complex scenarios which in most of them involved data editing and hierarchical views.

Here is an sample view implemented with in the catalog application which provides an edit / commit button that opens a panel with multiple editing options that allow to edit the record:

The capability was implemented as a generic API that allows any control to serve as a sub item and any control to server as a panel. The possibilities here are enabling a very wide range of scenarios to be implemented.

So how do the API work?

Well the sub item was explained in a previous post but I will quickly do a reminder here. Every list has a sub items collection which you can call the add method providing the content of it. If you define the column type corresponding  with sub item as a control you can alternativlly use an overload that accepts a control. Now the panel is even simpler and can be done by two possible APIs. You can simply add a list view item using one of the ListView.Items.Add overloads that excepts a control to be used as a panel or you can create an instance of ListViewPanelItem which accepts a control in it's constructor and assign it to the list view.

Here is a sample code that allows you to add both a sub item control and a panel:

// Create the list view
ListView objListView = new ListView();
objListView.Dock = DockStyle.Fill;

// Create the list view columns and define the second column as a control column
objListView.Columns.Add(new ColumnHeader("name", "Name", 150, ListViewColumnType.Text);
objListView.Columns.Add(new ColumnHeader("button", "", 150, ListViewColumnType.Control);

// Create a user control or any other control as the panel
ListViewControlPanel objPanel = new ListViewControlPanel();

// Create a new item with a panel and the first sub item as "Some text"
ListViewItem objItem = this.mobjListView.Items.Add(objPanel, "Some text");


// Create a button and add it to the sub items collection as the second item
Button objButton = new Button();
objButton.Tag = objItem;
objButton.Text = "Edit";
objItem.SubItems.Add(objButton);

This capability will be released with beta 2.

Hope you like...
Cheers,
Guy

Guy & VWG Team

This enhancement is very cool!

I think makes a lot more sense to have an in-situ form with fields to do data editing than direct editing inside of a grid (like the datagrid).

This technique allows you to have much more control over the editing process.

I assume based on your screen shot that you can have more than one open and active panel exposed at once?

Now we just need to get 6.4 stable enough!

Mitch

Hi Guy & VWG Team,

Congratulations

I use version 6.4 beta1c and already incorporates some similar options.

I will look for the inclusion of control ListViewControlPanel to study the embedded options and facilities.

The control ListViewControlPanel will solve the problem of non-functioning of the left and right keys on a control TextBox embedded in the control ListView?

To see the problem and some similar options, you can access the link: http://www.envision.com.br/SH-Query

NOTE: The example is only for testing.

Drag&Drop, DoubleClick or use the button "+" in the explorer.
In tab: Elements - column Header (TextBox)
In tab: Filters - example of use of buttons in addition to Textbox.

If you use the link BI-Verum, note that it was developed in WebGui version much earlier.

Best regards,

CHW