控件(ScrollViewer 基础): ScrollViewer, ScrollBar, ScrollContentP

时间:2021-10-14 02:26:07

ScrollContentPresenter



示例
1、ScrollViewer 的基本应用
Controls/ScrollViewerDemo/ScrollViewerDemo.xaml

<Page x:Class="Windows10.Controls.ScrollViewerDemo.ScrollViewerDemo" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:Windows10.Controls.ScrollViewerDemo" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid Background="Transparent"> <StackPanel Margin="10 0 10 10"> <StackPanel Orientation="Horizontal" Margin="5"> <!-- ScrollViewer - 滚动视图控件 Content - 滚动视图内的内容([ContentProperty(Name = "Content")]) IsDeferredScrollingEnabled - 是否启用延迟滚动,在滚动内容过多时,启用延迟混动可以改善性能,默认值为 false HorizontalScrollMode - 水平滚动模式 Disabled - 禁用 Enabled - 启用 Auto - 同 Enabled VerticalScrollMode - 垂直滚动模式 Disabled - 禁用 Enabled - 启用 Auto - 同 Enabled HorizontalScrollBarVisibility - 水平滚动条的可见性 Auto - 自动。内容显示得下就隐藏滚动条,内容显示不下就显示滚动条 Visible - 显示滚动条 Hidden - 隐藏滚动条 Disabled - 隐藏滚动条,并将 HorizontalScrollMode 强制设置为 Disabled VerticalScrollBarVisibility - 垂直滚动条的可见性 Auto - 自动。内容显示得下就隐藏滚动条,内容显示不下就显示滚动条 Visible - 显示滚动条 Hidden - 隐藏滚动条 Disabled - 隐藏滚动条,并将 VerticalScrollMode 强制设置为 Disabled ViewChanging - 在视图即将发生变化(滚动或缩放等)时触发的事件 ViewChanged - 在视图已经发生变化(滚动或缩放等)后触发的事件 DirectManipulationStarted - 触摸环境下操作(滚动或缩放等)即将开始时触发的事件 DirectManipulationCompleted - 触摸环境下操作(滚动或缩放等)已经完成后触发的事件 --> <ScrollViewer Name="scrollViewer" Width="400" Height="400" HorizontalAlignment="Left" IsDeferredScrollingEnabled="False" HorizontalScrollMode="Enabled" VerticalScrollMode="Enabled" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible" ViewChanging="scrollViewer_ViewChanging" ViewChanged="scrollViewer_ViewChanged" DirectManipulationStarted="scrollViewer_DirectManipulationStarted" DirectManipulationCompleted="scrollViewer_DirectManipulationCompleted"> <ScrollViewer.Content> <Image Source="/Assets/StoreLogo.png" Width="1000" Margin="5" /> </ScrollViewer.Content> </ScrollViewer> <!-- ScrollViewer - 滚动视图控件 TopHeader - 显示在上端的内容,垂直滚动时不动 LeftHeader - 显示在左端的内容,水平滚动时不动 TopLeftHeader - 显示在左上端的内容,垂直滚动和水平滚动时均不动 注:如果要使用 TopHeader, LeftHeader, TopLeftHeader 则 ScrollViewer.Content 中的内容必须是 HorizontalAlignment="Left" VerticalAlignment="Top" --> <ScrollViewer Width="400" Height="400" HorizontalAlignment="Left" Margin="20 0 0 0" HorizontalScrollMode="Enabled" VerticalScrollMode="Enabled" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible"> <ScrollViewer.Content> <Image Source="/Assets/StoreLogo.png" Width="1000" Margin="5" HorizontalAlignment="Left" VerticalAlignment="Top" /> </ScrollViewer.Content> <ScrollViewer.TopHeader> <TextBlock Text="TopHeader" /> </ScrollViewer.TopHeader> <ScrollViewer.LeftHeader> <TextBlock Text="LeftHeader" /> </ScrollViewer.LeftHeader> <ScrollViewer.TopLeftHeader> <TextBlock Text="TopLeftHeader" /> </ScrollViewer.TopLeftHeader> </ScrollViewer> </StackPanel> <!--使 ScrollViewer 里的内容滚动到相对于 ScrollViewer 居中的位置--> <Button Name="btnChangeView" Content="居中" Margin="5" Click="btnChangeView_Click" /> <TextBlock Name="lblMsg" Margin="5" /> </StackPanel> </Grid> </Page>

Controls/ScrollViewerDemo/ScrollViewerDemo.xaml.cs