私のStackPanelで私のカスタムUserControlを見ることができません

Question

私は私のMainWindowで構築したカスタムUserControlを見ていくつかの問題があります。

CustomControl.xaml

<UserControl x:Class="LearnWPF.CustomControl" 
     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" 
     mc:Ignorable="d" Height="262" Width="168"> 
<Grid Margin="0,0,0,0" Background="{DynamicResource {x:Static SystemColors.ActiveCaptionBrushKey}}"> 
    <TextBox Name="txt_TextBox1" HorizontalAlignment="Left" Height="23" Margin="10,10,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="148"/> 
    <TextBox Name="txt_TextBox2" HorizontalAlignment="Left" Height="23" Margin="10,48,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="148"/> 
    <ComboBox Name="lst_Dropdown" ItemsSource="{Binding Path=listContents}" HorizontalAlignment="Left" Margin="10,87,0,0" VerticalAlignment="Top" Width="135"/> 
    <RadioButton Name="rad_RadioBtn1" Content="{Binding rad_RadBtn1}" HorizontalAlignment="Left" Margin="10,133,0,0" VerticalAlignment="Top" Width="96"/> 
    <RadioButton Name="rad_RadioBtn2" Content="{Binding rad_RadBtn2}" HorizontalAlignment="Left" Margin="10,154,0,0" VerticalAlignment="Top" Width="96"/> 
    <RadioButton Name="rad_RadioBtn3" Content="{Binding rad_RadBtn3}" HorizontalAlignment="Left" Margin="10,175,0,0" VerticalAlignment="Top" Width="96"/> 
    <RadioButton Name="rad_RadioBtn4" Content="{Binding rad_RadBtn4}" HorizontalAlignment="Left" Margin="10,196,0,0" VerticalAlignment="Top" Width="96"/> 
</Grid> 

CustomControl.xaml.cs

public partial class CustomControl : UserControl 
{ 
    public string txt_Field1 { get; set; } 
    public string txt_Field2 { get; set; } 
    public string rad_RadBtn1 { get; set; } 
    public string rad_RadBtn2 { get; set; } 
    public string rad_RadBtn3 { get; set; } 
    public string rad_RadBtn4 { get; set; } 
    public string[] listContents { get; set; } 

    public CustomControl() 
    { 
     listContents = new string[5] { "Slot 1", "Slot 2", "Slot 3", "Slot 4", "Slot 5" }; 
    } 
} 

<Window x:Name="CFG_MainWindow" x:Class="LearnWPF.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Test Best Data - Custom File Generator" Height="464.5" Width="950"> 
<Grid> 
    <Button Content="Load Template" HorizontalAlignment="Left" Margin="35,36,0,0" VerticalAlignment="Top" Width="98"/> 
    <Button Content="Add Col" HorizontalAlignment="Right" Margin="0,36,35,0" VerticalAlignment="Top" Width="75"/> 
    <Button x:Name="Generate_Data" Content="Generate Data Window" Height="22" Margin="0,36,0,0" VerticalAlignment="Top" Width="160" Click="Generate_Data_Click" HorizontalAlignment="Center"/> 
    <ScrollViewer HorizontalScrollBarVisibility="Visible"> 
     <ItemsControl Name="userControlContainer" Margin="10,150,10,10" ItemsSource="{Binding MyCollection}"> 
      <ItemsControl.ItemsPanel> 
       <ItemsPanelTemplate> 
        <StackPanel Orientation="Horizontal"/> 
       </ItemsPanelTemplate> 
      </ItemsControl.ItemsPanel> 
      <ItemsControl.ItemTemplate> 
       <DataTemplate> 
        <UserControl DataContext="{Binding}" /> 
       </DataTemplate> 
      </ItemsControl.ItemTemplate> 
     </ItemsControl> 
    </ScrollViewer> 
</Grid> 

MainWindow.xaml

MainWindow.xaml.cs

public partial class MainWindow : Window 
{ 
    public ObservableCollection<CustomControl> MyCollection { get; set; } 

    public MainWindow() 
    { 
     MyCollection = new ObservableCollection<CustomControl>(); 
     MyCollection.Add(new CustomControl { txt_Field1 = "Test 1", txt_Field2 = "Test 2", rad_RadBtn1 = "Rad1", rad_RadBtn2 = "Rad2", rad_RadBtn3 = "Rad3", rad_RadBtn4 = "Rad4" }); 
     MyCollection.Add(new CustomControl { txt_Field1 = "Test 3", txt_Field2 = "Test 4", rad_RadBtn1 = "Rad1", rad_RadBtn2 = "Rad2", rad_RadBtn3 = "Rad3", rad_RadBtn4 = "Rad4" }); 
     MyCollection.Add(new CustomControl { txt_Field1 = "Test 5", txt_Field2 = "Test 6", rad_RadBtn1 = "Rad1", rad_RadBtn2 = "Rad2", rad_RadBtn3 = "Rad3", rad_RadBtn4 = "Rad4" }); 
     InitializeComponent(); 
    } 

Answer 1

のDataContextを結合するために、それは、デフォルトではnullであるように、いくつかのオブジェクトに設定する必要があります。それ以外の場合は、XAMLで設定しようとしているバインドは基本的にはプロパティの検索方法に関するコンテキストのない文字列です。

XAMLをセットアップするために、CustomControlがInitializeComponent（）を呼び出す必要があります。

<ContentControl Content="{Binding}"/>を使用すると、バインディングで表示するコントロールの種類を指定できます。 MVVMにもっと慣れてくると、バインディングにIValueConverterを使用して、UIコードとの分離を深めることもできます。

CustomControl.xaml.cs

public partial class CustomControl : UserControl 
{ 
    public string txt_Field1 { get; set; } 
    public string txt_Field2 { get; set; } 
    public string rad_RadBtn1 { get; set; } 
    public string rad_RadBtn2 { get; set; } 
    public string rad_RadBtn3 { get; set; } 
    public string rad_RadBtn4 { get; set; } 
    public string[] listContents { get; set; } 

    public CustomControl() 
    { 
     InitializeComponent(); 
     listContents = new string[5] { "Slot 1", "Slot 2", "Slot 3", "Slot 4", "Slot 5" }; 
     DataContext = this; 
    } 
} 

MainWindow.xaml

メインウィンドウにあなたはユーザーコントロールを配置しなかった

<Window x:Name="CFG_MainWindow" x:Class="LearnWPF.MainWindow" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
Title="Test Best Data - Custom File Generator" Height="464.5" Width="950"> 
<Grid> 
    <Button Content="Load Template" HorizontalAlignment="Left" Margin="35,36,0,0" VerticalAlignment="Top" Width="98"/> 
    <Button Content="Add Col" HorizontalAlignment="Right" Margin="0,36,35,0" VerticalAlignment="Top" Width="75"/> 
    <Button x:Name="Generate_Data" Content="Generate Data Window" Height="22" Margin="0,36,0,0" VerticalAlignment="Top" Width="160" Click="Generate_Data_Click" HorizontalAlignment="Center"/> 
    <ScrollViewer HorizontalScrollBarVisibility="Visible"> 
     <ItemsControl Name="userControlContainer" Margin="10,150,10,10" ItemsSource="{Binding MyCollection}"> 
      <ItemsControl.ItemsPanel> 
       <ItemsPanelTemplate> 
        <StackPanel Orientation="Horizontal"/> 
       </ItemsPanelTemplate> 
      </ItemsControl.ItemsPanel> 
      <ItemsControl.ItemTemplate> 
       <DataTemplate> 
        <ContentControl Content="{Binding}" /> 
       </DataTemplate> 
      </ItemsControl.ItemTemplate> 
     </ItemsControl> 
    </ScrollViewer> 
</Grid> 

MainWindow.xaml.cs

public partial class MainWindow : Window 
{ 
    public ObservableCollection<CustomControl> MyCollection { get; set; } 

    public MainWindow() 
    { 
     InitializeComponent(); 
     MyCollection = new ObservableCollection<CustomControl>(); 
     MyCollection.Add(new CustomControl { txt_Field1 = "Test 1", txt_Field2 = "Test 2", rad_RadBtn1 = "Rad1", rad_RadBtn2 = "Rad2", rad_RadBtn3 = "Rad3", rad_RadBtn4 = "Rad4" }); 
     MyCollection.Add(new CustomControl { txt_Field1 = "Test 3", txt_Field2 = "Test 4", rad_RadBtn1 = "Rad1", rad_RadBtn2 = "Rad2", rad_RadBtn3 = "Rad3", rad_RadBtn4 = "Rad4" }); 
     MyCollection.Add(new CustomControl { txt_Field1 = "Test 5", txt_Field2 = "Test 6", rad_RadBtn1 = "Rad1", rad_RadBtn2 = "Rad2", rad_RadBtn3 = "Rad3", rad_RadBtn4 = "Rad4" }); 
     DataContext = this; 
    } 
}