鋼釘元件中的ScrollViewer同時加入內容

Question

我有一個通用應用以下安裝 -

<ScrollViewer x:Name="ContentScrollViewer" 
       Grid.Row="1" 
       BringIntoViewOnFocusChange="False"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto" /> 
      <RowDefinition Height="Auto" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 

     <ListView x:Name="TopContent" HorizontalAlignment="Stretch" /> 

     <Grid x:Name="ContentToPin" Grid.Row="1" Height="400" /> 

     <ListView x:Name="BottomContent" Grid.Row="2" HorizontalAlignment="Stretch" /> 

    </Grid> 
</ScrollViewer> 

當既不載入列表視圖填充和ContentToPin與屏幕的頂部正確對齊。但是，當我開始填充TopContent listview時，ContentToPin元素被按下屏幕。

|      | <- TopContent ListView populated off screen. 
|      | 
------------------------- <-Top of screen 
|      | 
|      | <- ContentToPin 
|      | 

所以TopContent加載屏幕外，指示器然後顯示在ContentToPin指示更多的內容是上述可用，因此用戶可以向下平移，以查看TopContent。

什麼是最好的方式來填充TopContent ListView，同時保持ContentToPin的頂部邊緣到頁面的頂部？

*注意我不想爲TopContent ListView設置高度。

我試圖在TopContent ListView上使用SizeChanged事件處理函數來調整ScrollViewers的位置，但這只是產生一個生澀的行爲。

private void TopContentListViewOnSizeChanged(object sender, SizeChangedEventArgs e) 
    { 
     var heightChange = e.NewSize.Height - e.PreviousSize.Height; 
     this.ContentScrollViewer.ChangeView(
      null, 
      this.ContentScrollViewer.VerticalOffset + heightChange, 
      null, 
      false); 
    } 

Answer 1

爲什麼你Grid向下移動屏幕的原因是因爲你的ListView正在增加它的大小，因此，RowDefinition那就是它的容器將被擴大。因此，向下推動其他RowDefinition元素。

現在，關於解決這個問題，我可以想到幾件事情，然而它是不清楚正是你想要在這裏實現的。儘管如此，這是我的兩分錢。

你可以改變你Grid，並允許它來填充 RowDefinitions，而不是一個，這將確保內容仍然固定在屏幕的頂部。

<Grid x:Name="ContentToPin" Grid.RowSpan="2" Height="400" /> 

否則，它甚至可能是一個更好的解決方案，以將您的Grid外父Grid的，像這樣：

<ScrollViewer> 
    <Grid> 
     <Grid> 
      <Grid.RowDefinitions> 
       ... 
      </Grid.RowDefinitions> 

      <ListView ... /> 
      <ListView ... /> 
     </Grid> 

     <Grid x:Name="ContentToPin"> 
      ... 
     </Grid> 
    </Grid> 
<ScrollViewer> 

請注意，上面的代碼僅僅是一個例子。