Silverlight實用竅門系列:69.Silverlight的ScrollViewer


  ScrollViewer在Silverlight中是一個很常用的控件,它有以下一些常用可設置屬性:

  HorizontalScrollBarVisibility:水平方向滾動條

  VerticalScrollBarVisibility:垂直方向滾動條,其值為ScrollBarVisibility枚舉類型分為

    Disabled:不顯示,但是可以通過鼠標或者鍵盤移動文字內容

    Auto:根據內容寬度和高度自動決定是否出現滾動條

    Hidden:總是隱藏滾動條,無法移動被遮擋的內容

    Visible:總是顯示滾動條

  ScrollToHorizontalOffset:設置ScrollViewer的內容水平偏移量

  ScrollToVerticalOffset:設置ScrollViewer的內容垂直偏移量

 

  Scrollviewer的只可獲取屬性如下:

  VerticalOffset:內容的垂直偏移量

  HorizontalOffset:內容的水平偏移量

  ExtentHeight:內容的總垂直高度

  ExtentWidth:內容的總水平寬度

  ViewportHeight:可見內容的垂直高度

  ViewportWidth:可見內容窗口的水平寬度

  ActualHeight:ScrollViewer控件的實際高度

  ActualHeight:ScrollViewer控件的實際寬度

  下面我們通過一個實例來看ScrollViewer的具體應用以及獲取他們的值,Xaml代碼如下:

    <Grid x:Name="LayoutRoot" Background="White">
        <Canvas>
            <ScrollViewer Name="sView" Height="300" Width="300" 
                          HorizontalScrollBarVisibility="Auto"
                          VerticalScrollBarVisibility="Auto" >
                <ScrollViewer.Content>
                    <Canvas  Height="400" Width="400">
                        <Rectangle  Name="retBlue" Width="200" Height="200" Fill="#FF45C2AD" />
                        <Rectangle  Name="retBlue2" Width="200" Height="200" 
                                    Fill="#FFC24588" Canvas.Left="200"  />
                        <Rectangle  Name="retBlue3" Width="200" Height="200"
                                    Fill="#FFB8C245"  Canvas.Top="200" />
                        <Rectangle  Name="retBlue4" Width="200" Height="200"
                                    Fill="#FF4532AD"  Canvas.Top="200" Canvas.Left="200" />
                    </Canvas>
                </ScrollViewer.Content> 
        </ScrollViewer>
            <Button Canvas.Left="314" Canvas.Top="45" Content="設 置"
                    Height="23" Name="button1" Width="75" Click="button1_Click" />
            <Button Canvas.Left="314" Canvas.Top="85" Content="查 看" 
                    Height="23" Name="button2" Width="75" Click="button2_Click" />
            <sdk:Label Canvas.Left="14" Canvas.Top="306" Height="28" Name="label1" Width="125" />
            <sdk:Label Canvas.Left="175" Canvas.Top="306" Height="28" Name="label2" Width="125" />
            <sdk:Label Canvas.Left="14" Canvas.Top="332" Height="28" Name="label3" Width="125" />
            <sdk:Label Canvas.Left="175" Canvas.Top="332" Height="28" Name="label4" Width="125" />
            <sdk:Label Canvas.Left="14" Canvas.Top="358" Height="28" Name="label5" Width="125" />
            <sdk:Label Canvas.Left="175" Canvas.Top="358" Height="28" Name="label6" Width="125" />
            <sdk:Label Canvas.Left="13" Canvas.Top="384" Height="28" Name="label7" Width="125" />
            <sdk:Label Canvas.Left="174" Canvas.Top="384" Height="28" Name="label8" Width="125" />
        </Canvas>
    </Grid>

  然后我們來看其cs后台代碼如下:

    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
        }

        bool show = true;
        private void button1_Click(object sender, RoutedEventArgs e)
        {
            if (show)
            {
                //設置ScrollViewer的內容水平偏移量
                this.sView.ScrollToHorizontalOffset(50);
                //設置ScrollViewer的內容垂直偏移量
                this.sView.ScrollToVerticalOffset(50);
            }
            else
            {
                this.sView.ScrollToHorizontalOffset(0);
                this.sView.ScrollToVerticalOffset(0);
            }
            show = !show;
           
        }

        private void button2_Click(object sender, RoutedEventArgs e)
        {
            //內容的垂直偏移量
            string vo = sView.VerticalOffset.ToString();
            //內容的水平偏移量
            string ho = sView.HorizontalOffset.ToString();
            //內容的總垂直高度
            string eh = sView.ExtentHeight.ToString();
            //內容的總水平寬度
            string ew = sView.ExtentWidth.ToString();
            //可見內容的垂直高度
            string vh = sView.ViewportHeight.ToString();
            //可見內容窗口的水平寬度
            string vw = sView.ViewportWidth.ToString();
            //ScrollViewer控件的實際高度
            string ah = sView.ActualHeight.ToString();
            //ScrollViewer控件的實際寬度
            string aw = sView.ActualHeight.ToString();
            this.label1.Content = "VerticalOffset:" + vo;
            this.label2.Content = "HorizontalOffset:" + ho;
            this.label3.Content = "ExtentHeight:" + eh;
            this.label4.Content = "ExtentWidth:" + ew;
            this.label5.Content = "ViewportHeight:" + vh;
            this.label6.Content = "ViewportWidth:" + vw;
            this.label7.Content = "ActualHeight:" + ah;
            this.label8.Content = "ActualHeight:" + aw;
            sView.HorizontalScrollBarVisibility = ScrollBarVisibility.Disabled;
        }

    }

  最后如需源碼請點擊 SLScrollView.zip 下載,實例效果圖如下:


 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM