none
鼠标移动经过时更改Image的图片的问题 RRS feed

  • 问题

  • 最近我编了一个wpf程序,并在Properties.Resources里添加了2张图片:a,b。

    有一个Image,设置其属性时,我将其Source设置为a,对应xaml里的内容如下(IDE自动生成的):

    Source="/(项目名);component/Resources/a.png"

    然后我想为这个Image添加MouseEnter事件和MouseLeave事件,想在鼠标经过时把Source设置为b,离开时再重新设置为a,

    注意:用的是Properties.Resources里的图片,不是本地的。

    这个到底该怎么处理啊?我搜了很多资料都不知道该怎么办?在此请教各位,多谢了!

    2014年3月16日 10:11

答案

  • 直接上代码,道理和WEB里的JS鼠标移入移出类似。

    前台:

     <Image Name="imgSYSMSG" Source="images/chat/imag_icon_dialogue_normal.png" MouseLeftButtonDown="Image_MouseEnter" MouseEnter="Image_MouseEnter_1" MouseLeave="Image_MouseLeave"  Width="45"  Height="34" Cursor="Hand" HorizontalAlignment="Left" d:LayoutOverrides="Width" VerticalAlignment="Center" />
     <Image Name="imgMESSAGE" Source="images/chat/imag_icon_message_normal.png"   MouseLeftButtonDown="gridBR_MouseDown" MouseEnter="Image_MouseEnter_1"  MouseLeave="Image_MouseLeave"  Width="43"  Height="34" Cursor="Hand" HorizontalAlignment="Left" d:LayoutOverrides="Width" VerticalAlignment="Center"  />
    

    后台:

      private void Image_MouseEnter_1(object sender, MouseEventArgs e)
            {
                Image img = sender as Image;
                string imgName = img.Source.ToString();
                string[] imageArray = imgName.Split('/');
                imgName = imageArray[imageArray.Length - 1];
                switch (imgName)
                {
                    case "imag_icon_dialogue_normal.png":
                        img.Source = new BitmapImage(new Uri("images/chat/imag_icon_dialogue_down.png", UriKind.Relative));
                        img.ToolTip = "通知消息";
                        break;
                    case "imag_icon_message_normal.png":
                        img.Source = new BitmapImage(new Uri("images/chat/imag_icon_message_down.png", UriKind.Relative));
                        img.ToolTip = "聊天消息";
                        break;
                    case "RSS.png":
                        img.Source = new BitmapImage(new Uri("images/chat/RSS1.png", UriKind.Relative));
                        img.ToolTip = "显示微博中与我相关的数目";
                        break;
                }
            }
    
            private void Image_MouseLeave(object sender, MouseEventArgs e)
            {
                Image img = sender as Image;
                string imgName = img.Source.ToString();
                string[] imageArray = imgName.Split('/');
                imgName = imageArray[imageArray.Length - 1];
                switch (imgName)
                {
                    case "imag_icon_dialogue_down.png":
                        img.Source = new BitmapImage(new Uri("images/chat/imag_icon_dialogue_normal.png", UriKind.Relative));
                        break;
                    case "imag_icon_message_down.png":
                        img.Source = new BitmapImage(new Uri("images/chat/imag_icon_message_normal.png", UriKind.Relative));
                        break;
                    case "RSS1.png":
                        img.Source = new BitmapImage(new Uri("images/chat/RSS.png", UriKind.Relative));
                        break;
                }
            }

    2014年3月22日 16:18

全部回复

  • 你可以在xaml里面添加eventtrigger,在MouseEnter和MouseLeave触发时更改Image.Source,有关eventtriger请参考:

    http://msdn.microsoft.com/zh-cn/library/system.windows.eventtrigger.aspx

    如果要在MouseEnter和MouseLeave事件里面写代码,则先可以生成一个BitmapImage对象,BitmapImage构造函数可以传一个URI,该URI设置成"/(项目名);component/Resources/a(或者b).png"既可:

    http://msdn.microsoft.com/zh-cn/library/ms619218(v=VS.100).aspx

    然后把BitmapImage赋值给Image.Source

    2014年3月16日 11:42
  • 按你说的去做了(MouseEnter事件里面写代码),可是出现了异常:

    无效的 URI: 未能确定 URI 的格式。

    我确定Properties.Resources里有那个图片,且xaml里面也是同样的设置的啊:

    Source="/(项目名);component/Resources/a.png"

    2014年3月16日 11:57
  • 按你说的去做了(MouseEnter事件里面写代码),可是出现了异常:

    无效的 URI: 未能确定 URI 的格式。

    我确定Properties.Resources里有那个图片,且xaml里面也是同样的设置的啊:

    Source="/(项目名);component/Resources/a.png"

    URI要设置成相对地址的形式,参考以下代码:

    image.Source = new BitmapImage(new Uri("/WpfApplication;component/Images/a.png", UriKind.Relative));

    或者:

    image.Source = new BitmapImage(new Uri("Images/a.png", UriKind.Relative));

    2014年3月16日 15:17
  • 我用的是Properties.Resources里的图片,不是本地的,(应该是嵌在程序里的吧,debug目录里没有的),用相对路径总是错。
    2014年3月21日 9:35
  • 直接上代码,道理和WEB里的JS鼠标移入移出类似。

    前台:

     <Image Name="imgSYSMSG" Source="images/chat/imag_icon_dialogue_normal.png" MouseLeftButtonDown="Image_MouseEnter" MouseEnter="Image_MouseEnter_1" MouseLeave="Image_MouseLeave"  Width="45"  Height="34" Cursor="Hand" HorizontalAlignment="Left" d:LayoutOverrides="Width" VerticalAlignment="Center" />
     <Image Name="imgMESSAGE" Source="images/chat/imag_icon_message_normal.png"   MouseLeftButtonDown="gridBR_MouseDown" MouseEnter="Image_MouseEnter_1"  MouseLeave="Image_MouseLeave"  Width="43"  Height="34" Cursor="Hand" HorizontalAlignment="Left" d:LayoutOverrides="Width" VerticalAlignment="Center"  />
    

    后台:

      private void Image_MouseEnter_1(object sender, MouseEventArgs e)
            {
                Image img = sender as Image;
                string imgName = img.Source.ToString();
                string[] imageArray = imgName.Split('/');
                imgName = imageArray[imageArray.Length - 1];
                switch (imgName)
                {
                    case "imag_icon_dialogue_normal.png":
                        img.Source = new BitmapImage(new Uri("images/chat/imag_icon_dialogue_down.png", UriKind.Relative));
                        img.ToolTip = "通知消息";
                        break;
                    case "imag_icon_message_normal.png":
                        img.Source = new BitmapImage(new Uri("images/chat/imag_icon_message_down.png", UriKind.Relative));
                        img.ToolTip = "聊天消息";
                        break;
                    case "RSS.png":
                        img.Source = new BitmapImage(new Uri("images/chat/RSS1.png", UriKind.Relative));
                        img.ToolTip = "显示微博中与我相关的数目";
                        break;
                }
            }
    
            private void Image_MouseLeave(object sender, MouseEventArgs e)
            {
                Image img = sender as Image;
                string imgName = img.Source.ToString();
                string[] imageArray = imgName.Split('/');
                imgName = imageArray[imageArray.Length - 1];
                switch (imgName)
                {
                    case "imag_icon_dialogue_down.png":
                        img.Source = new BitmapImage(new Uri("images/chat/imag_icon_dialogue_normal.png", UriKind.Relative));
                        break;
                    case "imag_icon_message_down.png":
                        img.Source = new BitmapImage(new Uri("images/chat/imag_icon_message_normal.png", UriKind.Relative));
                        break;
                    case "RSS1.png":
                        img.Source = new BitmapImage(new Uri("images/chat/RSS.png", UriKind.Relative));
                        break;
                }
            }

    2014年3月22日 16:18