Get name of selected listbox item (WPF C#)?

Question

all. I have an app that scans a picture folder and displays the images along with their names in a listbox. Each image and image name (displayed in a textblock next to the image) is stored in a horizontal stackpanel inside the listbox.

I've been trying all afternoon to find a way of displaying the image name in a textbox when the user selects it in the listbox. Sounds very simple, and I'm sure it is, but I can't seem to get it to work.

Can anyone point me in the right direction as to the best way of doing this? Thanks.

Here is my xaml if it helps:

<Grid>

    <ListBox ItemsSource="{Binding AllImages}" Margin="0,0,262,0" Name="listBox1" MouseLeftButtonDown="listBox1_MouseLeftButtonDown">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Image Source="{Binding Image}" Width="50" Height="50" Margin="6"/>
                    <TextBlock Text="{Binding Name}" Margin="6" />
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>        
    <TextBox Height="23" HorizontalAlignment="Left" Margin="265,148,0,0" Name="textBox1" VerticalAlignment="Top" Width="198" />
</Grid>

And my code behind:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = this;
    }

    public class MyImage
    {
        private ImageSource _image;
        private string _name;

        public MyImage(ImageSource image, string name)
        {
            _image = image;
            _name = name;
        }

        public override string ToString()
        {
            return _name;
        }

        public ImageSource Image
        {
            get { return _image; }
        }

        public string Name
        {
            get { return _name; }
        }
    }

    public List<MyImage> AllImages
    {
        get
        {
            List<MyImage> result = new List<MyImage>();
            string filePath = @"D:\Projects\Visual Studio 2010\WpfApplication5\WpfApplication5\bin\Debug\ImageFolder";
            string[] files = Directory.GetFiles(filePath);
            foreach (string filename in files)
            {
                try
                {
                    result.Add(
                    new MyImage(
                    new BitmapImage(
                    new Uri(filename)),
                    System.IO.Path.GetFileNameWithoutExtension(filename)));                        
                }
                catch { }
            }
            return result;
        }
    }        

}

score 0 · Accepted Answer · edited May 23 '17 at 11:47

0

Take a look at this question.

How do I bind a Listview SelectedItem to a Textbox using the TwoWay mode?

In your case use

<TextBox Height="23" 
  HorizontalAlignment="Left" 
  Margin="265,148,0,0" 
  Name="textBox1" 
  VerticalAlignment="Top" Width="198" 
  Text="{Binding SelectedItem.Name, ElementName=listBox1}"/>

edited May 23 '17 at 11:47

Community

1
1

answered Apr 21 '11 at 14:21

Russell Troywest

8,635
3
35
40

This is actually how I was thinking it should be done, but I'm getting the exception error: "A TwoWay or OneWayToSource binding cannot work on the read-only property 'Name' of type 'WpfApplication5.MainWindow+MyImage'." - I have included my code behind in the first post if it helps. Thanks. – SkullJacker Apr 21 '11 at 14:42
A google search would lead you to this: http://stackoverflow.com/questions/590269/a-twoway-or-onewaytosource-binding-cannot-work-on-the-read-only-property I expect that's the problem as your textbox would allow the user to alter the value assigned to it. You probably want to use some sort of label anyway unless you want people to be able to change the name? – Russell Troywest Apr 21 '11 at 14:51
Ahh, I see. Thanks very much. I changed it to: Text="{Binding SelectedItem.Name, ElementName=listBox1, Mode=OneWay}", and it works perfectly. Thank you for helping me understand. – SkullJacker Apr 21 '11 at 14:56

score 0 · Answer 2 · answered Apr 21 '11 at 14:25

To retrieve the selected image from code, you have at least 3 options (I assume your images are represented by a class ImageItem)

Set IsSynchronizedWithCurrentItem to true on your ListBox, and use the following code to retrieve the selected item:
```
ICollectionView view = CollectionViewSource(AllImages);
ImageItem selectedImage = (ImageItem)view.CurrentItem;
```
Bind the SelectedItem of the ListBox to a property in your DataContext:
```
<ListBox .... SelectedItem="{Binding SelectedImage}">
```

Access the SelectedItem property directly from code-behind:

ImageItem selectedImage = (ImageItem)listBox1.SelectedItem;

Of course, if you just want to show the name in a TextBlock, you can use Russell Troywest's solution

Get name of selected listbox item (WPF C#)?

2 Answers2