Click here to Skip to main content
15,902,112 members
Please Sign up or sign in to vote.
3.50/5 (2 votes)
See more:
I have a drop down list of different things. For example:

umbrella
cap
shirt
football etc..

The above can be the contents of the list box. What I want to do is that when I click on umbrella, I want to display the image of umbrella in the image box. And I want to do it in the way as if the list box item == umbrella, then the image of umbrella should display.

But I can't do this! Can some body please help me with the code?

Everybody's effort is appreciated :-)
Posted
Updated 9-Feb-11 5:57am
v2
Comments
Nish Nishant 9-Feb-11 11:33am    
Is this in WinForms, WPF, Silverlight or some 3rd party custom framework like DevEx?
hanifuk 9-Feb-11 11:35am    
i am using WPF with c#.
Nish Nishant 9-Feb-11 11:56am    
Ok, I'll tag the thread with WPF then.

Here's some sample WPF code:

XML
<StackPanel Orientation="Vertical">
    <ListBox ItemsSource="{Binding Objects}"
            SelectedIndex="{Binding CurrentIndex}" />
    <Image Source="{Binding ObjectImage}" />
</StackPanel>


Here's the corresponding code in the view-model (or data source) :

C#
public string[] Objects { get; set; }

private int currentIndex;

public int CurrentIndex
{
    get { return currentIndex; }

    set
    {
        if (currentIndex == value)
            return;

        currentIndex = value;
        FirePropertyChanged("CurrentIndex");
        UpdateObjectImage();
    }
}


private ImageSource objectImage;

public ImageSource ObjectImage
{
    get { return objectImage; }

    set
    {
        if (objectImage == value)
            return;

        objectImage = value;
        FirePropertyChanged("ObjectImage");
    }
}

private void UpdateObjectImage()
{
    if (CurrentIndex >= Objects.Length)
        return;

    this.ObjectImage = GetImage(Objects[CurrentIndex]);
}

private ImageSource GetImage(string name)
{
    BitmapImage image = new BitmapImage();
    image.BeginInit();
    image.UriSource = new Uri(
      String.Format(
        "pack://application:,,,/YourWpfApplicationName;component/{0}.png",
        name));
    image.EndInit();
    return image;
}
 
Share this answer
 
Comments
hanifuk 9-Feb-11 12:13pm    
thanks for your kind reply, but i think i m not been able to explain my question properly !!
i have a list of items like i mentioned earlier , and in front of this list i have an image box which is empty in the start.
when i click on any item of the list, i check whether that item is umbrella or cap or some thing else.. and then want to display its picture in the image box.i.e
if(item==umbrella) then
load the image of umbrella in the image box
else
load the image of the other item in the image box..
and the images which i want to load is are not in the list, i have to load it manually from the disk.
Nish Nishant 9-Feb-11 12:14pm    
Yes, I know. That's exactly what my code does above :-)

Take a look at the GetImage method. That's where the strings are converted into their matching images. You would of course need to replace that method with a more appropriate image matching code.
Nish Nishant 9-Feb-11 12:15pm    
To be more clear, when the user selects cap, the cap image is shown in the Image control. When the user selects shirt, the shirt image is shown in the Image control. That's what my code does.
Sergey Alexandrovich Kryukov 9-Feb-11 12:36pm    
Nishant, I got it after explanation and gave a compete answer, please see.
--SA
Nish Nishant 9-Feb-11 12:37pm    
Ok, thanks, will take a look at it.
Very different answer after clarification by the comment on my previous Answer by Hanifuk:

First, you need to create some class for an item to store in the list. You requirements mean that it serve dual purpose: to show some text in the list and also to provide information for image presentation. Let's assume this is image file name (could be more complex; this is just for example). To show this item in the list, all you need it to override object.ToString():

C#
internal class ListItemHelper {
    internal ListItemHelper(string itemText, string imageFileName) {
        this.ItemText = itemText;
        this.FImageFileName = imageFileName;
    } //ListItemHelper
    public override string ToString() {
        return ItemText;
    } //object.ToString()
    internal string ImageFileName { get {return FImageFileName;} }
    private string ItemText, FImageFileName;
} //class ListItemHelper


Use this class to add information to your list:

C#
MyList.Add(new ListItemHelper("First day of vacation", "2010-06-01-1343.jpg"));
//item will show int the list: First day of vacation


Now you need to setup a handler for selection of the item in your list:

C#
void ShowMyPicture(string source) {
/*...*/
//should be able to handle null as "nothing selected"
} //ShowMyPicture

//...

MyList.SelectionChanged += (sender, eventArgs) => {
   //you know the sender is your list box, so not afraid of the cast:
   ListBox listBox = (ListBox)sender;
   //you know the item is alway ListItemHelper, so not afraid of the cast:
   if (listBox.SelectedItem == null)
       ShowMyPicture(null);
   else {
       ListItemHelper helper = (ListItemHelper)listBox.SelectedItem;
       ShowMyPicture(helper.ImageFileName); //you probaly know what to do
   } //if
}; //MyList.SelectionChanged handler


That's it.

—SA
 
Share this answer
 
v4
Comments
Nish Nishant 9-Feb-11 12:38pm    
I voted 5 since it will work.

I personally will not use this as it involves code-behind for the event handlers, which won't fit into MVVM approaches.

But the OP does not seem to be using MVVM so this will work fine for him.
Sergey Alexandrovich Kryukov 9-Feb-11 12:42pm    
Oh, thank you. Also added a fix to handle no-selection situation.
Yes, I test most of the code I write, should work.
--SA
Sergey Alexandrovich Kryukov 9-Feb-11 12:54pm    
And, yes, how would you do it with MVVM?
(If this is not couple of hints, don' answer.)
--SA
Nish Nishant 9-Feb-11 12:55pm    
My answer fits in with MVVM since it achieves the image match via data binding.
Sergey Alexandrovich Kryukov 9-Feb-11 12:59pm    
Oh, sorry, after my previous question and update of the page I noticed you modified the answer, thank you. Let's see what OP can understand...
--SA
You can add to list items practically whatever you want:

MyList.Items.Add(MyImage);


—SA
 
Share this answer
 
Comments
hanifuk 9-Feb-11 11:55am    
no my friend ! i don't want to add any thing into the list.
i want to display images of different items according to the names of the contents of the listbox. i.e
i want to check
if(the listbox content==umbrella) then
load an image of umbrella on the image box from a specific location of my hard disk.
that's it.
can u help me with this ??
Sergey Alexandrovich Kryukov 9-Feb-11 12:07pm    
Or, this is easy! You did not explain it. I'll show you...
--SA

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900