WPF datagrid datagridtemplatecolumn image mouseenter show the image in big window

复制代码
 <DataGridTemplateColumn>
     <DataGridTemplateColumn.CellTemplate>
         <DataTemplate>
             <Image Source="{Binding ImgUrl}" Width="200" Height="500"> 
                 <behavior:Interaction.Triggers>
                     <behavior:EventTrigger EventName="MouseEnter">
                         <behavior:InvokeCommandAction 
                             Command="{Binding DataContext.MECmd,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type Window}}}"
                             CommandParameter="{Binding ImgUrl}"/>
                     </behavior:EventTrigger>
                 </behavior:Interaction.Triggers>
             </Image>
         </DataTemplate>
     </DataGridTemplateColumn.CellTemplate>
 </DataGridTemplateColumn>

 private void MECmdExecuted(object obj)
 {
     string fullPath = System.IO.Path.GetFullPath(obj?.ToString());
     if(System.IO.File.Exists(fullPath))
     {
         ImageTbk img = new ImageTbk();
         img.ImgSource=fullPath;
         img.ImgSourceStr=fullPath;
         img.ShowDialog();
     }
 }
复制代码

 

 

 

 

 

 

复制代码
//usercontrol
<Window x:Class="WpfApp350.ImageTbk"
             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:WpfApp350"
             mc:Ignorable="d"
             d:DesignHeight="450" d:DesignWidth="800">
    <Grid>
        <Image Source="{Binding ImgSource,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
        <TextBlock Text="{Binding ImgSourceStr,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
                   Panel.ZIndex="2"
                   HorizontalAlignment="Center"
                   VerticalAlignment="Bottom"
                   FontSize="30" FontWeight="ExtraBold"/>
    </Grid>
</Window>


//cs
using System;
using System.Collections.Generic;
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 WpfApp350
{
    /// <summary>
    /// Interaction logic for ImageTbk.xaml
    /// </summary>
    public partial class ImageTbk : Window
    {
        public ImageTbk()
        {
            InitializeComponent();
            this.DataContext = this;
        }



        public string ImgSource
        {
            get { return (string)GetValue(ImgSourceProperty); }
            set { SetValue(ImgSourceProperty, value); }
        }

        // Using a DependencyProperty as the backing store for ImgSource.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty ImgSourceProperty =
            DependencyProperty.Register("ImgSource", typeof(string), 
                typeof(ImageTbk), new PropertyMetadata(""));




        public string ImgSourceStr
        {
            get { return (string)GetValue(ImgSourceStrProperty); }
            set { SetValue(ImgSourceStrProperty, value); }
        }

        // Using a DependencyProperty as the backing store for ImgSourceStr.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty ImgSourceStrProperty =
            DependencyProperty.Register("ImgSourceStr", typeof(string), 
                typeof(ImageTbk), new PropertyMetadata(""));


    }
}
复制代码

 

复制代码
//xaml
<Window x:Class="WpfApp350.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"
        xmlns:local="clr-namespace:WpfApp350"
        mc:Ignorable="d" WindowState="Maximized"
        Title="MainWindow" Height="450" Width="800">
    <Window.DataContext>
        <local:BookVM/>
    </Window.DataContext>
    <Grid>
        <DataGrid ItemsSource="{Binding BooksCollection,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
                  SelectedItem="{Binding SelectedBk,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
                  VirtualizingPanel.CacheLength="100"
                  EnableRowVirtualization="True"
                  EnableColumnVirtualization="True"
                  CanUserAddRows="False"
                  AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTextColumn Header="Id" Width="150" Binding="{Binding Id}"/>
                <DataGridTextColumn Header="Name" Width="150" Binding="{Binding Name}"/>
                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Image Source="{Binding ImgUrl}" Width="200" Height="500"> 
                                <behavior:Interaction.Triggers>
                                    <behavior:EventTrigger EventName="MouseEnter">
                                        <behavior:InvokeCommandAction 
                                            Command="{Binding DataContext.MECmd,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type Window}}}"
                                            CommandParameter="{Binding ImgUrl}"/>
                                    </behavior:EventTrigger>
                                </behavior:Interaction.Triggers>
                            </Image>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>
    </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;

namespace WpfApp350
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();             
        }

        private void CallMethodAction_DpiChanged(object sender, DpiChangedEventArgs e)
        {

        }
    }

    public class BookVM : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;
        private void OnPropertyChanged(string propertyName)
        {
            var handler = PropertyChanged;
            if(handler!=null)
            {
                handler?.Invoke(this, new PropertyChangedEventArgs(propertyName));
            }
        }

        public BookVM()
        {
            InitData();
            InitCommands();
        }

        private void InitCommands()
        {
            MECmd = new DelCmd(MECmdExecuted);
        }

        private void MECmdExecuted(object obj)
        {
            string fullPath = System.IO.Path.GetFullPath(obj?.ToString());
            if(System.IO.File.Exists(fullPath))
            {
                ImageTbk img = new ImageTbk();
                img.ImgSource=fullPath;
                img.ImgSourceStr=fullPath;
                img.ShowDialog();
            }
        }

        private void InitData()
        {
            BooksCollection = new ObservableCollection<Book>();
            var imgsList = System.IO.Directory.GetFiles(@"../../Images");
            int imgsCnt = imgsList.Count();
            for(int i=0;i<10000;i++)
            {
                BooksCollection.Add(new Book()
                {
                    Id = i + 1,
                    Name = $"Name_{i + 1}",
                    ImgUrl = imgsList[i % imgsCnt]
                });
            }
        }

        private ObservableCollection<Book> booksCollection;
        public ObservableCollection<Book> BooksCollection
        {
            get
            {
                return booksCollection;
            }
            set
            {
                if (value != booksCollection)
                {
                    booksCollection = value;
                    OnPropertyChanged(nameof(BooksCollection));
                }
            }
        }

        public void Image_MouseEnter(object sender, MouseEventArgs e)
        {

        }

        public DelCmd MECmd { get; set; }
    }


    public class Book
    {
        public int Id { get; set; }

        public string Name { get; set; }

        public string ImgUrl { get; set; }
    }

    public class DelCmd : ICommand
    {
        public event EventHandler CanExecuteChanged
        {
            add
            {
                CommandManager.RequerySuggested += value;
            }
            remove
            {
                CommandManager.RequerySuggested -= value;
            }
        }

        private Action<object> execute;
        private Predicate<object> canExecute;

        public DelCmd(Action<object> executeValue,Predicate<object> canExecuteValue)
        {
            execute= executeValue;
            canExecute= canExecuteValue;
        }

        public DelCmd(Action<object> executeValue):this(executeValue,null)
        {            
        }

        public bool CanExecute(object parameter)
        {
            if(canExecute==null)
            {
                return true;
            }
            return canExecute(parameter);
        }

        public void Execute(object parameter)
        {
            execute(parameter);
        }
    }
}
复制代码

 

posted @   FredGrit  阅读(8)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示