根據堆棧面板中選定的項目滾動

我有一個視圖與ItemsControl綁定的模型。在ItemsControl裏面我有一個堆棧面板。現在我想要的是可以用箭頭鍵更改所選項目。就像在附圖中我選擇了第一項，並且當我按下第四項時應該被選中。問題是每行的項目取決於屏幕分辨率，所以在某些屏幕上每行有4個項目，有些則有三個。其次，當我向下移動到頁面結束的位置時，應該向下移動。我怎樣才能做到這一點？根據堆棧面板中選定的項目滾動

這是我的XAML：

<ScrollViewer HorizontalAlignment="Center" VerticalScrollBarVisibility="Auto" Width="Auto" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="2" Grid.RowSpan="2" VerticalAlignment="Top" Margin="0,10,10,0"> 
      <ItemsControl Name="productVariants"> 
       <ItemsControl.ItemsPanel> 
        <ItemsPanelTemplate> 
         <WrapPanel Orientation="Horizontal" /> 
        </ItemsPanelTemplate> 
       </ItemsControl.ItemsPanel> 
       <ItemsControl.ItemTemplate> 
        <DataTemplate> 
         <DockPanel MouseLeftButtonDown="ProductVariantClicked" Tag="{Binding VariantCBX}" Margin="8" MaxHeight="160" MaxWidth="200" MinWidth="200" MinHeight="160"> 
          <Border Name="ItemBorder" CornerRadius="6" BorderBrush="Gray" Background="White" BorderThickness="2" DockPanel.Dock="Top"> 
           <StackPanel Margin="0"> 

            <TextBlock Name="ProductVariantOption" Text="{Binding VariantOption}" HorizontalAlignment="Center" FontWeight="Bold" FontSize="20"/> 
            <Image Source="{Binding ProductVariantLogoPath}" Height="80" Width="180" /> 
            <TextBlock Text="{Binding VendorName}" HorizontalAlignment="Center" FontSize="15" FontWeight="Bold" /> 
            <TextBlock Text="{Binding SellingPrice}" HorizontalAlignment="Center" FontSize="20" FontWeight="Bold" Foreground="Red" /> 

           </StackPanel> 
          </Border> 
         </DockPanel> 
         <DataTemplate.Triggers> 
          <DataTrigger Binding="{Binding IsSelected}" Value="True" > 
           <Setter TargetName="ItemBorder" Property="BorderBrush" Value="Yellow"/> 
          </DataTrigger> 
         </DataTemplate.Triggers> 
        </DataTemplate> 
       </ItemsControl.ItemTemplate> 

      </ItemsControl> 

     </ScrollViewer>

來源

2016-09-25 Safi Mustafa

這是相當複雜的行爲，所以你最好在代碼隱藏時做它。您可以使用ActualHeight和ActualWidth以及各種元素的邊距來確定在觸發鍵盤事件時您有多少列/行，您可以使用它以及按下的特定鍵來確定哪個元素需要被選中。我不認爲這個問題有一個乾淨的，僅用XAML的方法。 –

@TimOehler我只需要知道一行數據網格中有多少個元素。我怎樣才能做到這一點。知道我可以根據數據網格內的一排堆棧面板中的元素數量加減 –

就像我說的，我不知道有任何清潔的方式做到這一點。我可以從查看項目的ActualWidth開始（例如，您的「ItemBorder」邊框元素）。如果您知道項目的ActualWidth（加上任何水平邊距）以及ItemsControl的ActualWidth，則可以計算出當時有多少個元素在一行中。您需要重新計算此按需 - 您可以在執行滾動時重新計算此值（因爲大小可能已更改），也可以通過重新計算佈局更改來使其保持最新。

要找到ActualWidths，您有幾個選項。一個是你可以在卷軸上遍歷視覺後代，直到你找到你關心的元素。另一種是你可以訂閱一個「Loaded」事件，並記住當時的實際寬度，假設寬度不隨時間變化。

來源

2016-10-03 22:12:19

根據堆棧面板中選定的項目滾動

回答

相關問題