C# WPF Image控件的绑定方法

更新时间：2021年03月02日 11:56:42 作者：Hello——寻梦者！

这篇文章主要介绍了C# WPF Image控件的绑定方法，帮助大家更好的理解和学习使用c#，感兴趣的朋友可以了解下

在我们平时的开发中会经常用到Image控件，通过设置Image控件的Source属性，我们可以加载图片，设置Image的source属性时可以使用相对路径也可以使用绝对路径，一般情况下建议使用绝对路径，类似于下面的形式Source="/Demo;Component/Images/Test.jpg"其中Demo表示工程的名称，后面表示具体哪个文件夹下面的哪个图片资源，在程序中，我们甚至可以为Image控件设置X:Name属性，在后台代码中动态去改变Image的Source，但我个人认为这种方式不太适合最大量的图片切换，而且增加了View层和代码之间的耦合性，不是和复合MVVM的核心设计思想，所以今天就总结一下Image的动态绑定的形式。

要绑定，肯定是绑定到Image控件的Source属性上面，我们首先要搞清楚Source的类型是什么，public ImageSource Source { get; set; }也就是ImageSource类型，当然在我们绑定的时候用的最多的就是BitmapImage这个位图图像啦，我们首先来看看BitmapImage的继承关系：BitmapImage：BitmapSource：ImageSource，最终也是一种ImageSource类型。当然在我们的Model层中我们也可以直接定义一个BitmapImage的属性，然后将这个属性直接绑定到Image的Source上面，当然这篇文章我们定义了一个ImgSource的String类型，所以必须要定义一个转换器Converter，这里分别贴出相应地代码。

首先是View层，比较简单：

    <Grid Grid.Row="1">
      <Image Source="{Binding Path=LTEModel.ImgSource,Converter={StaticResource MyImageConverter}}" Stretch="Fill">
      </Image>
    </Grid>

然后我们再来看看Model层也很简单。

public class LTEModel : BaseModel
  {
    private string _imageSource = null;
    public string ImgSource
    {
      get
      {
        return _imageSource;
      }
      set
      {
        if (value != _imageSource)
        {
          _imageSource = value;
          FirePropertyChanged("ImgSource");
        }
      }
    }
  }

然后就是重要的转换器：

public class StringToImageSourceConverter:IValueConverter
  {
    #region Converter

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
      string path = (string)value;
      if (!string.IsNullOrEmpty(path))
      {
        return new BitmapImage(new Uri(path, UriKind.Absolute));
      }
      else
      {
        return null;
      }
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
      return null;
    }
    #endregion
  }

然后就是重要的转换器：

public class StringToImageSourceConverter:IValueConverter
  {
    #region Converter

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
      string path = (string)value;
      if (!string.IsNullOrEmpty(path))
      {
        return new BitmapImage(new Uri(path, UriKind.Absolute));
      }
      else
      {
        return null;
      }
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
      return null;
    }
    #endregion
  }

转换器返回的是Object类型，实际返回的是一个BitmapImage对象。所以我们在写程序绑定的时候一定要弄清绑定的目标和对象之间的关系，这个是非常重要的。

下面就是在ViewModel层中来添加绑定，并更新数据源，这里使用的是一个定时器来定时更新数据源：

public class LTEViewModel : NotifyObject
  {
    private DispatcherTimer myDispatcher = null;
    private Random random = new Random();
    public LTEViewModel()
    {
      GetImageSource();
      InitTimer();
    }

    private LTEModel _lteModel = null;
    public LTEModel LTEModel
    {
      get
      {
        if (_lteModel == null)
        {
          _lteModel = new LTEModel();
        }
        return _lteModel;
      }
      set
      {
        if (value != _lteModel)
        {
          _lteModel = value;
          FirePropertyChanged("LTEModel");
        }
      }
    }

    private BaseModel _baseModel = null;
    public BaseModel BaseModelInstance
    {
      get
      {
        if (_baseModel == null)
        {
          _baseModel = new BaseModel()
          {
            Title = "分地区LTE分布",
            Time = DateTime.Now.ToString()
          };
        }
        return _baseModel;
      }
      set
      {
        if (value != _baseModel)
        {
          _baseModel = value;
          FirePropertyChanged("BaseModelInstance");
        }
      }
    }

    private List<string> imgList = new List<string>();
    private void GetImageSource()
    {
      //通过程序集来读取相应的资源的路径
      string assemblyLocation = this.GetType().Assembly.Location;
      string assLocation = assemblyLocation.Substring(0, assemblyLocation.LastIndexOf("\\"));
      string[] img_files = Directory.GetFiles(string.Format("{0}\\Images", assLocation), "*.JPG");
      foreach (string img_path in img_files)
      {
        imgList.Add(img_path);
      }
    }

    private void InitTimer()
    {
      myDispatcher = new DispatcherTimer();
      myDispatcher.Tick += new EventHandler(Timer_Tick);
      myDispatcher.Interval = TimeSpan.FromMilliseconds(1000);
      myDispatcher.Start();
    }

    private void Timer_Tick(object sender, EventArgs e)
    {
      int imageIndex = 0;
      if (imgList.Count > 0 && LTEModel != null)
      {
        imageIndex = random.Next(0, imgList.Count);
        LTEModel.ImgSource = imgList[imageIndex];
      }
      if (_baseModel != null)
      {
        _baseModel.Time = DateTime.Now.ToString();
      }
    }
  }

然后就是实例化一个ViewModel对象绑定到前台中，这个思路其实是相当明确的。

其实在我们的很多时候，我们并不知道我们需要绑定什么图片，或者说根据数据类型来绑定图片，这个在定义数据模板的时候经常使用到，下面就介绍一下，根据类型来绑定相应的图片。然后通过定义

public enum DeviceType
{　　
　　SheXiangJi,
　　KaKou,
　　DianZiJingCha,
　　MingJin
}

这种类型，通过不同的类型来绑定到不同的图片，这个也是一个非常重要的应用，我们一定要注意使用的方法，这里只是简单介绍一下。

<ItemsControl ItemsSource="{Binding DeviceList,RelativeSource={RelativeSource TemplatedParent}}" Grid.Row="2">
              <ItemsControl.Template>
                <ControlTemplate TargetType="ItemsControl">
                  <UniformGrid Columns="3" Rows="7" IsItemsHost="True"></UniformGrid>
                </ControlTemplate>
              </ItemsControl.Template>
              <ItemsControl.ItemTemplate>
                <DataTemplate>
                  <StackPanel Orientation="Horizontal" HorizontalAlignment="Left" Margin="20 0 0 0" VerticalAlignment="Center" SnapsToDevicePixels="True">
                    <Image x:Name="icon1" Width="48" Height="48" RenderOptions.BitmapScalingMode="NearestNeighbor" VerticalAlignment="Center"></Image>
                    <TextBlock Margin="10 0 0 0" Foreground="#fff" ToolTip="{Binding Name}" FontSize="40" Text="{Binding Name}" HorizontalAlignment="Left" VerticalAlignment="Center"></TextBlock>
                  </StackPanel>
                  <DataTemplate.Triggers>
                    <DataTrigger Binding="{Binding Type}" Value="SheXiangJi">
                      <Setter Property="Source" Value="/IGisControls.JTJ.UIControls;component/images/camera.png" TargetName="icon1"></Setter>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Type}" Value="KaKou">
                      <Setter Property="Source" Value="/IGisControls.JTJ.UIControls;component/images/Bayonet.png" TargetName="icon1"></Setter>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Type}" Value="DianZiJingCha">
                      <Setter Property="Source" Value="/IGisControls.JTJ.UIControls;component/images/epolice.png" TargetName="icon1"></Setter>
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Type}" Value="MingJin">
                      <Setter Property="Source" Value="/IGisControls.JTJ.UIControls;component/images/Police_A.png" TargetName="icon1"></Setter>
                    </DataTrigger>
                  </DataTemplate.Triggers>
                </DataTemplate>
              </ItemsControl.ItemTemplate>
            </ItemsControl>

另外和Image很类似的就是 <ImageBrush ImageSource="/IGisControls.JTJ.UIControls;component/images/screenBG.jpg" Stretch="Fill"></ImageBrush>

用法也差不多，同样可以通过绑定的方式来添加图片，不过在使用的时候还是需要注意一下就是设置当前图片的生成操作为Resource。

以上就是C# WPF Image控件的绑定方法的详细内容，更多关于C# WPF Image控件的资料请关注脚本之家其它相关文章！

您可能感兴趣的文章:

详解C#如何自定义书写中间件
中间件是一种装配到应用管道以处理请求和响应的软件，是介于request与response处理过程之间的一个插件，本文主要介绍了如何自定义书写中间件，需要的可以参考下
2023-08-08
C# BackgroundWorker组件学习入门介绍
一个程序中需要进行大量的运算,并且需要在运算过程中支持用户一定的交互,为了获得更好的用户体验,使用BackgroundWorker来完成这一功能
2013-10-10
遍历文件系统目录树的深入理解
本篇文章是对遍历文件系统目录树进行了详细的分析介绍，需要的朋友参考下
2013-05-05
C#关于Textbox滚动显示最后一行,不闪烁问题
这篇文章主要介绍了C#关于Textbox滚动显示最后一行,不闪烁问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
2024-04-04
在Winform和WPF中注册全局快捷键实现思路及代码
如果注册快捷键，RegisterHotKey中的fsModifiers参数为0，即None选项，一些安全软件会警报，可能因为这样就可以全局监听键盘而造成安全问题,感兴趣的你可以参考下本文
2013-02-02
C#封装DBHelper类
DBHelper类是用类将ADO.NET用方法封装起来，用以减少程序员的工作量。本文为大家提供一个C#封装的DBHelper类，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2022-05-05
Visual Studio连接unity编辑器的实现步骤
unity编辑器中打开C#脚本的时候发现Visual Studio没有连接unity编辑器,本文主要介绍了Visual Studio连接unity编辑器的实现步骤,感兴趣的可以了解一下
2023-11-11
C#实现利用Windows API读写INI文件的方法
这篇文章主要介绍了C#实现利用Windows API读写INI文件的方法,涉及C#针对ini文件的创建、读取及写入等操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-07-07
Unity C#执行bat脚本的操作
这篇文章主要介绍了Unity C#执行bat脚本的操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2021-04-04
c# 使用handle.exe解决程序更新文件被占用的问题
这篇文章主要介绍了c# 使用handle.exe解决程序更新文件被占用的问题，帮助大家更好的理解和学习使用c#，感兴趣的朋友可以了解下
2021-03-03

C# WPF Image控件的绑定方法

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具