Full item selection listview (not the property one)
Full item selection listview (not the property one)
Full item selection listview (not the property one)
Full item selection listview (not the property one)
Full item selection listview (not the property one)
Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one)
Full item selection listview (not the property one) Full item selection listview (not the property one)
Full item selection listview (not the property one)
Go Back  Xtreme Visual Basic Talk > > > Full item selection listview (not the property one)


Reply
 
Thread Tools Display Modes
  #1  
Old 01-06-2010, 10:27 AM
ultimate-tester ultimate-tester is offline
Newcomer
 
Join Date: Jan 2010
Posts: 4
Default Full item selection listview (not the property one)


Hello all.

I would like to introduce myself. I'm Jordi, 16 (almost 17) years old, and I'm learning visual basic.

I already have one year experienced in c++, and built many private applications.

My question is simple to ask, and simple to answer I think.
When I select an item in a listview, I want the full item to be selected. Now only the TEXT in the listview item is selected. I've made a picture to clearify my problem.

The picture in the link below is splitted up in two pictures. It shows what I currently have, and what I want (my aim)

http://img710.imageshack.us/img710/3460/wantedh.png

I know 100% this is possible, cuz I've seen it already in this application:

http://bea.stollnitz.com/files/17/BoundListView.png

I hope someone can help me

~ Ultimate-Tester
Reply With Quote
  #2  
Old 01-06-2010, 10:51 AM
AtmaWeapon's Avatar
AtmaWeaponFull item selection listview (not the property one) AtmaWeapon is offline
Fabulous Florist

Forum Leader
* Guru *
 
Join Date: Feb 2004
Location: Austin, TX
Posts: 9,500
Default

It's not easily achievable using Windows Forms. I thought the FullRowSelect property might be key, but it's not quite what you want. This leaves only using the "owner draw" feature of the ListView control, which means you have to write all of the logic for displaying an item. Owner-draw is clumsy and complicated if you aren't used to it.

In WPF, it's a little easier because ListView is an ItemsControl and they are essentially always owner-drawn. The mechanism for doing this in WPF is a lot more natural compared to the WinForms method, but using WPF requires that you understand some other concepts first.

I'm going to write an example of an owner-draw ListView and provide explanation. It'll take a little while. Maybe someone else will find a decent tutorial to link you to between now and then.
__________________
.NET Resources
My FAQ threads | Tutor's Corner | Code Library
I would bet money 2/3 of .NET questions are already answered in one of these three places.
Reply With Quote
  #3  
Old 01-06-2010, 12:12 PM
ultimate-tester ultimate-tester is offline
Newcomer
 
Join Date: Jan 2010
Posts: 4
Default

Thanks

I will look more into this WPF, and would love to see an example

~ Ultimate-Tester
Reply With Quote
  #4  
Old 01-06-2010, 05:03 PM
AtmaWeapon's Avatar
AtmaWeaponFull item selection listview (not the property one) AtmaWeapon is offline
Fabulous Florist

Forum Leader
* Guru *
 
Join Date: Feb 2004
Location: Austin, TX
Posts: 9,500
Default

I've attached demonstration projects for WinForms and WPF.

There's a couple of items in the ListView, and I made some gradient images to represent them. I configured the ListView to display in "tile" mode so it would put the text next to the image, then verified that FullRowSelect didn't do what I wanted here. Time to talk about owner-draw. It's a big topic and relies on some familiarity with how to draw graphics in .NET; I'm going to gloss over some of the graphics stuff to focus on owner-draw, so feel free to ask about the graphics stuff later.

Many of the Windows Forms controls that contain items (ListBox, ComboBox, etc.) provide "owner-draw" functionality. When one of these controls is in owner-draw mode, then you are responsible for drawing the items instead of Windows. This requires a little bit of familiarity with the GDI+ API that is primarily implemented in System.Drawing. The Graphics class is the superstar that does most of the work. There is no formal interface for owner-drawn controls, but in general you can expect to find the following members of the control:
  • OwnerDraw property - If this property is set to False, the control draws itself and no owner-draw events are raised. If it is set to True, then you are expected to draw elements of the control by handling one or more owner-draw event.
  • DrawItem event - If OwnerDraw is true, the control raises this event when it needs you to draw an item. The EventArgs-derived parameter to the class tends to provide information about where you need to draw, how much room you have, the item that needs to be drawn, and a Graphics object you should use to draw. There is also usually some information that is specific to this control's owner-draw logic; read the documentation before writing code so you are armed with knowledge.
  • DrawXXXX events - Some controls have additional "draw something" events you may or may not need to use. For example, ListView has the DrawSubItem event that it raises when the ListView is in "details" mode and thus sub-items are visible. It generally works like a DrawItem event, but draws a different thing.
  • MeasureItem/MeasureXXXX events - Some controls want to be able to retrieve the size of an item. For example, the ComboBox control needs to know how big each item is to size its drop-down; this size is passed as part of the bounds to the DrawItem event. ListView doesn't use this event.

For the purposes of this project, we need a ListView configured for owner-draw. It needs to draw each item by drawing the image, then the text, and make sure to draw the selection rectangle the way we want it. I created the CustomListView class to make this a little more convenient. The constructor enables double-buffering and turns on OwnerDraw; you can mostly ignore code there. The real work goes in on the OnDrawItem method. This method is called when the DrawItem event is raised. I commented it fairly heavily, but here's the gist of how it works:

It starts by setting e.DrawDefault to False to indicate I don't want the normal drawing logic to happen. I don't think this is necessary but it can't hurt. Next comes drawing the background; if the item is selected the OS highlight color should be used, but if not then the item's given background color should be used. Graphics.FillRectangle() fills in the background. Next up is the image for the item. I configured the ListView to use a LargeImageList with 100x100 images, but not every item has to have an image. To take care of this, I only grab the image if the item's ImageIndex property is not -1, and only call Graphics.DrawImage() to draw it if an image was found. Next comes the text. I went a little overboard here. If there's no images at all, I want to draw the text centered in the item bounds. If there is at least one item with an image, I want to display the text as if an image were at each item. So the first chunk of code sets up textRect, which defines the area in which text will be drawn. The next chunk sets up a StringFormat structure that is used to define *how* the text is drawn. In this case, I want the text left-aligned and vertically centered. Finally, I use Graphics.DrawString() to draw the item's text within the textRect area with the StringFormat I created. Finally, the item might need a focus rectangle. I use the Focused property to determine if the ListView has focus, and if the item is selected I use the ControlPaint class to draw the focus rectangle. That's it.

The first version used the e.State property to determine if the item was selected and focused. It turns out there's a bug that causes this property to be wrong sometimes; if you feel like it, vote that the bug is important to help make .NET better.

Now, that's how Windows Forms did it, let's look at the WPF solution.

In WPF, you don't tend to use manual painting mechanisms. The first weirdo thing about WPF is XAML, an XML-like language used to define the UI. You tend to "owner draw" controls in WPF by writing XAML that represents what the control should look like and using a feature called data binding to set properties on it. Here's an inaccurate rewording that usually makes it click for people familiar with Windows Forms: "In WPF, controls can display just about anything if you do a little work. If you build a control that can display Foo objects, you can pass this control as a template to a WPF control, and when a Foo object needs to be displayed your template control will be used to display it."

So first, we need the object to display. In Windows Forms, this object is ListViewItem. WPF has a ListViewItem, but it's an automatic wrapper that doesn't do much. Since we want to display some text and an image, we need a class with text and image properties. I made the Data class to represent this: it has an Item and Text property. Item is expected to contain the URL to an image; there's a funky URL format that can be used to access application resources I'll take advantage of. Now we need to make the "template control" for the ListView to know how to display Data objects.

I did the template in the <Window.Resources> section. There's several different ways I could have done it, but the pros and cons are for a discussion of WPF itself so I'm not talking about it. It starts with a StackPanel: this will arrange the items I put inside of it from left to right. The StackPanel contains an Image control and a TextBlock. See the weird "Source={Binding Item}" parts? That's WPF data binding. It says "when you get an object, use the value of its Item property for your Source property." There's a lot you can do with this, but for now just understand what it does.

The property of the ListView that accepts the template is ItemTemplate; in the XAML I told WPF to look in the resources for the template I defined. From there, all I have to do is add some Data objects. I could have done this from code, but I'm lazy and already in the XAML. The weird URL for the image resources is there for you to see in all its glory.

The neat thing about the WPF solution is I didn't even write any VB code other than the object; everything was done in the designer. Even the XAML was a lot easier; instead of saying "draw this here" it was more like "use this control and give it this value". Since the template represents the entire item, we automatically get the whole thing highlighted when it's selected. I'd also like to point out that it took me nearly an hour to get the WinForms version working just right, not including 20 minutes to file a bug report. Compare this to 10 minutes for the WPF one. I like WPF and wish I got to use it more for examples!
Attached Files
File Type: zip WinFormsListView.zip (34.7 KB, 85 views)
File Type: zip WpfCustomListView.zip (17.3 KB, 42 views)
Reply With Quote
  #5  
Old 01-07-2010, 04:50 AM
ultimate-tester ultimate-tester is offline
Newcomer
 
Join Date: Jan 2010
Posts: 4
Default

Wow thanks.. That's a bunch of information You sure took the time to write this
Reply With Quote
  #6  
Old 02-12-2014, 04:53 AM
Rip_Diggler Rip_Diggler is offline
Newcomer
 
Join Date: Feb 2014
Posts: 1
Default

Hi there, is it still possible to get hold of your zip examples? They won't download anymore.
Reply With Quote
  #7  
Old 02-12-2014, 04:50 PM
passel's Avatar
passelFull item selection listview (not the property one) passel is offline
Sinecure Expert

Super Moderator
* Guru *
 
Join Date: Jun 2003
Location: Upstate New York, usa
Posts: 8,028
Default

They're hosted on this site, so should download fine. I just downloaded them, using FireFox, and they both downloaded for me.
I often use IE as well, and haven't had a problem downloading.
Did you just right click on the file and do a "Save ... as " operation. Perhaps something on your end, like a firewall, is preventing the download?
__________________
There Is An Island Of Opportunity In The Middle of Every Difficulty.
Miss That, Though, And You're Pretty Much Doomed.
Reply With Quote
Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off

Forum Jump

Advertisement:





Free Publications
The ASP.NET 2.0 Anthology
101 Essential Tips, Tricks & Hacks - Free 156 Page Preview. Learn the most practical features and best approaches for ASP.NET.
subscribe
Programmers Heaven C# School Book -Free 338 Page eBook
The Programmers Heaven C# School book covers the .NET framework and the C# language.
subscribe
Build Your Own ASP.NET 3.5 Web Site Using C# & VB, 3rd Edition - Free 219 Page Preview!
This comprehensive step-by-step guide will help get your database-driven ASP.NET web site up and running in no time..
subscribe
Full item selection listview (not the property one)
Full item selection listview (not the property one)
Full item selection listview (not the property one) Full item selection listview (not the property one)
Full item selection listview (not the property one)
Full item selection listview (not the property one)
Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one) Full item selection listview (not the property one)
Full item selection listview (not the property one)
Full item selection listview (not the property one)
 
Full item selection listview (not the property one)
Full item selection listview (not the property one)
 
-->