I want to be able to select an item and then edit its label:

Select an item
Item is highlighted
Click on it's label
Label's TextBlock is replaced with TextBox
Modify the label
Only one item can be edited at a time

End the editing:

Click onto item's icon:
- TextBox is replaced back with TextBlock
- Item remains highlighted
Another item is clicked:
- TextBox is replaced back with TextBlock
- Edited item is unselected
- Clicked item is selected and highlighted
Any other area of the window is clicked:
- TextBox is replaced back with TextBlock
- Edited item remains highlighted

The behaviour should be pretty much as in Windows Explorer.

I managed to accomplish most of the requirements. Still I get random results. For example on first launch I could click straight onto label to edit it. The item itself remains not highlighted. This occurs only at start.

~~Also using the scroll-bar does not take focus off the list item. This allows to edit multiple items at the same time.~~

XAML

Code

public partial class DailyImages
{
 public DailyImages()
 {
 InitializeComponent();

 ViewModel.DailyImages dailyImages = new ViewModel.DailyImages();
 _mediaItemList.DataContext = dailyImages;
 }

 private void OnClickLabelBlock(object sender, MouseButtonEventArgs e)
 {
 TextBlock notes = sender as TextBlock;
 if (notes == null) return;

 MediaItem selectedMedia = notes.DataContext as MediaItem;
 if (selectedMedia == null) return;

 // Multiple items might be selected
 // Clear all selected items
 _mediaItemList.SelectedItems.Clear();

 // Reselect
 selectedMedia.IsSelected = true;
 selectedMedia.IsEditing = true;

 Mouse.Capture(this, CaptureMode.SubTree);
 }

 private void OnTextLostFocus(object sender, RoutedEventArgs e)
 {
 TextBox textBox = sender as TextBox;
 if (textBox == null) return;

 MediaItem mediaItem = textBox.DataContext as MediaItem;
 if (mediaItem == null)
 return;

 // End the label editing
 mediaItem.IsEditing = false;

 ReleaseMouseCapture();
 }

 private void OnClickMediaList(object sender, MouseButtonEventArgs e)
 {
 // End the label editing
 foreach (MediaItem mediaItem in _mediaItemList.Items)
 mediaItem.IsEditing = false;

 ReleaseMouseCapture();
 }
}

MediaItem.cs

public class MediaItem : INotifyPropertyChanged
{
 private bool _isEditing;
 private bool _isSelected;
 private string _label;

 public MediaItem()
 {
 IsEditing = false;
 _isSelected = false;
 }

 public bool IsEditing
 {
 get { return _isEditing; }
 set
 {
 if (_isEditing == value) return;
 _isEditing = value;
 OnPropertyChanged("IsEditing");
 }
 }

 public string Label
 {
 get { return _label; }
 set
 {
 _label = value;
 OnPropertyChanged("Label");
 }
 }

 public DateTime Date { get; set; }
 public string IconPath { get; set; }

 public bool IsSelected
 {
 get { return _isSelected; }
 set
 {
 _isSelected = value;
 OnPropertyChanged("IsSelected");
 }
 }

 public event PropertyChangedEventHandler PropertyChanged;

 [NotifyPropertyChangedInvocator]
 protected virtual void OnPropertyChanged(string propertyName)
 {
 PropertyChangedEventHandler handler = PropertyChanged;
 if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
 }
}

DailyImages.cs

public class DailyImages
{
 private ObservableCollection _mediaItems;

 public DailyImages()
 {
 _mediaItems = new ObservableCollection();

 _mediaItems.Add(new MediaItem {Label = "Image 1", IconPath = "Resources/Icon1.png"});
 _mediaItems.Add(new MediaItem {Label = "Image 2", IconPath = "Resources/Icon2.png"});
 _mediaItems.Add(new MediaItem {Label = "Image 3", IconPath = "Resources/Icon3.png"});
 _mediaItems.Add(new MediaItem {Label = "Image 4", IconPath = "Resources/Icon4.png"});
 _mediaItems.Add(new MediaItem {Label = "Image 5", IconPath = "Resources/Icon5.jpg"});
 _mediaItems.Add(new MediaItem {Label = "Image 6", IconPath = "Resources/Icon6.png"});
 _mediaItems.Add(new MediaItem {Label = "Image 7", IconPath = "Resources/Icon7.png"});
 _mediaItems.Add(new MediaItem {Label = "Image 8", IconPath = "Resources/Icon8.png"});
 _mediaItems.Add(new MediaItem {Label = "Image 9", IconPath = "Resources/Icon9.png"});
 }

 public ObservableCollection MediaItems
 {
 get { return _mediaItems; }
 set { _mediaItems = value; }
 }
}

Thanks for reading the long post.

I have searched and read many answers here in StackOverflow but none of them were great for me.

For example:

Stackoverflow

Message History

Delivery option(s)