Windows 8 Store Apps学习(9) ScrollViewer控件基础

介绍

重新想象 Windows 8 Store Apps 之 ScrollViewer

演示 ScrollViewer 的基本应用

演示 ScrollBar 的基本应用

演示 ScrollContentPresenter 的基本应用

示例

1、 ScrollViewer 的基本应用

ScrollViewer/Demo.xaml

<Page
    x: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 - 是否启用延迟滚动，在滚动内容过多时，启用延迟混动可以改善性能，默认值为 false
                    HorizontalScrollMode - 水平滚动条的行为方式，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 += "\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);
        }
    }
}

以上是小编为您精心准备的的内容，在的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索scrollviewer
， scrollview
， text
， 滚动
， 加入scrollview显示
， 加入scrollview不显示
， 滚动动画scrollviewer
， 偏移
， scrollview 
， scrollview滑动冲突
， scrollview滑动距离
， 可滚动
， scrollview反弹
水平滚动控件
，以便于您获取更多的相关知识。