Windows Phone 8.1中ScrollViewer（一）

开篇之前：

推荐王磊老师的Windows 8.1关于ScrollViewer的讲解的博客

链接：重新想象 Windows 8 Store Apps (9) - 控件之 ScrollViewer 基础

ScrollViewer的作用就是当内容超出了设定的范围的时候，出现滚动条用来滚动查看超出的内容

要想在ScrollViewer里面写东西，OK，你可以直接写个<TextBlock>标签，但是当写第二个<TextBlock>的时候就会报

错了，说是多次设置Content值

所以要用布局控件Grid，StackPanel之类的标签直接写

综上，你可以：

也可以：

第一种写法默认就已经添加到Content里面了。Content里面就是ScrollViewer的内容了。

首先，ScrollViewer重要的属性和方法

a.HorizontalScrollMode 和 VerticalScrollMode 属性

用来设置水平和垂直滚动条的行为方式，即是否可以滚动。值有三种选项(Enalbled,Disabled,Auto)

b.HorizontalScrollBarVisibility 和 VerticalScrollBarVisibility 属性

用来设置水平和垂直滚动条是否可见。值为True或者False

c.ViewChanged 方法

表示滚动触发的事件

有了ViewChanged方法，然后我们可以在后台随时监控前台ScrollViewer的行动了

怎么监视呢？如下：ScrollViewer的另一些重要属性

a.ComputedHorizontalScrollBarVisibility 和 ComputedVerticalScrollBarVisibility

判断水平和垂直滚动条的可见性

b.ExtentWidth 和 ExtentHeight

判断ScrollViewer内的内容的宽和高，如我下面代码中设置的宽和高都是500

e.ViewportWidth 和 ViewportHeight

判断可视区的宽和高

f.ScrollableWidth 和 ScrollableHeight

判断可滚动区域的水平和垂直方向的大小，你会发现它的是就是拿（ExtentWidth - ViewportWidth）和

（ ExtentHeight - ViewportHeight ）的结果。可以从我下面的结果中看到ScrollabelWidth一直是100

g.HorizontalOffset 和 VerticalOffset

判断滚动内容的水平和垂直方向的偏移量，它的范围就是【0，f】,f 就指的是上面 f 代表的值

方法：

我们也可以动态指定ScrollViewer滚动到哪里

Windows 8.1中是用ScrollToHorizontalOffset()和ScrollToVerticalOffset()这两个方法，当然仍然可以在Windows

Phone 8.1中使用，但是方法已经过期了

最新的WP8.1中类似功能的方法是ChangeView()方法，参数就是上面两个值，最后一个是zoomfactor，默认为1即可

好了，理论我就学了这么多，下面直接贴代码了：

这里由于空间有限，我就主要写了水平滚动条的，垂直滚动条跟它是一样一样的

XAML：

<Pagex:Class="TestUnion.ScrollViewerTest"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:local="using:TestUnion"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"mc:Ignorable="d"Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"><Grid><Grid.RowDefinitions><RowDefinition Height="50*"/><RowDefinition Height="50*"/></Grid.RowDefinitions><ScrollViewer x:Name="scrollViewer" IsDeferredScrollingEnabled="True"HorizontalScrollMode="Enabled" VerticalScrollMode="Enabled"HorizontalScrollBarVisibility="Visible"VerticalScrollBarVisibility="Visible"ViewChanged="scrollViewer_ViewChanged"><ScrollViewer.Content><StackPanel Height="500" Width="500"><StackPanel.Background><ImageBrush ImageSource="Assets/3.jpg" /></StackPanel.Background><TextBox Header="用户名：" /><PasswordBox Header="密码：" /><PasswordBox Header="确认密码："/><Button x:Name="btn" Content="滚动到指定的水平或垂直偏移位置(这里选居中)" Click="btn_Click"/></StackPanel></ScrollViewer.Content></ScrollViewer><StackPanel Grid.Row="1" Orientation="Vertical"><StackPanel Orientation="Horizontal"><TextBox x:Name="horVisibility" PlaceholderText="判断水平滚动条可见性" Header="ComputedHorizontalScrollBarVisibility" Width="300" Margin="10,10,0,0" /></StackPanel><StackPanel Orientation="Horizontal"><TextBox x:Name="verVisibility" PlaceholderText="判断垂直滚动条可见性" Header="ComputedVerticalScrollBarVisibility" Width="300" Margin="10,10,0,0" /></StackPanel><StackPanel Orientation="Horizontal"><!--这边当然也存在--><!--ExtentHeight-ScrollViewer内的内容的高--><!--ViewportHeight-可视区的高--><TextBox x:Name="extentWidth" PlaceholderText="ScrollViewer内的内容的宽" Header="ExtentWidth" Width="255" Margin="10,10,0,0" /><TextBox x:Name="viewportWidth" PlaceholderText="可视区的宽" Header="ViewportWidth " Width="120" Margin="10,10,0,0" /></StackPanel><StackPanel Orientation="Horizontal"><!--这边当然也存在--><!--VerticalOffset-滚动内容的垂直方向的偏移量--><!--ScrollableHeight-可滚动区域的垂直方向的大小--><TextBox x:Name="horizontalOffset" PlaceholderText="滚动内容水平偏移量" Header="HorizontalOffset" Width="195" Margin="10,10,0,0" /><TextBox x:Name="scrollableWidth" PlaceholderText="可滚动区域水平大小" Header="ScrollableWidth" Width="195" Margin="10,10,0,0" /></StackPanel></StackPanel></Grid>
</Page>

.cs：

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;// “空白页”项模板在 http://go.microsoft.com/fwlink/?LinkID=390556 上有介绍namespace TestUnion
{/// <summary>/// 可用于自身或导航至 Frame 内部的空白页。/// </summary>public sealed partial class ScrollViewerTest : Page{public ScrollViewerTest(){this.InitializeComponent();}/// <summary>/// 在此页将要在 Frame 中显示时进行调用。/// </summary>/// <param name="e">描述如何访问此页的事件数据。/// 此参数通常用于配置页。</param>protected override void OnNavigatedTo(NavigationEventArgs e){}private void scrollViewer_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e){//ComputedHorizontalScrollBarVisibility - 当前水平滚动条的可见性horVisibility.Text = scrollViewer.ComputedHorizontalScrollBarVisibility.ToString();//ComputedVerticalScrollBarVisibility - 当前垂直滚动条的可见性verVisibility.Text = scrollViewer.ComputedVerticalScrollBarVisibility.ToString();//ExtentWidth - ScrollViewer 内的内容的宽extentWidth.Text = scrollViewer.ExtentWidth.ToString();//ViewportWidth - 可视区的宽viewportWidth.Text = scrollViewer.ViewportWidth.ToString();//HorizontalOffset - 滚动内容的水平方向的偏移量horizontalOffset.Text = scrollViewer.HorizontalOffset.ToString();//ScrollableWidth - 可滚动区域的水平方向的大小scrollableWidth.Text = scrollViewer.ScrollableWidth.ToString();}private void btn_Click(object sender, RoutedEventArgs e){//让ScrollView里面的内容居中scrollViewer.ChangeView(scrollViewer.ScrollableWidth / 2, scrollViewer.ScrollableHeight / 2,1);//这边ScrollToHorizontalOffset()和ScrollToVerticalOffset()函数已经过期了(但是仍然是可以用的)，现在改用上面的ChangeView()函数//ChangeView()函数第一个和第二个参数分别是水平滚动的偏移量和垂直滚动的偏移量，第三个是zoomfactor，默认值是1,好像是关于缩放的，这里设为1就行了//scrollViewer.ScrollToHorizontalOffset(scrollViewer.ScrollableWidth / 2);//scrollViewer.ScrollToVerticalOffset(scrollViewer.ScrollableHeight / 2);}}
}

运行截图：

初始：

左滑：

点击按钮让其居中：

Windows Phone 8.1中ScrollViewer（一）相关推荐

Windows 7的CMD中 Telnet 无法执行的解决办法
在Windows 7的CMD中,执行telnet 192.168.1.10 80 会提示没有这个命令的提示,这是因为Win7默认是没有安装Telnet的(在以往的WINDOWS系统中都是默认安装的). ...
Windows XP下vs2010中配置OpenCV2.4.3
1. 从http://sourceforge.net/projects/opencvlibrary/files/opencv-win/2.4.3/下载OpenCV2.4.3: 2. 将OpenCV ...
Windows下在Django中创建项目时ImportError: No module named django.core解决方法
Windows下在Django中创建项目时ImportError: No module named django.core解决方法今天在对照<Python编程:从入门到实践>学## 标题 ...
如何在windows server 2008 AD中禁用USB端口(转庐阳侠们博客）
本文使用的系统:Windows Server 2008 R2 企业版. 域功能级别:Windows Server 2008 R2 在Windows Server 2008 AD中的组策略编辑器,依次找 ...
几个比较好用的Windows API在C#中的用法。
几个比较好用的Windows API在C#中的用法. #region Windows Api 定义 /// /// 模拟鼠标事件 /// /// 鼠标事件的Enum /// X座标 ...
Windows Mobile 5.0 中为开发人员提供的新功能(3)
Windows Mobile 5.0 中为开发人员提供的新功能(3) Pocket Outlook 增强功能 Pocket Outlook 向用户和应用程序开发人员提供了易于使用的 PIM.将 Poc ...
windows在命令行中查看当前路径
windows在命令行中查看当前路径文章目录: 一.Linux命令行中查看当前路径二.windows命令行中查看当前路径一.Linux命令行中查看当前路径命令:pwd mosheng@ms-s ...
Windows Server 2003 R2中的“分布式文件系统”案例应用
"分布式文件系统(DFS)"是从Windows 2000 Server开始提供的服务,用于将企业网络中分散的多台服务器进行集中管理并对外提供统一的访问.启用DFS后,网络中的用户只 ...
Windows Presentation Foundation(WPF)中的数据绑定（使用XmlDataProvider作控件绑定）
原文:Windows Presentation Foundation(WPF)中的数据绑定(使用XmlDataProvider作控件绑定) ------------------------------ ...

Windows Phone 8.1中ScrollViewer（一）

Windows Phone 8.1中ScrollViewer（一）相关推荐

最新文章

热门文章