如何在scrollviewer中始终显示垂直滚动条?
它会在几秒钟后消失,但我想在滚动可用时始终显示滚动
感谢您的帮助
答案 0 :(得分:3)
我认为Windows 8 Consumer Preview中的控件可能存在错误,因为以下内容通常可以正常工作:
<ScrollViewer
Style="{StaticResource VerticalScrollViewerStyle}"
VerticalScrollBarVisibility="Visible"
Template="{StaticResource ScrollViewerControlTemplate1}">
作为解决方法,您可以修改ScrollViewer的模板:
<ScrollViewer
Style="{StaticResource VerticalScrollViewerStyle}"
Template="{StaticResource ScrollViewerControlTemplate1}">
...在某些ResourceDictionary中的其他地方 - 修改后的标准ScrollViewer模板,删除了“NoIndicator”VisualState。
<ControlTemplate
x:Key="ScrollViewerControlTemplate1"
TargetType="ScrollViewer">
<Border
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup
x:Name="ScrollingIndicatorStates">
<VisualState
x:Name="TouchIndicator">
<Storyboard>
<FadeOutThemeAnimation
TargetName="ScrollBarSeparator" />
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="VerticalScrollBar"
Storyboard.TargetProperty="IndicatorMode"
Duration="0">
<DiscreteObjectKeyFrame
KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<ScrollingIndicatorMode>TouchIndicator</ScrollingIndicatorMode>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="HorizontalScrollBar"
Storyboard.TargetProperty="IndicatorMode"
Duration="0">
<DiscreteObjectKeyFrame
KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<ScrollingIndicatorMode>TouchIndicator</ScrollingIndicatorMode>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState
x:Name="MouseIndicator">
<Storyboard>
<FadeInThemeAnimation
TargetName="ScrollBarSeparator" />
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="VerticalScrollBar"
Storyboard.TargetProperty="IndicatorMode"
Duration="0">
<DiscreteObjectKeyFrame
KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<ScrollingIndicatorMode>MouseIndicator</ScrollingIndicatorMode>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="HorizontalScrollBar"
Storyboard.TargetProperty="IndicatorMode"
Duration="0">
<DiscreteObjectKeyFrame
KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<ScrollingIndicatorMode>MouseIndicator</ScrollingIndicatorMode>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid
Background="{TemplateBinding Background}">
<Grid.ColumnDefinitions>
<ColumnDefinition
Width="*" />
<ColumnDefinition
Width="Auto" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition
Height="*" />
<RowDefinition
Height="Auto" />
</Grid.RowDefinitions>
<ScrollContentPresenter
x:Name="ScrollContentPresenter"
Grid.RowSpan="2"
Grid.ColumnSpan="2"
ContentTemplate="{TemplateBinding ContentTemplate}"
Margin="{TemplateBinding Padding}" />
<ScrollBar
x:Name="VerticalScrollBar"
Grid.Column="1"
IsTabStop="False"
Maximum="{TemplateBinding ScrollableHeight}"
Margin="1,0,0,0"
Orientation="Vertical"
Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
Value="{TemplateBinding VerticalOffset}"
ViewportSize="{TemplateBinding ViewportHeight}"
HorizontalAlignment="Right" />
<ScrollBar
x:Name="HorizontalScrollBar"
IsTabStop="False"
Maximum="{TemplateBinding ScrollableWidth}"
Margin="0,1,0,0"
Orientation="Horizontal"
Grid.Row="1"
Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
Value="{TemplateBinding HorizontalOffset}"
ViewportSize="{TemplateBinding ViewportWidth}" />
<Rectangle
x:Name="ScrollBarSeparator"
Grid.Row="1"
Grid.Column="1"
Margin="1,1,0,0"
StrokeThickness="1"
Fill="{StaticResource ScrollBarTrackBrush}"
Stroke="{StaticResource ScrollBarTrackBorderBrush}" />
</Grid>
</Border>
</ControlTemplate>
答案 1 :(得分:0)
在混合中: 您可以通过编辑VerticalScrollBar的模板使其可见,该模板是ScrollViewers模板的一部分,ScrollViewers模板本身也是ListBox模板的一部分。
将 VerticalScrollBar的可见性设置为可见,将其不透明度设置为100%,然后它将永久可见。
答案 2 :(得分:0)
我只用HTML / CSS / JavaScript开发了商店应用,我遇到了同样的问题。
我希望即使将光标移开也能始终显示滚动条。
我在CSS中找到了这个解决方案:
div#overflowableDiv{
overflow-y: auto;
-ms-overflow-style: scrollbar;
}
请参阅: http://msdn.microsoft.com/en-us/library/windows/apps/hh441298.aspx