基于C#WPF和OpencvSharp开发的图像处理系统——3.输入图像控件

定义两个依赖属性 输入图像路径 和 控件标签

        /// <summary>
        /// 图像路径
        /// </summary>
        public string SrcImageSource
        {
            get { return (string)GetValue(SrcImageSourceProperty); }
            set { SetValue(SrcImageSourceProperty, value); }
        }

        // Using a DependencyProperty as the backing store for ImageSource.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty SrcImageSourceProperty =
            DependencyProperty.Register("SrcImageSource", typeof(string), typeof(SrcImgShowUserControl));

        public string LabelText
        {
            get { return (string)GetValue(LabelTextProperty); }
            set { SetValue(LabelTextProperty, value); }
        }

        // Using a DependencyProperty as the backing store for LabelText.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty LabelTextProperty =
            DependencyProperty.Register("LabelText", typeof(string), typeof(SrcImgShowUserControl), new PropertyMetadata("输入图像"));

xaml定义 一个Grid布局，定义三行

第一行 标题

一个textBlock 绑定依赖属性 LabelText，注意绑定方式

<TextBlock
            Grid.Row="0"
            Margin="0,2,0,0"
            HorizontalAlignment="Center"
            VerticalAlignment="Top"
            Text="{Binding LabelText, RelativeSource={RelativeSource AncestorType=UserControl}, Mode=TwoWay}"
            FontSize="20"
            Foreground="White" />

第二行 图像

一个Image 绑定依赖属性 SrcImageSource

<Image
            Grid.Row="1"
            Width="335"
            Height="335"
            Source="{Binding SrcImageSource, RelativeSource={RelativeSource AncestorType=UserControl}, Mode=TwoWay}"
            Stretch="Uniform" />

第三行 选择图像

放置一个StackPanel

<StackPanel
     Grid.Row="2"
     Margin="0,0,0,2"
     VerticalAlignment="Center"
     Orientation="Horizontal">
     <Label
         HorizontalAlignment="Center"
         VerticalAlignment="Center"
         Content="图像路径:"
         Foreground="White"
         FontSize="16"
         Background="Transparent" />
     <TextBox
         Width="280"
         Margin="0,2,0,2"
         HorizontalAlignment="Center"
         Text="{Binding SrcImageSource, RelativeSource={RelativeSource AncestorType=UserControl}, Mode=TwoWay}"
         IsReadOnly="True"
         Background="Transparent"
         FontSize="18"
         Foreground="White"
         TextAlignment="Center"
         ToolTip="{Binding Text, RelativeSource={RelativeSource Self}}" />
     <Button
         Width="35"
         Height="25"
         Margin="2,0,0,0"
         HorizontalAlignment="Right"
         VerticalAlignment="Center"
         Content="选择"
         Click="Button_Click" />
 </StackPanel>

其中，textBox绑定依赖属性SrcImageSource，如果路径太长，显示不全，可以将ToolTip绑定自身的Text，鼠标放在tetxBox上时就可以看见全部路径了。 选择图像的点击事件，按钮点击功能是固定的，所以就直接采用的点击事件，没有采用命令绑定，选择文件框使用的命名空间是Microsoft.Win32。

private void Button_Click(object sender, RoutedEventArgs e)
 {
     OpenFileDialog openFileDialog = new OpenFileDialog();
     openFileDialog.Multiselect = false;
     openFileDialog.Title = "请选择图片";
     openFileDialog.Filter = "所有图片文件(*.jpg;*.bmp;*.jpeg;*.png;*.tif)|*.jpg;*.bmp;*.jpeg;*.png;*.tif";
 
     if (openFileDialog.ShowDialog() == true)
     {
         SrcImageSource = openFileDialog.FileName;
     }
 }