绑定组合框图像 - 如何在组合框图像中选择保存的项目

Question

我在 wpf 和 xaml 中的 ComboBox 有问题。我的组合框的 ItemsSource 是 (CollarTypesImage) 的列表。 绑定工作正常，但编辑数据时出现问题，我无法选择我的 ComboBox 的项目.. 可能它被选中但图像未查看...

但是当点击 ComboBox 时，我可以看到所有的 itams：

http://www.ahmadabouhamdh.com/tmp_global/1.png

我使用了 RelativeSource ，没有任何改变，ComboBox 没有选择我保存的项目：

<UserControl x:Class="TailorManager.Views.OrderDetailItem"
         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:vm="clr-namespace:TailorManager.ViewModels" 
  xmlns:Converter="clr-namespace:TailorManager.Converters"
         mc:Ignorable="d" 
         d:DesignHeight="730" d:DesignWidth="556" FlowDirection="RightToLeft" >
<UserControl.Resources>
    <!--<vm:OrderDetailItemViewModel x:Key="OrderDetailItemViewModel1" />-->
    <Converter:ImageConverter x:Key="ImgConverter" />
</UserControl.Resources>
<Grid >
    <ScrollViewer VerticalScrollBarVisibility="Auto" >
        <ItemsControl>
            <StackPanel> 
                <GroupBox Header="تفاصيل الياقة" Margin="5,5,5,0" VerticalAlignment="Top" Height="170">
                    <Grid>
                       <ComboBox ItemsSource="{Binding Path= DataContext.ImagesCollarTypes,
                            RelativeSource={RelativeSource AncestorType=UserControl,AncestorLevel=1}}" 
                                  SelectedValue="{Binding Path=OrderDetailItem.CollarTypesImage,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"  
                                  SelectedValuePath="{Binding Path=OrderDetailItem.CollarTypesImage}"
                                  Margin="393,106,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="132" Height="38">
                            <ComboBox.ItemTemplate>
                                <DataTemplate>
                                    <Image Width="50" Height="50" Source="{Binding Path= CollarImage,Converter={StaticResource ImgConverter} }" />
                                </DataTemplate>
                            </ComboBox.ItemTemplate >
                        </ComboBox>

                    </Grid>
                </GroupBox> 
                <Grid/>
            </StackPanel>

        </ItemsControl>
    </ScrollViewer>
</Grid>
</UserControl>

我加了

 SelectedItem="{Binding Path=OrderDetailItem.CollarTypesImage}"

什么都没有改变。

我在窗口内使用这个控件有一个不同的DataContext类型，我从这个控件的构造函数中设置了（DataContext OrderDetailItem）的值。

下图说明绑定工作正常：

单击编辑以显示我从数据库中保存的图像时，此图像未选中：

http://www.ahmadabouhamdh.com/tmp_global/2.png

这里是所有代码：

    public List<CollarTypesImage> ImagesCollarTypes
    {
        get
        {
            //ImagesCollarTypes[0].CollarImage
            if (_imagesCollarTypes.Count == 0)
            {
                TailorManagerDBEntities db = new TailorManagerDBEntities();
                _imagesCollarTypes = db.CollarTypesImages.ToList();
            }
            return _imagesCollarTypes;
        }
        set
        {
            _imagesCollarTypes = value;
            RaisePropertyChanged(() => ImagesCollarTypes);
        }
    }

---

public partial class CollarTypesImage
{
    public CollarTypesImage()
    {
        this.OrderDetails = new HashSet<OrderDetail>();
    }

    public System.Guid CollarTypeId { get; set; }
    public byte[] CollarImage { get; set; }

    public virtual ICollection<OrderDetail> OrderDetails { get; set; }
}

---

这里是我使用控件的窗口中的 xaml 代码：

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:vm="clr-namespace:TailorManager.ViewModels"
    xmlns:util="clr-namespace:TailorManagerLib.Business;assembly=TailorManagerLib"
    xmlns:local="clr-namespace:TailorManager.Views"
x:Class="TailorManager.Views.AddOrder"
    Title="AddCustomer" Height="665" Width="974" MinWidth="600" MinHeight="666" FlowDirection="RightToLeft" >
<Window.Resources>
    <vm:ManageOrderDetilsViewModel x:Key="ManageOrderDetilsViewModel1" />
</Window.Resources>
<Grid DataContext="{StaticResource ManageOrderDetilsViewModel1}" x:Name="GridDataContaner">
    <Grid.Background>
       ...
    </Grid.Background>

    <GroupBox Header="تفاصيل الطلب" Margin="10,160,10,0" FlowDirection="RightToLeft">
        <Grid Grid.Column="0" Name="GridOrderDetails">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Name="ColumnDefinitionListDetails" Width="183*"/>
                <ColumnDefinition Name="ColumnDefinitionDetails" Width="0*"/>
            </Grid.ColumnDefinitions>
            <Grid Margin="0,0,0,40" >
               ...
            </Grid>
            <Grid Grid.Column="1">
                <Border BorderBrush="Black" BorderThickness="2" CornerRadius="3" Margin="4" >
                    <Grid>
                       <local:OrderDetailItem x:Name="OrderDetailItemControl" VerticalAlignment="Top" />
                    </Grid>
                </Border>

            </Grid>
            ...
        </Grid>
    </GroupBox>

</Grid>
</Window>

---

我如何设置控件的 DataContext，这在我的窗口 VM 中的命令中：

OrderDetailItemViewModel OrdDetailItem = new OrderDetailItemViewModel(Ord.OrderDetailsId);
OrderDetailItemControl.DataContext = OrdDetailItem;

请问怎么解决？

---

更新

当我如下更改相对源时：

<ComboBox Name="CmbBxImgCollarTyp" ItemsSource="{Binding Path= DataContext.ImagesCollarTypes, RelativeSource={
RelativeSource AncestorType={x:Type vm:OrderDetailItemViewModel}}" 
SelectedValue="{Binding Path=OrderDetailItem.CollarTypesImage, Mode=TwoWay,
UpdateSourceTrigger=PropertyChanged}" SelectedValuePath="{Binding Path= OrderDetailItem.CollarTypesImage}" Margin="393,106,0,0" VerticalAlignment="Top" 
HorizontalAlignment="Left" Width="132" Height="38">
                            <ComboBox.ItemTemplate>
                                <DataTemplate>
                                    <Image Width="50" Height="50" Source="{Binding Path=CollarImage,
            Converter={StaticResource ImgConverter}}" />
                                </DataTemplate>
                            </ComboBox.ItemTemplate>
                        </ComboBox>

绑定在所有模式下都不起作用！，我将其更改为这种方式，因为此控件的数据上下文是视图模型“OrderDetailItemViewModel”的对象 应该解决什么问题？

Answer 1

检查输出窗口后，我注意到这个错误：

System.Windows.Data Error: 4 : Cannot find source for binding with 
reference 'RelativeSource FindAncestor, AncestorType='Projectname.ViewModels.ViewModel', AncestorLevel='1''. BindingExpression:Path=LookupItems; DataItem=null; target element is 'ComboBox' (Name=''); target property is 'ItemsSource' (type 'IEnumerable')

然后我将我的 ViewModel 中的 RelativeSource 从 AncestorType 更改为 UserControl，就像这样： RelativeSource={ AncestorType={x:Type UserControl},AncestorLevel=1}}"

现在一切正常，

感谢会员们的努力

Answer 2

您的RelativeSource Binding Path 中有错误。您使用了UserControl 的类型，但UserControl 类确实没有 有一个名为ImagesCollarTypes 的属性...相反，您应该使用您的 @987654327 @ 你定义属性的地方......我假设这个类被命名为OrderDetailItem：

<ComboBox ItemsSource="{Binding Path= DataContext.ImagesCollarTypes, RelativeSource={
    RelativeSource AncestorType={x:Type YourViewsPrefix:OrderDetailItem}}}" 
    SelectedValue="{Binding Path=CollarTypesImage, Mode=TwoWay,
    UpdateSourceTrigger=PropertyChanged}" SelectedValuePath="{Binding Path=
    CollarTypesImage}" Margin="393,106,0,0" VerticalAlignment="Top" 
    HorizontalAlignment="Left" Width="132" Height="38">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <Image Width="50" Height="50" Source="{Binding Path=CollarImage,
                Converter={StaticResource ImgConverter}}" />
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

您应该在 Visual Studio 的输出窗口中收到错误消息，如 Error: property 'ImagesCollarTypes' not found on object 'UserControl' 或类似内容。

免责声明：我没有检查您的所有代码，因为您的代码太多了，因此即使您修复了此错误，您的代码仍可能存在其他错误并且无法按预期工作。

---

更新>>>

为了使Binding 起作用，做了以下假设：

1. UserControl.DataContext 必须具有对象集的有效实例。
2. 设置为UserControl.DataContext 的对象必须有一个名为ImagesCollarTypes 的公共属性。
3. ImagesCollarTypes 属性的类型必须包含名为 CollarTypesImage 的公共属性。