首页 / 软件开发 / .NET编程技术 / Windows 8 Store Apps学习（9） ScrollViewer控件基础

Windows 8 Store Apps学习（9） ScrollViewer控件基础2013-12-04 博客园 webabcd介绍

重新想象 Windows 8 Store Apps 之 ScrollViewer

演示 ScrollViewer 的基本应用

演示 ScrollBar 的基本应用

演示 ScrollContentPresenter 的基本应用

示例

1、 ScrollViewer 的基本应用

ScrollViewer/Demo.xaml

<Pagex:Class="XamlDemo.Controls.ScrollViewer.Demo"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:local="using:XamlDemo.Controls.ScrollViewer"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="120 0 0 0"><TextBlock Name="lblMsg" /><！--ScrollViewer - 滚动视图控件Content - 滚动视图内的内容IsDeferredScrollingEnabled - 是否启用延迟滚动，在滚动内容过多时，启用延迟混动可以改善性能，默认值为 falseHorizontalScrollMode - 水平滚动条的行为方式，Windows.UI.Xaml.Controls.ScrollMode枚举（Disabled, Enabled, Auto）VerticalScrollMode - 垂直滚动条的行为方式HorizontalScrollBarVisibility - 水平滚动条的可见性，Windows.UI.Xaml.Controls.ScrollBarVisibility枚举（Disabled, Auto, Hidden, Visible）VerticalScrollBarVisibility - 垂直滚动条的可见性ViewChanged - 发生滚动时所触发的事件--><ScrollViewer Name="scrollViewer" Width="400" Height="400" Margin="0 10 0 0" HorizontalAlignment="Left"IsDeferredScrollingEnabled="False"ViewChanged="scrollViewer_ViewChanged_1"HorizontalScrollMode="Enabled" VerticalScrollMode="Enabled"HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible"><ScrollViewer.Content><Image Source="/Assets/Logo.png" Width="1000" /></ScrollViewer.Content></ScrollViewer><StackPanel Orientation="Horizontal"><！--使 ScrollViewer 里的内容滚动到相对于 ScrollViewer 居中--><Button Content="居中" Click="Button_Click_1" /></StackPanel> </StackPanel></Grid></Page>

ScrollViewer/Demo.xaml.cs

/* * ScrollViewer - 滚动视图控件 ** 本例用于演示 ScrollViewer 的基本用法 */using Windows.UI.Xaml;using Windows.UI.Xaml.Controls;namespace XamlDemo.Controls.ScrollViewer{public sealed partial class Demo : Page{public Demo（）{this.InitializeComponent（）;}private void scrollViewer_ViewChanged_1（object sender, ScrollViewerViewChangedEventArgs e）{lblMsg.Text = "";/* * ScrollViewer - 滚动视图控件 * ComputedHorizontalScrollBarVisibility - 当前水平滚动条的可见性，比如当 HorizontalScrollBarVisibility 设置为 Auton 时，可以通过 ComputedHorizontalScrollBarVisibility 来判断当前水平滚动条是否可见 * ComputedVerticalScrollBarVisibility - 当前垂直滚动条的可见性 * ExtentWidth - ScrollViewer 内的内容的宽 * ExtentHeight - ScrollViewer 内的内容的高 * ViewportWidth - 可视区的宽 * ViewportHeight - 可视区的高 * HorizontalOffset - 滚动内容的水平方向的偏移量 * VerticalOffset - 滚动内容的垂直方向的偏移量 * ScrollableWidth - 可滚动区域的水平方向的大小 * ScrollableHeight - 可滚动区域的垂直方向的大小 ** ScrollToHorizontalOffset（） - 滚动到指定的水平偏移位置 * ScrollToVerticalOffset（） - 滚动到指定的垂直偏移位置 */lblMsg.Text += "ComputedHorizontalScrollBarVisibility: " + scrollViewer.ComputedHorizontalScrollBarVisibility;lblMsg.Text += "
";lblMsg.Text += "ComputedVerticalScrollBarVisibility: " + scrollViewer.ComputedVerticalScrollBarVisibility;lblMsg.Text += "
";lblMsg.Text += "ExtentWidth: " + scrollViewer.ExtentWidth;lblMsg.Text += "
";lblMsg.Text += "ExtentHeight: " + scrollViewer.ExtentHeight;lblMsg.Text += "
";lblMsg.Text += "ViewportWidth: " + scrollViewer.ViewportWidth;lblMsg.Text += "
";lblMsg.Text += "ViewportHeight: " + scrollViewer.ViewportHeight;lblMsg.Text += "
";lblMsg.Text += "HorizontalOffset: " + scrollViewer.HorizontalOffset;lblMsg.Text += "
";lblMsg.Text += "VerticalOffset: " + scrollViewer.VerticalOffset;lblMsg.Text += "
";lblMsg.Text += "ScrollableWidth: " + scrollViewer.ScrollableWidth;lblMsg.Text += "
";lblMsg.Text += "ScrollableHeight: " + scrollViewer.ScrollableHeight;lblMsg.Text += "
";}private void Button_Click_1（object sender, RoutedEventArgs e）{scrollViewer.ScrollToHorizontalOffset（scrollViewer.ScrollableWidth / 2）;scrollViewer.ScrollToVerticalOffset（scrollViewer.ScrollableHeight / 2）;}}}