XAML 将自定义GridView添加到WinUI3C #应用程序(无法使用Page.Resources或Window.Resources)

cs7cruho  于 12个月前  发布在  其他
关注(0)|答案(1)|浏览(87)

我第一次在WinUI 3 C#项目上工作。这是我的代码XAML代码到目前为止,它的工作原理:

<?xml version="1.0" encoding="utf-8"?>

<Window
    x:Class="Greek_Television.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Greek_Television"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Title="Greek Television">

    <Window.SystemBackdrop>
        <MicaBackdrop Kind="BaseAlt"/>
    </Window.SystemBackdrop>

    <StackPanel>

        <Grid x:Name="AppTitleBar"  
      Height="48">
            <Grid.ColumnDefinitions>
                <ColumnDefinition x:Name="LeftPaddingColumn" Width="0"/>
                <ColumnDefinition x:Name="IconColumn" Width="Auto"/>
                <ColumnDefinition x:Name="TitleColumn" Width="Auto"/>
                <ColumnDefinition x:Name="LeftDragColumn" Width="*"/>
                <ColumnDefinition x:Name="SearchColumn" Width="Auto"/>
                <ColumnDefinition x:Name="RightDragColumn" Width="*"/>
                <ColumnDefinition x:Name="RightPaddingColumn" Width="0"/>
            </Grid.ColumnDefinitions>
            <Image x:Name="TitleBarIcon" Source="/Images/WindowIcon.png"
           Grid.Column="1"
           Width="16" Height="16"
           Margin="8,0,0,0"/>
            <TextBlock x:Name="TitleTextBlock" 
               Text="Greek Television" 
               Style="{StaticResource CaptionTextBlockStyle}"
               Grid.Column="2"
               VerticalAlignment="Center"
               Margin="4,0,0,0"/>
            <AutoSuggestBox Grid.Column="4" QueryIcon="Find"
                    PlaceholderText="Αναζήτηση"
                    VerticalAlignment="Center"
                    Width="300" Margin="4,0"/>
        </Grid>

        <Pivot>
            <PivotItem Header="Όλα τα κανάλια">
                <!--This is where I want to add the GridView-->
            </PivotItem>
            <PivotItem Header="Ελληνικά">
                <!--This is where I want to add the GridView-->
            </PivotItem>
            <PivotItem Header="Ξένα">
                <!--This is where I want to add the GridView-->
            </PivotItem>
            <PivotItem Header="Αγαπημένα">
                <!--This is where I want to add the GridView-->
            </PivotItem>
        </Pivot>

    </StackPanel>

</Window>

在每个Pivot选项卡中,我想添加一个自定义GridView,就像Microsoft Store中的 WinUI 3 Gallery 应用程序所建议的那样。这是Gallery应用程序提供的代码:

<!-- The GridView used for this sample is shown below, with all of the necessary added properties. -->
<GridView
    x:Name="ContentGridView"
    ItemsSource="{x:Bind Items}"
    ItemTemplate="{StaticResource ImageTextTemplate}"
    IsItemClickEnabled="False"
    CanDragItems="False"
    AllowDrop="True"
    CanReorderItems="True"
    SelectionMode="Single"
    SelectionChanged="ContentGridView_SelectionChanged"
    ItemClick="ContentGridView_ItemClick"
    FlowDirection="LeftToRight"/>

<!-- ContentGridView_SelectionChanged and ContentGridView_ItemClick are functions defined in the code-behind
to handle the events of when a selection changes on the GridView and when an item is clicked. -->

<!-- The data template bound to this GridView's ItemTemplate property is based on which one you
select from the options on the right. The currently selected DataTemplate is: -->

<!-- ImageTextTemplate: -->
<DataTemplate x: Key = 'ImageTextTemplate' x: DataType = 'local1:CustomDataObject'>
    <Grid AutomationProperties.Name = '{x:Bind Title}' Width = '280'>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width = 'Auto'/>
                <ColumnDefinition Width = '*'/>
        </Grid.ColumnDefinitions>
        <Image Source = '{x:Bind ImageLocation}' Height = '100' Stretch = 'Fill' VerticalAlignment = 'Top'/>
        <StackPanel Grid.Column = '1' Margin = '8,0,0,8'>
            <TextBlock Text = '{x:Bind Title}' Style = '{ThemeResource SubtitleTextBlockStyle}' Margin = '0,0,0,8'/>
            <StackPanel Orientation = 'Horizontal'>
                <TextBlock Text = '{x:Bind Views}' Style = '{ThemeResource CaptionTextBlockStyle}'/>
                    <TextBlock Text = ' Views ' Style = '{ThemeResource CaptionTextBlockStyle}'/>
            </StackPanel>
            <StackPanel Orientation = 'Horizontal'>
                    <TextBlock Text = '{x:Bind Likes}' Style = '{ThemeResource CaptionTextBlockStyle}'/> 
                    <TextBlock Text = ' Likes' Style = '{ThemeResource CaptionTextBlockStyle}'/>
            </StackPanel>
        </StackPanel>
     </Grid>
</DataTemplate>

我不知道如何将它添加到代码中。我试过使用 <Page.Resources><Window.Resources>,但是VS在这些下面加了下划线,如果我试着使用它们,就会抛出错误(我不确定如何正确使用它们)。
谢谢你的帮助。在此先谢谢您!
问候

hsgswve4

hsgswve41#

您可以将资源添加到窗口的根元素,而不是直接将资源添加到窗口本身:

stackPanelRoot.Resources.Add(...);

XAML:

<Window
    x:Class="Greek_Television.MainWindow"
    ...>

    <StackPanel x:Name="stackPanelRoot">

当然,您也可以直接在XAML标记中将资源添加到根元素:

<StackPanel>
    <StackPanel.Resources>
         <GridView x:Key="...">

相关问题