为什么我不能把这个网格放在我的按钮上？

Question

我需要我的按钮在特定的布局上有几段文字，所以我试图在我的按钮上放置一个网格来组织信息。

我的问题是，虽然我可以让未修改的按钮出现，但网格永远不会出现在顶部或顶部。

这里的代码名为.xaml：

<!-- ...other code up above... --> 

<ItemsControl x:Name="btnList"> 
    <ItemsControl.ItemTemplate> 
     <DataTemplate> 
      <Grid Background="Green"> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="3*" /> 
        <RowDefinition Height="2*" /> 
       </Grid.RowDefinitions> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="1*" /> 
        <ColumnDefinition Width="1*" /> 
        <ColumnDefinition Width="1*" /> 
       </Grid.ColumnDefinitions> 
       <TextBlock Grid.ColumnSpan="3" 
          Grid.Row="0" 
          Grid.Column="0" 
          HorizontalAlignment="Center" 
          Margin="15" 
          Text="Test Text 1" /> 

       <TextBlock Grid.Row="1" 
          Grid.Column="0" 
          HorizontalAlignment="Center" 
          Text="Test Text 2" /> 

       <TextBlock Grid.Row="1" 
          Grid.Column="1" 
          HorizontalAlignment="Center" 
          Text="Test Text 3" /> 

       <TextBlock Grid.Row="1" 
          Grid.Column="2" 
          HorizontalAlignment="Center" 
          Text="Test Text 4" /> 
      </Grid> 
     </DataTemplate> 
    </ItemsControl.ItemTemplate> 
</ItemsControl> 

下面是相关.xaml.cs代码：

public THINGSelectFlyout() 
    { 
     this.InitializeComponent(); 

     foreach (XTHING_IndexItem indexItem in DataStore.Instance.THINGsFoundOnTap) 
     { 
      Button button = new Button() 
      { 
       Name = indexItem.cGuid.ToString("N"), 
       Content = indexItem.cName, 
       Style = Application.Current.Resources["BigButtons"] as Style 
      }; 
      button.Click += THINGButton_Click; 
      btnList.Items.Add(button); 
     } 

这样当运行按钮出现（默认的背景色，蓝色）和拥有在.xaml.c文件中提供给他们的内容。作为一个方面说明，我正在修改别人的代码和长话短说我不能将整个按钮构造移动到.xaml文件中;其他许多事物都期望它在那里。

Answer 1

难道这不就是说，在摸索了几个小时之后，我在这里寻求帮助的那一刻，然后我在我的下一个在线搜索中绊倒了答案？

最好在.xaml.cs文件中创建网格，而不是.xaml文件。也许你可以让.xaml与ViewModel一起工作，但是如果这种模式运行良好，我不会再创建一个新的视图模型。

新的.xaml代码：

<!-- ...other code up above... --> 
    <ItemsControl x:Name="btnList" ItemsSource="{Binding Items}"/> 

新.xaml.cs代码：

public THINGSelectFlyout() 
    { 
     this.InitializeComponent(); 

     foreach (XTHING_IndexItem indexItem in DataStore.Instance.THINGsFoundOnTap) 
     { 

      Button button = new Button() 
      { 
       Name = indexItem.cGuid.ToString("N"), 
       Style = Application.Current.Resources["BigButtons"] as Style 
      }; 

      Grid textGrid = new Grid(); 
      // Define Grid rows 
      RowDefinition rowDef1 = new RowDefinition(); 
      RowDefinition rowDef2 = new RowDefinition(); 
      RowDefinition rowDef3 = new RowDefinition(); 
      rowDef1.Height = new GridLength(20); 
      rowDef2.Height = new GridLength(22); 
      rowDef3.Height = new GridLength(25); 
      textGrid.RowDefinitions.Add(rowDef1); 
      textGrid.RowDefinitions.Add(rowDef2); 
      textGrid.RowDefinitions.Add(rowDef3); 
      // Define Grid columns 
      ColumnDefinition colDef1 = new ColumnDefinition(); 
      ColumnDefinition colDef2 = new ColumnDefinition(); 
      colDef1.Width = new GridLength(150); 
      colDef2.Width = new GridLength(105); 
      textGrid.ColumnDefinitions.Add(colDef1); 
      textGrid.ColumnDefinitions.Add(colDef2); 

      // Set indexItem text 
      TextBlock indexText = new TextBlock(); 
      indexText.Text = indexItem.cName; 
      indexText.TextAlignment = 0; 
      textGrid.Children.Add(indexText); 
      Grid.SetColumnSpan(indexText, 2); 
      Grid.SetRow(indexText, 1); 

      // Set assignment text 
      TextBlock assgnText = new TextBlock(); 
      assgnText.Text = " Assgn: " + indexItem.cAssignedTo; 
      indexText.TextAlignment = 0; 
      textGrid.Children.Add(assgnText); 
      Grid.SetRow(assgnText, 2); 

      // Set owner text 
      TextBlock ownerText = new TextBlock(); 
      ownerText.Text = "Owner: " + indexItem.cOwnedBy; 
      indexText.TextAlignment = 0; 
      textGrid.Children.Add(ownerText); 
      Grid.SetRow(ownerText, 2); 
      Grid.SetColumn(ownerText, 1); 

      button.Content = textGrid; 

      button.Click += THINGButton_Click; 
      btnList.Items.Add(button); 
     } 
    } 

唯一的缺点，这是我不知道怎么去放下*运营商自动调整行和列的尺寸，比如.xaml允许，但它做我需要的。

Answer 2

绑定你的ItemsControl到属于您的视图模型的列表：

<ItemsControl x:Name="btnList" ItemsSource="{Binding Items}"> 
    <ItemsControl.ItemTemplate> 
     <DataTemplate> 
     <Button> 
      <Button.Content> 
        <!-- Place your Grid Xaml here --> 
      </Button.Content> 
     </Button> 
    </DataTemplate> 
    </ItemsControl.ItemTemplate> 
</ItemsControl> 

添加ObservableCollection到你的视图模型，收集将是DataStore.Instance.THINGsFoundOnTap类型的列表。

因此，在你的ViewModel，添加一个新的实例属性：

private ObservableCollection<YourType> _items = new ObservableCollection<YourType>(); 

public ObservableCollection<YourType> Items 
{ 
    get{ return _items; } 
} 

然后修改您的视图，以便您要添加您的视图模型，通知您必须设置视图的DataContext向视图模型：

var viewModel = new YourViewModel(); //create your view model 
DataContext = viewModel; // set the views DataContext 

foreach (XTHING_IndexItem indexItem in DataStore.Instance.THINGsFoundOnTap) 
{ 
    viewModel.Items.Add(indexItem); 
} 

最后，修改您的视图Items收集绑定到单个项目中的ViewModels：

<TextBlock Grid.Row="1" 
    Grid.Column="0" 
    HorizontalAlignment="Center" 
    Text="{Bind cName}" /> 

您可以根据需要处理单击事件或命令。