重新想象 Windows 8 Store Apps (9)

zxg588

　　[源码下载]




重新想象 Windows 8 Store Apps (9) - 控件之 ScrollViewer 基础　　
作者：webabcd

介绍
重新想象 Windows 8 Store Apps 之 ScrollViewer

• 演示 ScrollViewer 的基本应用
  
• 演示 ScrollBar 的基本应用
  
• 演示 ScrollContentPresenter 的基本应用
  

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




















　　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 += "\r\n";
lblMsg.Text += "ComputedVerticalScrollBarVisibility: " + scrollViewer.ComputedVerticalScrollBarVisibility;
lblMsg.Text += "\r\n";
lblMsg.Text += "ExtentWidth: " + scrollViewer.ExtentWidth;
lblMsg.Text += "\r\n";
lblMsg.Text += "ExtentHeight: " + scrollViewer.ExtentHeight;
lblMsg.Text += "\r\n";
lblMsg.Text += "ViewportWidth: " + scrollViewer.ViewportWidth;
lblMsg.Text += "\r\n";
lblMsg.Text += "ViewportHeight: " + scrollViewer.ViewportHeight;
lblMsg.Text += "\r\n";
lblMsg.Text += "HorizontalOffset: " + scrollViewer.HorizontalOffset;
lblMsg.Text += "\r\n";
lblMsg.Text += "VerticalOffset: " + scrollViewer.VerticalOffset;
lblMsg.Text += "\r\n";
lblMsg.Text += "ScrollableWidth: " + scrollViewer.ScrollableWidth;
lblMsg.Text += "\r\n";
lblMsg.Text += "ScrollableHeight: " + scrollViewer.ScrollableHeight;
lblMsg.Text += "\r\n";
}
private void Button_Click_1(object sender, RoutedEventArgs e)
{
scrollViewer.ScrollToHorizontalOffset(scrollViewer.ScrollableWidth / 2);
scrollViewer.ScrollToVerticalOffset(scrollViewer.ScrollableHeight / 2);
}
}
}
　　
2、ScrollBar 的基本应用
ScrollViewer/ScrollBarDemo.xaml













　　ScrollViewer/ScrollBarDemo.xaml.cs



/*
* ScrollBar - 滚动条控件
*
* 本例通过访问 ScrollViewer 内的名为 VerticalScrollBar 的 ScrollBar 控件，来简要说明 ScrollBar 控件
*/
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using XamlDemo.Common;
namespace XamlDemo.Controls.ScrollViewer
{
public sealed partial class ScrollBarDemo : Page
{
public ScrollBarDemo()
{
this.InitializeComponent();
this.Loaded += ScrollBarDemo_Loaded;
}
void ScrollBarDemo_Loaded(object sender, RoutedEventArgs e)
{
// 找到 ScrollViewer 内的名为 VerticalScrollBar 的 ScrollBar 控件，即 ScrollViewer 内的垂直滚动条
var scrollBar = Helper.GetVisualChild(scrollViewer, "VerticalScrollBar");
// ValueChanged - 当滚动条的值发生改变是所触发的事件
scrollBar.ValueChanged += scrollBar_ValueChanged;
}
void scrollBar_ValueChanged(object sender, RangeBaseValueChangedEventArgs e)
{
// 显示垂直滚动条的当前值
lblMsg.Text = e.NewValue.ToString();
}
}
}
　　
3、ScrollContentPresenter 的基本应用
ScrollViewer/ScrollContentPresenterDemo.xaml














　　ScrollViewer/ScrollContentPresenterDemo.xaml.cs



/*
* ScrollContentPresenter - ScrollViewer 的内容呈现器（类似的有 ContentPresenter, ItemsPresenter）
*
* ScrollContentPresenter 用来呈现 ScrollViewer 的 Content
*/
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using XamlDemo.Common;
namespace XamlDemo.Controls.ScrollViewer
{
public sealed partial class ScrollContentPresenterDemo : Page
{
public ScrollContentPresenterDemo()
{
this.InitializeComponent();
this.Loaded += ScrollContentPresenterDemo_Loaded;
}
void ScrollContentPresenterDemo_Loaded(object sender, RoutedEventArgs e)
{
// 找到 ScrollViewer 内的名为 ScrollContentPresenter 的 ScrollContentPresenter 控件
var scrollContentPresenter = Helper.GetVisualChild(scrollViewer, "ScrollContentPresenter");
scrollContentPresenter.Margin = new Thickness(100);
}
}
}
　　
OK
[源码下载]