Question

我正在尝试使用XAML绑定来影响屏幕上滑块上的gridview datatemplate元素大小。

我有一个由缩略图图像组成的gridview，其中的元素定义如下：

         <GridView.ItemTemplate  >
            <DataTemplate  >
                <StackPanel Orientation="Vertical" 
                            HorizontalAlignment="Center" 
                            VerticalAlignment="Center" 
                            KeyDown="IsitenterThumb" 
                            BorderBrush="LightSeaGreen" 
                            BorderThickness="1"
                            PointerWheelChanged="ctlThumbnails_PointerWheelChanged">
                    <Image Source="{Binding thumb}" 
                           x:Name="thumbimg"
                           Visibility="Visible"
                           Height="{Binding ItemSize}" Width="{Binding ItemSize, ElementName=page}" Stretch="Uniform" 
                           Tapped="ThumbnailSelected" 
                           DoubleTapped="CloseThumbnails"
                           />
                    <TextBlock Text="{Binding name}" Margin="5,5" 
                               Foreground="White" 
                               Width="{Binding ItemSize}" 
                               />
                </StackPanel>
            </DataTemplate>

我定义了以下变量，如下所示：

       public double ItemSize
       {
        get => _itemSize;
        set
        {
            if (_itemSize != value)
            {
                _itemSize = value;
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(ItemSize)));
            }
         }
       }

      private double _itemSize;

      public event PropertyChangedEventHandler PropertyChanged;

我会认为更改ItemSize的值会影响gridview数据模板。这是从PhotoLab示例中获取的。

相反，我每页只有一个巨大的“ thumbimg” ...任何帮助将不胜感激！

Answer 1

好吧...我终于明白了。我不太确定上面我在做什么错，但是下面的代码有效。

我已经将DataTemplate作为Page.Resource的一部分，我不确定这是否是导致绑定问题的原因。但是，Xaml代码如下所示：

      <Page.Resources>
        <DataTemplate x:Key="ThumbnailsTemplate">
            <StackPanel Orientation="Vertical" 
                            HorizontalAlignment="Center" 
                            VerticalAlignment="Center" 
                            KeyDown="IsitenterThumb" 
                            BorderBrush="LightSeaGreen" 
                            BorderThickness="1"
                            <Image Source="{Binding thumb}" 
                            x:Name="thumbimg"
                            Visibility="Visible"
                            Height="{Binding ItemSize, ElementName=page}" Width="{Binding ItemSize, ElementName=page}" 
                           Stretch="Uniform" 
                           Tapped="ThumbnailSelected" 
                           DoubleTapped="CloseThumbnails"
                           />
                <TextBlock Text="{Binding name}" Margin="5,5" 
                               Foreground="White" Width="{Binding ItemSize}" 
                               />
            </StackPanel>
        </DataTemplate>
     </Page.Resources>


     <GridView x:Name = "ctlThumbnails" Grid.Column="0" 
              BorderBrush="White" BorderThickness="2" 
              Grid.RowSpan="4" Grid.Row="0" Grid.ColumnSpan="3" Height ="auto" Width="auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
              Margin="30,30,30,30" KeyDown="IsitenterThumb"
              DoubleTapped="CloseThumbnails"
              ItemTemplate="{StaticResource ThumbnailsTemplate}">
     </GridView>

这是影响绑定变量ItemSize的C＃代码

公共事件PropertyChangedEventHandler PropertyChanged;

    public double ItemSize
    {
        get => _itemSize;
        set
        {
            if (_itemSize != value)
            {
                _itemSize = value;
                topcmdbarcontent.Text = "Thumb Size:" + _itemSize.ToString();
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(ItemSize)));
            }
        }
    }
    private double _itemSize;

由此，例如，当您通过ValueChanged事件更改ItemSize的值时，它的确会动态更改网格元素的大小。

UWP以编程方式更改gridview元素的大小

1 个答案: