WPF ListBox UserControl ShowPicture AutoScroll
//usercontrol //xaml <UserControl x:Class="WpfApp44.ImgTbk" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="clr-namespace:WpfApp44" mc:Ignorable="d" d:DesignHeight="450" d:DesignWidth="800"> <UserControl.Resources> <local:SizeHalfConverter x:Key="sizeHalfConverter"/> </UserControl.Resources> <Border BorderBrush="Blue" BorderThickness="5" Width="{Binding ActualWidth,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type Window}}}" Height="{Binding ActualHeight,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type Window}}}"> <Border.Background> <ImageBrush ImageSource="{Binding BgImgBrush,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" Stretch="Uniform" RenderOptions.BitmapScalingMode="Fant"/> </Border.Background> <TextBlock FontSize="100" Text="{Binding TbkStr,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" Foreground="Red" VerticalAlignment="Center" HorizontalAlignment="Center"/> </Border> </UserControl> //cs using System; using System.Collections.Generic; using System.Globalization; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; namespace WpfApp44 { /// <summary> /// Interaction logic for ImgTbk.xaml /// </summary> public partial class ImgTbk : UserControl { public ImgTbk() { InitializeComponent(); this.DataContext = this; } public ImageSource BgImgBrush { get { return (ImageSource)GetValue(BgImgBrushProperty); } set { SetValue(BgImgBrushProperty, value); } } // Using a DependencyProperty as the backing store for BgImgBrush. This enables animation, styling, binding, etc... public static readonly DependencyProperty BgImgBrushProperty = DependencyProperty.Register("BgImgBrush", typeof(ImageSource), typeof(ImgTbk), new PropertyMetadata(null)); public string TbkStr { get { return (string)GetValue(TbkStrProperty); } set { SetValue(TbkStrProperty, value); } } // Using a DependencyProperty as the backing store for TbkStr. This enables animation, styling, binding, etc... public static readonly DependencyProperty TbkStrProperty = DependencyProperty.Register("TbkStr", typeof(string), typeof(ImgTbk), new PropertyMetadata("")); } public class SizeHalfConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { double d = 0; if(double.TryParse(value?.ToString(),out d)) { return d / 2; } return 0; } public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { throw new NotImplementedException(); } } } //mainwindow.xaml <Window x:Class="WpfApp44.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:behavior="http://schemas.microsoft.com/xaml/behaviors" WindowState="Maximized" xmlns:local="clr-namespace:WpfApp44" mc:Ignorable="d" Title="{Binding SelectedItem.Id,ElementName=lbx}" Height="450" Width="800"> <behavior:Interaction.Triggers> <behavior:EventTrigger EventName="KeyDown"> <behavior:InvokeCommandAction Command="{Binding KeyDownCommand}" PassEventArgsToCommand="True"/> </behavior:EventTrigger> <!--<behavior:EventTrigger EventName="KeyDown"> <behavior:CallMethodAction MethodName="Window_KeyDown" TargetObject="{Binding}"/> </behavior:EventTrigger>--> </behavior:Interaction.Triggers> <Window.DataContext> <local:BookVM/> </Window.DataContext> <Grid> <ListBox x:Name="lbx" ItemsSource="{Binding BooksCollection,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" SelectedItem="{Binding SelectedBk,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" SelectedIndex="{Binding SelectedIdx,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" VirtualizingPanel.IsVirtualizing="True" VirtualizingPanel.IsContainerVirtualizable="True" VirtualizingPanel.VirtualizationMode="Recycling" VirtualizingPanel.CacheLength="1" VirtualizingPanel.CacheLengthUnit="Item"> <behavior:Interaction.Behaviors> <local:LbxBehavior/> </behavior:Interaction.Behaviors> <behavior:Interaction.Triggers> <behavior:EventTrigger EventName="MouseEnter"> <behavior:InvokeCommandAction Command="{Binding ShowBigPictureCommand}" PassEventArgsToCommand="True"/> </behavior:EventTrigger> </behavior:Interaction.Triggers> <ListBox.ItemTemplate> <DataTemplate> <local:ImgTbk BgImgBrush="{Binding DataContext.ImgSource, RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type ListBoxItem}}}" TbkStr="{Binding DataContext.ISBN,RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}}"/> </DataTemplate> </ListBox.ItemTemplate> </ListBox> </Grid> </Window> //cs using System; using System.Collections.Generic; using System.Collections.ObjectModel; using System.ComponentModel; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; using System.IO; using Microsoft.Xaml.Behaviors; using System.Diagnostics; namespace WpfApp44 { /// <summary> /// Interaction logic for MainWindow.xaml /// </summary> public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); } } public class BookVM : INotifyPropertyChanged { public BookVM() { InitData(); InitTimer(); InitCommands(); } private void InitCommands() { ShowBigPictureCommand = new DelCommand(ShowBigPictureCommandExecuted); KeyDownCommand = new DelCommand(KeyDownCommandExecuted); } private void KeyDownCommandExecuted(object obj) { var keyArgs = obj as KeyEventArgs; if (keyArgs != null && keyArgs.Key == Key.Space) { isPaused = !isPaused; } } private void ShowBigPictureCommandExecuted(object obj) { //if(!isPaused) //{ // return; //} var procs = Process.GetProcesses().Where(x => x.ProcessName.Contains("Photo")); if (procs!=null && procs.Any()) { foreach(var pc in procs) { pc.Kill(); } } if(proc==null) { proc = new Process(); } proc.StartInfo = new ProcessStartInfo(SelectedBk.ImgUrl); proc.Start(); } private void InitTimer() { System.Timers.Timer tmr = new System.Timers.Timer(); tmr.Elapsed += Tmr_Elapsed; tmr.Interval = 1000; tmr.Start(); } private void Tmr_Elapsed(object sender, System.Timers.ElapsedEventArgs e) { if(isPaused) { return; } if (++SelectedIdx >= imgsCount) { SelectedIdx = 0; } } private void InitData() { imgsList = new List<string>(System.IO.Directory.GetFiles(@"../../Images")); if (imgsList != null && imgsList.Any()) { imgsCount = imgsList.Count; BooksCollection = new ObservableCollection<Book>(); for (int i = 0; i < 1000; i++) { BooksCollection.Add(new Book() { Id = i + 1, ISBN = $"ISBN_{i + 1}", ImgUrl = imgsList[i % imgsCount], ImgSource = GetImgSourceFromUrl(imgsList[i % imgsCount]) }); } } } private ImageSource GetImgSourceFromUrl(string imgUrl) { BitmapImage bmi = new BitmapImage(); if (!File.Exists(imgUrl)) { return bmi; } bmi.BeginInit(); bmi.UriSource = new Uri(imgUrl, UriKind.RelativeOrAbsolute); bmi.CacheOption = BitmapCacheOption.OnLoad; bmi.EndInit(); if (bmi.CanFreeze) { bmi.Freeze(); } return bmi; } public event PropertyChangedEventHandler PropertyChanged; private void OnPropertyChanged(string propertyName) { var handler = PropertyChanged; if (handler != null) { handler?.Invoke(this, new PropertyChangedEventArgs(propertyName)); } } private ObservableCollection<Book> booksCollection; public ObservableCollection<Book> BooksCollection { get { return booksCollection; } set { if (value != booksCollection) { booksCollection = value; OnPropertyChanged(nameof(BooksCollection)); } } } private List<string> imgsList { get; set; } private int imgsCount { get; set; } private bool isPaused { get; set; } private Book selectedBk; public Book SelectedBk { get { return selectedBk; } set { if (value != selectedBk) { selectedBk = value; OnPropertyChanged(nameof(SelectedBk)); } } } private int selectedIdx; public int SelectedIdx { get { return selectedIdx; } set { if (value != selectedIdx) { selectedIdx = value; OnPropertyChanged(nameof(SelectedIdx)); } } } public DelCommand ShowBigPictureCommand { get; set; } private Process proc; public DelCommand KeyDownCommand { get; set; } } public class LbxBehavior : Behavior<ListBox> { protected override void OnAttached() { base.OnAttached(); AssociatedObject.SelectionChanged += AssociatedObject_SelectionChanged; } private void AssociatedObject_SelectionChanged(object sender, SelectionChangedEventArgs e) { var listBx = sender as ListBox; if (listBx != null && listBx.SelectedItem != null) { listBx.ScrollIntoView(listBx.SelectedItem); } } protected override void OnDetaching() { base.OnDetaching(); AssociatedObject.SelectionChanged -= AssociatedObject_SelectionChanged; } } public class Book { public int Id { get; set; } public string ISBN { get; set; } public string ImgUrl { get; set; } public ImageSource ImgSource { get; set; } } public class DelCommand : ICommand { public event EventHandler CanExecuteChanged { add { CommandManager.RequerySuggested += value; } remove { CommandManager.RequerySuggested -= value; } } private Action<object> execute; private Predicate<object> canExecute; public DelCommand(Action<object> executeValue, Predicate<object> canExecuteValue = null) { execute = executeValue; canExecute = canExecuteValue; } public bool CanExecute(object parameter) { if (canExecute == null) { return true; } return canExecute(parameter); } public void Execute(object parameter) { execute(parameter); } } }