2014-07-11 99 views
4

我有一個ScrollViewer中圓一些控件,並與保留空間的ScrollViewer

<ScrollViewer VerticalScrollBarVisibility="Auto"> 
    ...some controls here... 
</ScrollViewer> 

默認情況下它不會保留需要顯示滾動條的空間。這意味着當它顯示/隱藏時,我的控件會被壓扁並再次展開。

如何爲滾動條預留空間?是否有某種屬性或風格可以設置,這意味着什麼時候不需要它被設置爲隱藏而不是摺疊?或者,我的孩子的控制需要「填充」或右側的東西離開空間?我應該把控件放在一個網格中,並使滾動條的滾動查看器大小的列顯示(以某種方式)?

我希望它仍然是不可見的時候不需要我只是想讓它保留時間的最佳方式。

謝謝大家。

+1

檢查ComputedVerticalScrollBarVisibility如果幫助http://prntscr.com/41jx4u –

回答

8

這裏是一個樣本

這將保留滾動條空間時,它是不可見通過使用邊框作爲佔位

<ScrollViewer VerticalScrollBarVisibility="auto" x:Name="scroll"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition /> 
       <ColumnDefinition Width="auto" /> 
      </Grid.ColumnDefinitions> 
      <Border Background="LightGoldenrodYellow" 
        Height="300" /> 
      <Border Grid.Column="1" 
        Width="{x:Static SystemParameters.VerticalScrollBarWidth}"> 
       <Border.Style> 
        <Style TargetType="Border"> 
         <Style.Triggers> 
          <DataTrigger Binding="{Binding ComputedVerticalScrollBarVisibility, ElementName=scroll}" 
             Value="Visible"> 
           <Setter Property="Visibility" 
             Value="Collapsed" /> 
          </DataTrigger> 
         </Style.Triggers> 
        </Style> 
       </Border.Style> 
      </Border> 
     </Grid> 
    </ScrollViewer> 

第一邊界是內容與第二邊界的佔位符爲滾動條保留空間。您可以選擇您所選擇的元素替換

定義爲可重複使用的模板

<Grid> 
    <Grid.Resources> 
     <ControlTemplate x:Key="ReservedSpaceScroller" TargetType="ContentControl"> 
      <ScrollViewer VerticalScrollBarVisibility="auto" 
          x:Name="scroll"> 
       <Grid> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition /> 
         <ColumnDefinition Width="auto" /> 
        </Grid.ColumnDefinitions> 
        <ContentPresenter /> 
        <Border Width="{x:Static SystemParameters.VerticalScrollBarWidth}" 
          x:Name="placeholder" Grid.Column="1" /> 
       </Grid> 
      </ScrollViewer> 
      <ControlTemplate.Triggers> 
       <DataTrigger Binding="{Binding ComputedVerticalScrollBarVisibility, ElementName=scroll}" 
          Value="Visible"> 
        <Setter TargetName="placeholder" 
          Property="Visibility" 
          Value="Collapsed" /> 
       </DataTrigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Grid.Resources> 

    <ContentControl Template="{StaticResource ReservedSpaceScroller}"> 
     <Border Background="LightGoldenrodYellow" 
       Height="300" /> 
    </ContentControl> 
</Grid> 

結果

result

+0

完美 - 謝謝!正是我在找什麼! – GoldieLocks

0

如果你想在ScrollViewer總是「預留空間」以其ScrollBar,那麼你可以這樣做:

<ScrollViewer VerticalScrollBarVisibility="Visible"> 
    ...some controls here... 
</ScrollViewer> 

這將顯示ScrollBar即使它不是必需的,但它不會讓你當需要時,控制擠壓並擴大

+0

對不起 - 也許我應該澄清,當不需要時,我希望它不可見,但只是看不見 - 沒有崩潰! – GoldieLocks