How to add a listViewItem with its own unique image - c#

C#'s ListView has the follow add methods available for adding an entry
public virtual ListViewItem Add(ListViewItem value)
public virtual ListViewItem Add(string text)
public virtual ListViewItem Add(string text, int imageIndex)
public virtual ListViewItem Add(string text, string imageKey)
public virtual ListViewItem Add(string key, string text, int imageIndex)
public virtual ListViewItem Add(string key, string text, string imageKey)
Scenario: I have a ListView and wish to dynamically add ListViewItems with their own unique images in the first column. Furthermore these images can be updated depending upon state changes
Question: How would you do you do this?
Code I'm working with
private void AddToMyList(SomeDataType message)
{
string Entrykey = message.ID;
//add its 1 column parameters
string[] rowEntry = new string[1];
rowEntry[0] = message.name;
//make it a listviewItem and indicate its row
ListViewItem row = new ListViewItem(rowEntry, (deviceListView.Items.Count - 1));
//Tag the row entry as the unique id
row.Tag = Entrykey;
//Add the Image to the first column
row.ImageIndex = 0;
//Add the image if one is supplied
imagelistforTypeIcons.Images.Add(Entrykey, message.marker.markerIcon);
//finally add it to the device list view
typeListView.Items.Add(row);
}

There are two things you need to do
Add image to ImageList if it isn't already in it
Create new ListViewItem and assign image from previous point to it
It could go like this, based on your code:
// Add markerIcon to ImageList under Entrykey
imagelistforTypeIcons.Images.Add(Entrykey, message.marker.markerIcon);
// Use icon from ImageList which is stored under Entrykey
ListViewItem row = new ListViewItem(rowEntry);
row.ImageKey = Entrykey;
// Do whatever else you need afterwards
row.Tag = Entrykey;
....
Problem with code in your question (without actually trying it out) looks to be in ImageIndex you are assigning.
you are adding new image to one image list, but assigning an image to ListViewRow from a different one
you are providing image index in constructor but setting it to 0 afterwards (why?)
you are providing wrong image index in the first place, because you calculated index of last image in the image list, before adding the new image.
So your code could also be fine like this:
// Add markerIcon to ImageList under Entrykey
imagelistforTypeIcons.Images.Add(Entrykey, message.marker.markerIcon);
// Use icon from ImageList which is stored under Entrykey
ListViewItem row = new ListViewItem(rowEntry);
row.ImageIndex = imagelistforTypeIcons.Items.Count - 1;
// Do whatever else you need afterwards
row.Tag = Entrykey;

Related

C# ListViewItem Method, Listview items adding problem

Here is part of code:
private void load_lv() {
lv_ss.Items.Clear();
lv_ss.Items.Add(supp.lv_standstill((optionsloaded) ? cbx_options.SelectedIndex : 0));
}
lv_ss is a Listview.
I want to add items to lv_ss using another method:
Here is another part of the code:
public ListViewItem lv_standstill(int option) {
string[] row = new string[6];
ListViewItem lv_item = new ListViewItem();
//not important part of code
//loading data from sql etc to row[]
if (first) {
lv_item = new ListViewItem(row);
first = false;
} else {
lv_item.SubItems.AddRange(row);
}
}
return lv_item;
}
Every new item of lv_item contains a row.
The problem is to move all ROWS to lv_ss listview.
When I use lv_ss.Items.Add it puts only first row.
I've tried with ListViewItem.ListViewSubItemCollection .. and then foreach subitem.
But it reads a single string from a row, not a whole row.
Not sure how to do that.
I mean, of course, I can put whole code in -> private void load_lv(){}
But I'm stubborn :D
Any help or ideas?

Images in the first column of a listview in C# WinForms

I'm with a little problem on a project.
As you can see in the image, I have a ListView with some data pulled from a List of objects from the class person. This class also has an attribute that keep the path of an image chosen by the user, which is supposed to show on the first column of the ListView, where it says teste.
I've tried the following code:
ImageList imgs = new ImageList();
imgs.ImageSize = new Size(40, 40);
foreach (user list in Global.userslist)
{
imgs.Images.Add(Image.FromFile(list.Photo));
}
listview1.SmallImageList = imgs;
foreach (user list in Global.userslist)
{
imageList1.Images.Add(Image.FromFile(list.Photo));
listview1.Items.Add(new ListViewItem(new string[] { "teste", Convert.ToString(list.Id), lista.Name, list.Birthday.ToString("dd/MM/yyyy") }));
}
You should set ImageIndex or ImageKey property for the item to show the image.
You can pass the index or key in constructor of ListViewItem. Also you can assign the value using the ImageIndex or ImageKey property.
Example
In your code, you can set the image key when adding them to ImageList:
imgs.Images.Add(list.Id.ToString(), Image.FromFile(list.Photo));
Then when creating items, use the ImageKey:
listview1.Items.Add(new ListViewItem(new string[] { ... ... }, list.Id.ToString()));

Set a name for each ImageSource in a list

I call an API and get from there an id, a name and an URL for images...
I display them in a flipview and I used to convert them, saved them in a folder, convert them back and show them...
So I thought it would be much easier if I show them directly from their URL.
Now, when the user clicks (taps) on the image, it has to go to another page to show the detail of that image (and it was working fine, when saving the pic, since I named them by the id (id.png))
is there anyway I can name the ImageSource to be this id, or give it like a property (Title or Name)?
var pics = from special in GlobalVariables.Special
where special.special == "1"
select new { id = special.id, name = special.name, image = special.banner_image, featured = special.special };
foreach (var item in pics)
{
await savePicToDisk(item.image, item.name, item.id, item.featured);
}
So, then, instead of save them:
List<ImageSource> listOfImages = new List<ImageSource>();
string url = "http://52.8.2.140" + picAddress;
ImageSource urlOfPic = new BitmapImage(new Uri(url, UriKind.Absolute));
listOfImages.Add(urlOfPic);
Then, where I have to show them, I just bind it to the flipview:
flipView1.DataContext = Classes.Special.listOfImages;
The Item_Click event's arguments have a property ClickedItem (in some cases you may also need OriginalSource), which you can use to point to your item in a collection. If item's class has a property responsible for Name/Id/other you can freely pass that when navigating, other solution may be passing an index of selected item in the collection. Sample code;
private void ItemClick(object sender, ItemClickEventArgs e)
{
var item = e.ClickedItem as ItemClass;
if (item != null)
Frame.Navigate(typeof(DetailPage), item.ID);
// if your item contains a Name/Id/other you can pass that when navigating
// you can also pass index of your item in collection if you need
}

ListView does not show images after switching view mode

When I add item(s) to the ListView in any other than LargeIcon view mode, the ListView stops showing the images from LargeImageList when it is switched back to LargeIcon. This situation lasts until new item is added to the ListView in the LargeIcon mode.
So the following sequence illustrates the problem:
create ListView, add column, set View to Details
create ImageList, set ImageSize, assign it to ListView.LargeImageList
create new ListViewItem, set its ImageKey
create new image, add it to the ImageList with given key
add the ListViewItem to the ListView
switch the ListView mode to LargeIcon
no images are shown
repeat steps #3 - #6, now in the LargeIcon mode
all images are shown as expected
What is the point I am still missing?
I have tried following:
Invalidate the ListView
Re-assign the LargeImageList before/after adding the item (even through null)
The test code for those who like it more than words:
public partial class Form1 : Form
{
int counter = 0;
ImageList iList = new ImageList();
private string GetNewKey()
{
return counter++.ToString();
}
private Image GetNewImage(Size size)
{
var bmp = new Bitmap(size.Width, size.Height);
using (var gra = Graphics.FromImage(bmp))
{
var rnd = new Random();
var lines = rnd.Next(1000);
for (int l = 0; l < lines; ++l)
{
var pen = new Pen(Color.FromArgb(rnd.Next(256), rnd.Next(256), rnd.Next(256)));
var p1 = new Point(rnd.Next(size.Width), rnd.Next(size.Height));
var p2 = new Point(rnd.Next(size.Width), rnd.Next(size.Height));
gra.DrawLine(pen, p1, p2);
}
}
return bmp;
}
public Form1()
{
InitializeComponent();
iList.ImageSize = new Size(100, 100);
listView.LargeImageList = iList;
listView.Columns.Add("name");
}
private void buttonAdd_Click(object sender, EventArgs e)
{
var key = GetNewKey();
var lvi = new ListViewItem()
{
Name = key,
Text = "blabla",
ImageKey = key,
};
iList.Images.Add(key, GetNewImage(new Size(100, 100)));
listView.Items.Add(lvi);
}
private void buttonClear_Click(object sender, EventArgs e)
{
listView.Items.Clear();
}
private void buttonLarge_Click(object sender, EventArgs e)
{
listView.View = View.LargeIcon;
}
private void buttonDetails_Click(object sender, EventArgs e)
{
listView.View = View.Details;
}
}
EDIT:
For anyone who would suffer the same problem. After some experiments, there is at least stupid poor man's workaround:
Modify the ImageList, the ListView somehow detects its change and reloads the images for LargeIcon mode. The questions are how it detects the change and why does it ignore the ImageList after mode change...
private void FixIt()
{
// Trigger a reload of the ListView.LargeImageList
if (listView.View == View.LargeIcon)
{
var key = "Dummy image to be deleted right after its insertion...";
iList.Images.Add(key, new Bitmap(1, 1));
iList.Images.RemoveByKey(key);
}
}
EDIT #2:
I have also discovered some other funny features the ListView and associated components have. You might want to check them in answers of question 4097912 and question 23059678
To solve your problem
You could avoid this by useing ImageIndex instead of ImageKey to connect your ListView with the ImageList. So in your buttonAdd_Click event use:
var lvi = new ListViewItem()
{
Name = key,
Text = "blabla",
//ImageKey = key,
//Use ImageIndex and don't set both
ImageIndex= Convert.ToInt32(key) //you could just use count++
};
The reason behind this problem:
The reason behind this is not clear to me, but I assume this may be a bug that when changing from Details to LargeIcon, it only checks ImageIndex in default and if you set ImageKey the ImageIndex will be set to -1. Or may be this is by design, I don't know (see ImageKey section below), since you don't have a SmallImageList, so when changing to LargeIcon view, ImageIndex is null or -1 and the ImageKey is ignored.
About ListViewItem.ImageIndex Property
The ImageKey and ImageIndex properties are mutually exclusive, meaning if one is set, the other is ignored. Furthermore, if you set the ImageKey property, the ImageIndex property is automatically set to -1. Alternatively, if you set the ImageIndex property, the ImageKey is automatically set to an empty string ("").
About ListViewItem.ImageKey Property
If you are using multiple image lists, for small and large icon view, with a ListView control, you should place small and large versions of the image at the same index location in their respective image lists. When switching between views, the index location of the image in one list is used to locate the image in the other list, regardless of the key value specified.
And this can somehow be verified:
using your existing code (use ImageKey)
set ImageIndex for any Item in your listView within the buttonLarge_Click event handler will show you that item's image.
set ImageKey for any Item within the buttonLarge_Click event handler will not show that itme's image.
e.g.:
private void buttonLarge_Click(object sender, EventArgs e)
{
listView.View = View.LargeIcon;
//Set ImageIndex of Item 0 you could see its Icon.
listView.Items[0].ImageIndex= 0 ;
//set ImageKey will change nothing
//listView.Items[0].ImageKey= "0" ;
}

My dynamically created ListViewItems are not displaying in my ListView

I am dynamically creating ListViewItem descendants:
class Application : ListViewItem {
. . .
class LegacyApplication : Application {
I store these first in a List of obects:
private List<object> legacyApps = new List<object>();
..this way:
if (ldbc.appIsLegacy(sPathOfExe)) {
legacyApp = new LegacyApplication(sApp, sTitle, sDesc, sIconFileName, sPathOfExe, appCategoriesForCurrentApp);
}
legacyApps.Add(legacyApp);
...and then I add them to the ListView on the main form this way:
foreach (LegacyApplication LegApp in legacyApps) {
this.listApplications.Items.Add(LegApp);
}
...but the ListView does not display them. It displays the ListView Groups I've created (and each ListViewItem is assigned to one of those groups), but not the ListViewItems themselves...
Updated with requested info:
The constructor for the ListViewItem descendant looks like so:
public LegacyApplication(String AAppName, String ATitle, String ADesc, String AIconFileName, String APathOfExe, List<String> ACategories) {
base.Name = String.Format("legapplvi{0}", AAppName);
base.Text = ATitle; // "Title" is a short description - between exe name and Description
base.ToolTipText = ADesc;
base.EnsureVisible();
// "base" above means ListViewItem; "base" below refers to our Application class*
base.Categories = ACategories;
base.ExePath = APathOfExe;
base.IconFileName = AIconFileName;
}
which adds the following properties to ListViewItem:
public string ExePath
public string IconFileName
public string Category
public List Categories
LegacyApplication adds no further properties to (our) Application class.
I'm not sure what the respondent below means by "subitems" - the ListViewItems are subitems of the ListView Groups, perhaps...?
Updated with unrequested info (TMI?):
OK, I'm thinking I can add columns this way, once all the Groups are assigned to the ListView:
for(var item in listApplications.Groups) {
listApplications.Columns.Add(item)
}
...but now, how do I add specific ListViewItems to particular columns?
Updated after getting it to (sort of) work:
Commenting out this:
listApplications.View = View.Details;
...gets the Items to show. HOWEVER, the Text is truncated, which caused me to pose another question here:
I need to display the entire Text of my ListViewItems (not truncated)
Did you try to create a ListViewItem first and then add into the List instead of using
this.listApplications.Items.Add(LegApp);
Can you provide more details with a code snippet

Categories

Resources