آموزش WPF (مقدماتی تا پیشرفته)

[Mahdi.Kiani]

ادامه کنترل Scroll Viewer

کنترل اسکرول با برنامه نویسی :

همانطور که در بخش قبل دیدیدريال می توانستید با موس و یا با کنترل های جهت نما، کنترل اسکرول خود را مدیریت کنید.
در این بخش با توابعی آشنا خواهید شد که می توانید توسط آن ها کنترل ScrollViewer را در زمان اجرای برنامه و با کد نویسی مدیریت نمایید.


نکته :
این توابع هر کدام دارای دو نسخه می باشند، یکی برای اسکرول عمودی و دیگری برای اسکرول افقی. در اینجا توابع مربوط به اسکرول عمودی و عملکرد آن ها را خواهیم دید و در مورد توابع مروبط به اسکرول افقی تنها نام آن ها ذکر می گردند. چون عملکرد آن ها دقیقا مشابه عملکر نسخه خود برای اسکرول عمودی هستند.

متد LineUp() :

عملکر این متد مانند کلیک کردن بر روی علامت جهت نمای بالایی اسکرول عمودی می باشد. پس میزان جا بجایی که توسط این متد انجام می گیرید بستگی به میزان جابجایی توسط علامت جهت نمای بالایی دارد.
معادل این متد برای نوار اسکرول افقی ، متد LineLeft می باشد.

متد LineDown() :
عملکر این متد مانند کلیک کردن بر روی علامت جهت نمای پایینی اسکرول عمودی می باشد. پس میزان جا بجایی که توسط این متد انجام می گیرید بستگی به میزان جابجایی توسط علامت جهت نمای بالایی دارد.
معادل این متد برای نوار اسکرول افقی ، متد LineRight می باشد


متد PageUp :

عملکر این متد مانند کلیک کردن بر روی فاصله بین علامت جهت نمای بالایی و دستگیره اسکرول در اسکرول عمودی می باشد.
معادل این متد برای نوار اسکرول افقی ، متد PageLeft می باشد

متد PageDown : عملکر این متد مانند کلیک کردن بر روی فاصله بین علامت جهت نمای پایینی و دستگیره اسکرول در اسکرول عمودی می باشد.
معادل این متد برای نوار اسکرول افقی ، متد PageRight می باشد

متد ScrollToHome :

این متد اسکرول را به پایین ترین قسمت ممکن انتقال می دهد.
معادل این متد برای نوار اسکرول افقی ، ScrollToLeftEnd می باشد.

متد ScrollToEnd :

این متد اسکرول را به بالاترین قسمت ممکن انتقال می دهد.
معادل این متد برای نوار اسکرول افقی ، متد ScrollToRightEnd می باشد.

متد ScrollToVerticalOffset :
این متد بر اساس مقداری که به عنوان آرگومان می گیرد عمل اسکرول را انجام می دهد.
معادل این متد برای نوار اسکرول افقی؛ متد ScrollToHorizontalOffset می باشد

قطعه کد زیر نحوه استفاده از این متد ها را نشان می دهد :

<Window x:Class="contentControls.ProgrammingScrollViewer"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    Title="ProgrammingScrollViewer" Height="300" Width="650">

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition  Height="Auto"></RowDefinition>

            <RowDefinition></RowDefinition>

            <RowDefinition Height="Auto"></RowDefinition>

            <RowDefinition Height="AUto"></RowDefinition>

        </Grid.RowDefinitions>



        <Grid.ColumnDefinitions>

            <ColumnDefinition></ColumnDefinition>

            <ColumnDefinition></ColumnDefinition>

            <ColumnDefinition></ColumnDefinition>

            <ColumnDefinition></ColumnDefinition>

            <ColumnDefinition></ColumnDefinition>

        </Grid.ColumnDefinitions>





        <WrapPanel Margin="10" Grid.ColumnSpan="5" Orientation="Horizontal">

            <Button Margin="1" Tag="LU" Click="ScrollButtons_Click">LineUp()</Button>

            <Button Margin="1" Tag="LD" Click="ScrollButtons_Click">LineDown()</Button>

            <Button  Margin="1" Tag="PU" Click="ScrollButtons_Click">PageUp()</Button>

            <Button Margin="1" Tag="PD" Click="ScrollButtons_Click">PageDown()</Button>

            <Button Margin="1" Tag="TE" Click="ScrollButtons_Click">ScrollToEnd()</Button>

            <Button Margin="1" Tag="TH" Click="ScrollButtons_Click">ScrollToHome()</Button>

            <Button  Margin="1" Tag="TOV" Click="ScrollButtons_Click">ScrollToVerticalOffset  (50)</Button>

        </WrapPanel>



        <ScrollViewer Grid.Row="2" Margin="1,1,1,5">

            <TextBlock TextWrapping="Wrap" Background="BurlyWood">             

            Normal Images 

            </TextBlock>

        </ScrollViewer>

        

        <ScrollViewer Grid.Row="2" Grid.Column="1" Margin="1,1,1,5">

            <TextBlock TextWrapping="Wrap" Background="BurlyWood">             

            After 2 LineDown And 2 LineRight

            </TextBlock>

        </ScrollViewer>

        <ScrollViewer Grid.Row="2" Grid.Column="2" Margin="1,1,1,5">

            <TextBlock TextWrapping="Wrap" Background="BurlyWood">             

            After 2 PageDown And 2 PageRight

            </TextBlock>

        </ScrollViewer>

        <ScrollViewer Grid.Row="2" Grid.Column="3" Margin="1,1,1,5">

            <TextBlock TextWrapping="Wrap" Background="BurlyWood">             

            After ScrollToEnd And ScrollToRightEnd

            </TextBlock>

        </ScrollViewer>

        <ScrollViewer Grid.Row="2" Grid.Column="4" Margin="1,1,1,5">

            <TextBlock TextWrapping="Wrap" Background="BurlyWood">             

            After ScrollToVerticalOffset (50) And ScrollToHorizontalOffset(50)

            </TextBlock>

        </ScrollViewer>



        <Button Margin="5" Grid.Row="1" Grid.Column="0" VerticalAlignment="Center" HorizontalAlignment="Center">

            <ScrollViewer Name="btnScroll1" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">



                <Image VerticalAlignment="Top"  Stretch="Fill"  Source="WPF.jpg"></Image>



            </ScrollViewer>

        </Button>



        <Button Margin="5"  Grid.Row="1" Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Center">

            <ScrollViewer Name="btnScroll2" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">



                <Image VerticalAlignment="Top"  Stretch="Fill"  Source="WPF.jpg"></Image>



            </ScrollViewer>

        </Button>

        <Button Margin="5" Grid.Row="1" Grid.Column="2" VerticalAlignment="Center" HorizontalAlignment="Center">

            <ScrollViewer Name="btnScroll3" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">



                <Image VerticalAlignment="Top"  Stretch="Fill"  Source="WPF.jpg"></Image>



            </ScrollViewer>

        </Button>



        <Button Margin="5" Grid.Row="1" Grid.Column="3" VerticalAlignment="Center" HorizontalAlignment="Center">

            <ScrollViewer Name="btnScroll4" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">



                <Image VerticalAlignment="Top"  Stretch="Fill"  Source="WPF.jpg"></Image>



            </ScrollViewer>

        </Button>

        

        <Button Margin="5" Grid.Row="1" Grid.Column="4" VerticalAlignment="Center" HorizontalAlignment="Center">

            <ScrollViewer Name="btnScroll5" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">



                <Image VerticalAlignment="Top"  Stretch="Fill"  Source="WPF.jpg"></Image>



            </ScrollViewer>

        </Button>

        <WrapPanel Margin="10" Grid.ColumnSpan="5" Grid.Row="3" Orientation="Horizontal">

            <Button Margin="1" Tag="LL" Click="ScrollButtons_Click">LineLeft()</Button>

            <Button Margin="1" Tag="LR" Click="ScrollButtons_Click">LineRight()</Button>

            <Button  Margin="1" Tag="PL" Click="ScrollButtons_Click">PageLeft()</Button>

            <Button Margin="1" Tag="PR" Click="ScrollButtons_Click">PageRight()</Button>

            <Button Margin="1" Tag="TL" Click="ScrollButtons_Click">ScrollToLeftEnd()</Button>

            <Button Margin="1" Tag="TR" Click="ScrollButtons_Click">ScrollToRightEnd()</Button>

            <Button  Margin="1" Tag="TOH" Click="ScrollButtons_Click">ScrollToHorizontalOffs  et(50)</Button>

        </WrapPanel>

    </Grid>

</Window>

در قطعه کد فوق، دکمه هایی برای کنترل متد ها برای اسکرول عمودی و نیز دکمه هایی برای کنترل متد ها در اسکرول افقی بر روی دو کنترل WrapPanel قرار گرفته اند. در این مثال نحوه به کارگیری کنترل های کانتینر جهت چیدمان عناصر WPF به خوبی مشخص است.

شکل زیر، نتیجه حاصل از اجرای کدهای فوق را نشان می دهد: