UWP GridViewItem 绑定厚度到 ItemIndex

Question

我有一个带有 ItemTemplate 的 AdaptiveGridView 控件，该控件由一个 Grid 组成，其中包含一个带有 Icon 和一个 TextBlock 的 StackPanel。我想给 GridViewItem 的 ItemTemplate 的每个网格一个不同的厚度。在研究如何这样做时，我发现将 Thickness 参数绑定到 IValueConverter 是最好的方法。问题是当我尝试时，我收到一条错误消息：

System.InvalidCastException: 'Unable to cast object of type 'Test.Models.SampleOrder' to type 'Windows.UI.Xaml.Controls.GridViewItem'.'

这就是我正在尝试的：

Page.xaml

<Page.Resources>
    <converter:IndexToBorderThicknessConverter x:Name="indexconverter"/>
</Page.Resources>

<Grid x:Name="ContentArea" VerticalAlignment="Center">
    <controls:AdaptiveGridView
        ItemsSource="{x:Bind ViewModel.Source,Mode=OneWay}"
        <controls:AdaptiveGridView.ItemTemplate>
            <DataTemplate x:DataType="models:SampleOrder">
                <Grid
                    x:Name="itemThumbnail"  
                    BorderBrush="Gray"
                    BorderThickness="{Binding Converter={StaticResource indexconverter}}"
                    Padding="{StaticResource XSmallLeftTopRightBottomMargin}"
                    Background="White">
                    <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
                        <FontIcon Glyph="{x:Bind Symbol}" />
                        <TextBlock
                            Margin="{StaticResource XXSmallTopMargin}"
                            HorizontalAlignment="Center"
                            Style="{ThemeResource BodyTextStyle}"
                            Text="{x:Bind Company}" />
                    </StackPanel>
                </Grid>
            </DataTemplate>
        </controls:AdaptiveGridView.ItemTemplate>
    </controls:AdaptiveGridView>
</Grid>

IndexToBorderThicknessConverter.cs

public class IndexToBorderThicknessConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        GridViewItem item = (GridViewItem)value;
        AdaptiveGridView gridView = ItemsControl.ItemsControlFromItemContainer(item) as AdaptiveGridView;
        int index = gridView.Items.IndexOf(item);
        Thickness thickness;
        if (index % 2 == 0)
        {
            thickness = new Thickness(1);
        }

        thickness = new Thickness(2);

        return thickness;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

我可以看到它被发送到转换器的是 SampleOrder 的模型，而不是 GridViewItem。所以我的问题是：如何发送 SampleOrder 的 GridViewItem 或如何从 SampleOrderSent 获取 GridViewItem？

非常感谢。

干杯！！！

Answer 1

不得不说，通过converter中的pass值获取gridviewItem是很难的

我建议您可以尝试另一种方法，您可以设置一个名为 Ness 的属性绑定到 BorderThickness，然后在其 get 方法中编写逻辑。这样您就可以直接得到您期望的绑定值。

Xaml代码：

<Grid  x:Name="itemThumbnail"  BorderBrush="Gray" BorderThickness="{x:Bind Ness}" Background="White">

后面的代码：

public sealed partial class MainPage : Page
    {
        public static int index = 0;
        ……
}
public class SampleOrder
    {      
        private Thickness ness;
        public Thickness Ness
        {
            get
            {
                if (MainPage.index % 2 == 0)
                {
                    ness = new Thickness(1);
                }
                else
                {
                    ness = new Thickness(3);
                }
                MainPage.index++;
                return ness;
            }
        }        
    }

Answer 2

您可以处理可视化树中的 Loaded 事件for theGridelement in the template and use theVisualTreeHelperclass to find the parentGridViewItem，而不是使用转换器：

private void itemThumbnail_Loaded(object sender, RoutedEventArgs e)
{
    Grid grid = (Grid)sender;
    GridViewItem item = FindParent<GridViewItem>(grid);
    AdaptiveGridView gridView = ItemsControl.ItemsControlFromItemContainer(item) as AdaptiveGridView;
    int index = gridView.Items.IndexOf(grid.DataContext);
    grid.BorderThickness = (index % 2 == 0) ? new Thickness(1) : new Thickness(2);
}

private static T FindParent<T>(DependencyObject dependencyObject) where T : DependencyObject
{
    DependencyObject parent = VisualTreeHelper.GetParent(dependencyObject);
    if (parent == null)
        return null;

    T parentT = parent as T;
    return parentT ?? FindParent<T>(parent);
}

XAML:

<DataTemplate>
    <Grid
        x:Name="itemThumbnail"
        Loaded="itemThumbnail_Loaded"
        ...

FindParent<AdaptiveGridView>(grid) 如果您不需要 GridViewItem.

也可以

UWP GridViewItem 绑定厚度到 ItemIndex

UWP GridViewItem Binding Thicknesss to ItemIndex

gridview

ivalueconverter

uwp