XAML Gridview直接添加項目

Question

我成功編碼了XAML Gridview以顯示項目列表。

但是，我想在Gridview的末尾添加一個[+（添加項目）]按鈕。

添加按鈕有應該有一個自定義模板（至少默認的按鈕），這是從內容項目不同。

我的XAML源代碼如下：

<GridView 
      x:Name="itemGridView" 
      AutomationProperties.AutomationId="ItemsGridView" 
      AutomationProperties.Name="Items" 
      TabIndex="1" 
      Grid.RowSpan="2" 
      Padding="116,136,116,46" 
      ItemsSource="{Binding Source={StaticResource DataSource}}" 
      SelectionMode="None" 
      IsSwipeEnabled="false" 
      IsItemClickEnabled="True" 
      ItemClick="ItemView_ItemClick"> 
      <GridView.ItemTemplate> 
       <DataTemplate> 
        <Grid HorizontalAlignment="Left" Width="250" Height="250"> 
         <Border Background="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}"> 
          <StackPanel VerticalAlignment="Bottom" Background="{ThemeResource ListViewItemOverlayBackgroundThemeBrush}"> 
           <TextBlock Text="{Binding Subject}" Foreground="{ThemeResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource BaseTextBlockStyle}" Height="60" Margin="15,0,15,0" FontWeight="SemiBold"/> 
           <TextBlock Text="{Binding TargetDate}" Foreground="{ThemeResource ListViewItemOverlaySecondaryForegroundThemeBrush}" Style="{StaticResource BaseTextBlockStyle}" TextWrapping="NoWrap" Margin="15,0,15,10" FontSize="12"/> 
          </StackPanel> 
         </Border> 
        </Grid> 
       </DataTemplate> 
      </GridView.ItemTemplate> 
      <!-- 
      Something like that.. 
      <Button Content="+" x:Name="btnAdd" /> 
      --> 
     </GridView> 

而且，我怎麼可以添加一個ADD按鈕（網格項）爲XAML？感謝

Answer 1

可以實現，通過使用DataTemplateSelector，基本上你需要做的是：

1. 定義另一個類，將代表在GridView「的addItem」

   public class GridItem 
   { 
       public String Subject { get; set; } 
       public String TargetDate { get; set; } 
   } 
   
   public class AddGridItem : GridItem 
   { 
       public bool IsGridItem { get; set; } 
   } 
   

2. 確保您的GridView的ItemSource集合中始終有一個AddGridItem

   private ObservableCollection<GridItem> _gridItems =new ObservableCollection<GridItem>() 
   { 
       new GridItem() 
       { 
        Subject = "Subject1", 
        TargetDate = "TargetDate" 
       },new GridItem() 
       { 
        Subject = "Subject2", 
        TargetDate = "TargetDate" 
       },new GridItem() 
       { 
        Subject = "Subject3", 
        TargetDate = "TargetDate" 
       },new AddGridItem() 
       { 
        IsGridItem = true 
       } 
   }; 
   
   
   public ObservableCollection<GridItem> GridItems 
   { 
       get 
       { 
        return _gridItems; 
       } 
   
       set 
       { 
        if (_gridItems == value) 
        { 
         return; 
        } 
   
        _gridItems = value;     
       } 
   } 
   

3. 創建DataTemplateSelector類，將根據項目類型

   public class MyDataTemplateSelector : DataTemplateSelector 
   { 
       public DataTemplate RegularTemplate { get; set; } 
       public DataTemplate AddTemplate { get; set; } 
   
       protected override DataTemplate SelectTemplateCore(object item, 
                   DependencyObject container) 
       { 
       if (item is AddGridItem) 
        return AddTemplate; 
       if (item is GridItem) 
        return RegularTemplate;   
       return base.SelectTemplateCore(item, container); 
       } 
   } 
   

4. 定義您dataTempaltes返回相應DataTemplate和DataTemplateSelector爲staticresources在GridView

   <Page.Resources> 
       <DataTemplate x:Key="RegularTemplate"> 
       <Grid HorizontalAlignment="Left" Width="250" Height="250"> 
        <Border BorderThickness="3" BorderBrush="White"> 
         <StackPanel VerticalAlignment="Bottom" Background="LightSkyBlue"> 
          <TextBlock Text="{Binding Subject}" Style="{StaticResource BaseTextBlockStyle}" Height="60" Margin="15,0,15,0" FontWeight="SemiBold"/> 
          <TextBlock Text="{Binding TargetDate}" Style="{StaticResource BaseTextBlockStyle}" TextWrapping="NoWrap" Margin="15,0,15,10" FontSize="12"/> 
         </StackPanel> 
        </Border> 
       </Grid> 
       </DataTemplate> 
       <DataTemplate x:Key="AddItemTemplate"> 
       <Border BorderThickness="3" BorderBrush="White" Background="DodgerBlue"> 
        <FontIcon Glyph="&#xE0B6;" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White"/> 
       </Border> 
       </DataTemplate> 
       <local:MyDataTemplateSelector x:Key="MyDataTemplateSelector" 
       RegularTemplate="{StaticResource RegularTemplate}" 
       AddTemplate="{StaticResource AddItemTemplate}"> 
       </local:MyDataTemplateSelector> 
   </Page.Resources> 
   <Grid> 
       <GridView ItemsSource="{Binding GridItems}" ItemTemplateSelector="{StaticResource MyDataTemplateSelector}">    
       </GridView> 
   </Grid>