Solved

Display Image list inside ListView

Posted on 2008-06-17
22
26,697 Views
Last Modified: 2011-10-19
Hi All,

I have to display thumbnail images in ListView control. How to give space in between thumb image in List View? (like padding to images)

I have tried:
lstDPView.Margin = new Padding(10, 10, 10, 10);   //// Doesn't work... :-(

This is my code:

            lstDPView = new ListView();
            ImageList imageList = new ImageList();
            imageList.ImageSize = new System.Drawing.Size(67, 95);
            String strDir = "";
            strDir = Environment.CurrentDirectory;
            imageList.Images.Add(Bitmap.FromFile(strDir + @"\img_DP1.jpg"));
            imageList.Images.Add(Bitmap.FromFile(strDir + @"\img_DP2.jpg"));
            imageList.Images.Add(Bitmap.FromFile(strDir + @"\img_DP3.jpg"));
            lstDPView.LargeImageList = imageList;
            ListViewItem item1 = new ListViewItem("");
            item1.ImageIndex = 0;
            ListViewItem item2 = new ListViewItem("");
            item2.ImageIndex = 2;
            ListViewItem item3 = new ListViewItem("");
            item3.ImageIndex = 1;
            // Add the items to the ListView.
            lstDPView.Items.AddRange(new ListViewItem[] {item1,item2,item3});
            lstDPView.Location = new System.Drawing.Point(6, 15);
            lstDPView.Name = "lstDPView";
            lstDPView.Size = new System.Drawing.Size(185, 230);
            lstDPView.ShowItemToolTips = true;
            lstDPView.TabIndex = 0;
            lstDPView.TileSize = new System.Drawing.Size(82, 100);
            lstDPView.UseCompatibleStateImageBehavior = false;
            lstDPView.View = View.Tile;
            lstDPView.ItemSelectionChanged += new ListViewItemSelectionChangedEventHandler(this.lstDPView_ItemSelectionChanged);
            lstDPView.UseCompatibleStateImageBehavior = false;

Thanks in advance.
Babu
0
Comment
Question by:bsbabu7
22 Comments
 
LVL 29

Expert Comment

by:Gautham Janardhan
ID: 21810604
WPF ?
0
 

Author Comment

by:bsbabu7
ID: 21812090
Not WPF
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 21812220
Is the View = Tile necessary, or can you use large icon or small icon?
0
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 

Author Comment

by:bsbabu7
ID: 21816068
I can use large icon , but that will give extra space around image which i dont want to..... (i mean bound space)
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 21816211
Are you just wanting to increase the size of an image slightly (with the image centered), to visually separate the tiled images?
0
 

Author Comment

by:bsbabu7
ID: 21817193
This is my requirement: I need to display images(50px X 60px) in thumbnail view with in 200 X 250 px area (doesn't matter if i get vertical scrool)... and i need 10px gap around each thumbnail image.
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 21817206
Can you attach a screen shot of what it looks like now?
0
 

Author Comment

by:bsbabu7
ID: 21817278
Sure. Please find attached.
sshot.jpg
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 21817425
I don't see anything wrong with the screen shot, and so I must be misunderstanding what you are asking for.
0
 

Author Comment

by:bsbabu7
ID: 21821573
Hi, that is my design screenshot, here i'm attaching my current development screenshot. I exactly like in my design file ...

Thanks.
sshot-work.jpg
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 21821654
So, with tiling, the images don't have as much padding between them, versus the design image, right?
0
 

Author Comment

by:bsbabu7
ID: 21821671
Yes
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 21821722
What happens if you set the TileSize to a larger size?
0
 

Author Comment

by:bsbabu7
ID: 21821892
If i change to LargeIcon.... its look like this....
sshot-work1.jpg
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 21821936
No, I was asking if you have View=Tile, and TileSize larger than (82, 100) what it looks like?

lstDPView.TileSize = new System.Drawing.Size(82, 100);
0
 

Author Comment

by:bsbabu7
ID: 21822097
If i increase tile size is increasing.... but not space in between tiles. I need space to create rectangle around tile.
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 21822250
Have you tried any owner-drawn magic?
0
 

Author Comment

by:bsbabu7
ID: 21822327
This is how i'm creating rectangle around image.
private void lstDPView_ItemSelectionChanged(object sender, ListViewItemSelectionChangedEventArgs e)
        {
          
            ListView lstDP = sender as ListView;
            Graphics g = lstDP.CreateGraphics();
            Rectangle rec = new Rectangle(e.Item.Bounds.X , e.Item.Bounds.Y , e.Item.Bounds.Width , e.Item.Bounds.Height );
            Pen p;
 
            if (e.Item.Selected)
            {
                p = new Pen(Color.FromArgb(((int)(((byte)(42)))), ((int)(((byte)(127)))), ((int)(((byte)(192))))), 5);
            }
            else
            {
                p = new Pen(lstDP.BackColor, 5);
            }
                g.DrawRectangle(p, rec);
                patientDPInit();
        }

Open in new window

0
 
LVL 9

Accepted Solution

by:
Pacman earned 500 total points
ID: 21961054
I would recommend to insert a margin into your bitmaps.
You can do this directly in your source bitmap files, or use following code snippet to copy your existing bitmap (no margins) to a new bitmap, centered with fixed size.
So you get margins around your bitmaps. Use the new bitmap for you listview.

var bigBmp = new Bitmap(200, 200);
 
Graphics gfx = Graphics.FromImage(bigBmp);
//-- copy your bitmap centerd
 
//## todo: here comes your Bitmap
Bitmap yourBmp = null;
 
//## insert here wanted size (with margins)
int nWantedWidth  = 200;
int nWantedHeight = 200;
 
int x = nWantedWidth/2 - yourBmp.Width/2;
int y = nWantedHeight/2 - yourBmp.Height/2;
 
gfx.DrawImage(yourBmp, 
   new Rectangle(x, y, yourBmp.Width, yourBmp.Height), // dest rect
   new Rectangle(0, 0, yourBmp.Width, yourBmp.Height), // source rect
   GraphicsUnit.Pixel);
 
// now you can use "bigBmp" for your listview.

Open in new window

0
 

Expert Comment

by:John500
ID: 32714197
Can any of you take a look at this question:

http://www.experts-exchange.com/Programming/Languages/.NET/Visual_Basic.NET/Q_26185859.html

It's simple solution I'm sure  -   when you know how to do it.

Thanks
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This document covers how to connect to SQL Server and browse its contents.  It is meant for those new to Visual Studio and/or working with Microsoft SQL Server.  It is not a guide to building SQL Server database connections in your code.  This is mo…
This article shows how to deploy dynamic backgrounds to computers depending on the aspect ratio of display
This video shows how to quickly and easily add an email signature for all users on Exchange 2016. The resulting signature is applied on a server level by Exchange Online. The email signature template has been downloaded from: www.mail-signatures…
The Email Laundry PDF encryption service allows companies to send confidential encrypted  emails to anybody. The PDF document can also contain attachments that are embedded in the encrypted PDF. The password is randomly generated by The Email Laundr…

785 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question