Xamarin.Forms Scrollview

Stažení ukázky

ScrollView" data-linktype="relative-path">Xamarin.Forms ScrollView" title=" Xamarin.Forms ScrollView" data-linktype="relative-path"/>

ScrollView je rozložení, které umožňuje posouvání obsahu. Třída je odvozena z třídy a ve výchozím nastavení ScrollViewLayout posune svůj obsah svisle. Objekt ScrollView může mít pouze jednu podřízený objekt, i když to mohou být další rozložení.

ScrollView definuje následující vlastnosti:

• data-linktype="absolute-path">Content typu View představuje obsah, který se má zobrazit v ScrollView objektu .
• ContentSizetyp Size představuje velikost obsahu. Toto je vlastnost jen pro čtení.
• HorizontalScrollBarVisibility, typu Xamarin_Forms HorizontalScrollBarVisibility _ScrollView_HorizontalScrollBarVisibility" data-linktype="absolute-path">představuje, kdy je viditelný ScrollBarVisibility vodorovný posuvník.
• _ScrollView_Orientation" data-linktype="absolute-path">typu představuje směr posouvání OrientationScrollOrientationScrollView objektu . Výchozí hodnota této vlastnosti je Vertical .
• Xamarin_Forms _ScrollView_ScrollX" data-linktype="absolute-path">typu označuje aktuální ScrollXdouble pozici posunu X. Výchozí hodnota této vlastnosti jen pro čtení je 0.
• Xamarin_Forms _ScrollView_ScrollY" data-linktype="absolute-path">typu označuje aktuální pozici ScrollYdouble posunu Y. Výchozí hodnota této vlastnosti jen pro čtení je 0.
• VerticalScrollBarVisibility, typu Xamarin_Forms VerticalScrollBarVisibility _ScrollView_HorizontalScrollBarVisibility" data-linktype="absolute-path">představuje, kdy je viditelný ScrollBarVisibility svislý posuvník.

Tyto vlastnosti jsou zálohovány objekty s výjimkou vlastnosti BindableProperty Xamarin_Forms BindableProperty _ScrollView_Content" data-linktype="absolute-path">, což Content znamená, že mohou být cíle datových vazeb a stylu.

Vlastnost Xamarin_Forms _ScrollView_Content" data-linktype="absolute-path">je vlastnost třídy , a proto není nutné ji explicitně Content nastavovat z ContentPropertyScrollView XAML.

ScrollView jako kořenové rozložení

Objekt ScrollView může mít pouze jednu podřízený objekt, což mohou být další rozložení. Proto je běžné, že ScrollView má být kořenovým rozložením na stránce. Pokud chcete posouvat podřízený obsah, vypočítá rozdíl mezi výškou obsahu a ScrollView vlastní výškou. Tento rozdíl je množství, ve které ScrollView se může obsah posouvat.

Objekt StackLayout bude často podřízeným objektem ScrollView . V tomto scénáři způsobí, že bude tak vysoká jako ScrollViewStackLayout součet výšek svých dětí. Potom ScrollView může určit, jaké množství obsahu se může posouvat. Další informace o najdete v StackLayout tématu Xamarin.Forms StackLayout .

Následující příklad XAML má ScrollView jako kořenové rozložení na stránce:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:ScrollViewDemos"
             x:Class="ScrollViewDemos.Views.ColorListPage"
             Title="ScrollView demo">
    <ScrollView>
        <StackLayout BindableLayout.ItemsSource="{x:Static local:NamedColor.All}">
            <BindableLayout.ItemTemplate>
                <DataTemplate>
                    <StackLayout Orientation="Horizontal">
                        <BoxView Color="{Binding Color}"
                                 HeightRequest="32"
                                 WidthRequest="32"
                                 VerticalOptions="Center" />
                        <Label Text="{Binding FriendlyName}"
                               FontSize="24"
                               VerticalOptions="Center" />
                    </StackLayout>
                </DataTemplate>
            </BindableLayout.ItemTemplate>
        </StackLayout>
    </ScrollView>
</ContentPage>

V tomto příkladu má obsah nastavený na , který používá rozložení s možnou vazbami k zobrazení ScrollViewStackLayout polí Color definovaných pomocí Xamarin.Forms . Ve výchozím nastavení se ScrollView posune svisle, což odhalí více obsahu:

rozložením ScrollView

Ekvivalentní kód jazyka C# je:

public class ColorListPageCode : ContentPage
{
    public ColorListPageCode()
    {
        DataTemplate dataTemplate = new DataTemplate(() =>
        {
            BoxView boxView = new BoxView
            {
                HeightRequest = 32,
                WidthRequest = 32,
                VerticalOptions = LayoutOptions.Center
            };
            boxView.SetBinding(BoxView.ColorProperty, "Color");

            Label label = new Label
            {
                FontSize = 24,
                VerticalOptions = LayoutOptions.Center
            };
            label.SetBinding(Label.TextProperty, "FriendlyName");

            StackLayout horizontalStackLayout = new StackLayout
            {
                Orientation = StackOrientation.Horizontal,
                Children = { boxView, label }
            };
            return horizontalStackLayout;
        });

        StackLayout stackLayout = new StackLayout();
        BindableLayout.SetItemsSource(stackLayout, NamedColor.All);
        BindableLayout.SetItemTemplate(stackLayout, dataTemplate);

        ScrollView scrollView = new ScrollView { Content = stackLayout };

        Title = "ScrollView demo";
        Content = scrollView;
    }
}

Další informace o rozloženích s možností vazby najdete v tématu Bindable Layouts in Xamarin.Forms .

ScrollView jako podřízené rozložení

Objekt ScrollView může být podřízeným rozložením pro jiné nadřazené rozložení.

Objekt ScrollView bude často podřízeným objektem StackLayout . K výpočtu rozdílu mezi výškou obsahu a vlastní výškou vyžaduje určitou výšku, s rozdílem je množství, které může obsah ScrollView posouvat. ScrollView Pokud ScrollView je podřízený objekt StackLayout , neobdrží určitou výšku. hodnota chce být co nejkratší, což je buď výška obsahu, StackLayoutScrollView nebo ScrollView nula. Pro zpracování tohoto scénáře by VerticalOptions měla být vlastnost objektu ScrollView nastavena na FillAndExpand . To způsobí, že se všem dalšímu prostoru, které ostatní děti nepožaduje, poskytne a pak bude StackLayoutScrollView mít určitou ScrollView výšku.

Následující příklad XAML má ScrollView jako podřízené rozložení pro StackLayout :

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="ScrollViewDemos.Views.BlackCatPage"
             Title="ScrollView as a child layout demo">
    <StackLayout Margin="20">
        <Label Text="THE BLACK CAT by Edgar Allan Poe"
               FontSize="Medium"
               FontAttributes="Bold"
               HorizontalOptions="Center" />
        <ScrollView VerticalOptions="FillAndExpand">
            <StackLayout>
                <Label Text="FOR the most wild, yet most homely narrative which I am about to pen, I neither expect nor solicit belief. Mad indeed would I be to expect it, in a case where my very senses reject their own evidence. Yet, mad am I not -- and very surely do I not dream. But to-morrow I die, and to-day I would unburthen my soul. My immediate purpose is to place before the world, plainly, succinctly, and without comment, a series of mere household events. In their consequences, these events have terrified -- have tortured -- have destroyed me. Yet I will not attempt to expound them. To me, they have presented little but Horror -- to many they will seem less terrible than barroques. Hereafter, perhaps, some intellect may be found which will reduce my phantasm to the common-place -- some intellect more calm, more logical, and far less excitable than my own, which will perceive, in the circumstances I detail with awe, nothing more than an ordinary succession of very natural causes and effects." />
                <!-- More Label objects go here -->
            </StackLayout>
        </ScrollView>
    </StackLayout>
</ContentPage>

V tomto příkladu jsou dva StackLayout objekty. První je StackLayout objekt kořenového rozložení, který má Label objekt a jako své ScrollView děti. objekt ScrollView má jako svůj obsah , s StackLayoutStackLayout objektem obsahujícím více Label objektů. Toto uspořádání zajistí, že první objekt bude vždy na obrazovce, zatímco text zobrazený ostatními objekty se LabelLabel může posouvat:

Ekvivalentní kód jazyka C# je:

public class BlackCatPageCS : ContentPage
{
    public BlackCatPageCS()
    {
        Label titleLabel = new Label
        {
            Text = "THE BLACK CAT by Edgar Allan Poe",
            // More properties set here to define the Label appearance
        };

        ScrollView scrollView = new ScrollView
        {
            VerticalOptions = LayoutOptions.FillAndExpand,
            Content = new StackLayout
            {
                Children =
                {
                    new Label
                    {
                        Text = "FOR the most wild, yet most homely narrative which I am about to pen, I neither expect nor solicit belief. Mad indeed would I be to expect it, in a case where my very senses reject their own evidence. Yet, mad am I not -- and very surely do I not dream. But to-morrow I die, and to-day I would unburthen my soul. My immediate purpose is to place before the world, plainly, succinctly, and without comment, a series of mere household events. In their consequences, these events have terrified -- have tortured -- have destroyed me. Yet I will not attempt to expound them. To me, they have presented little but Horror -- to many they will seem less terrible than barroques. Hereafter, perhaps, some intellect may be found which will reduce my phantasm to the common-place -- some intellect more calm, more logical, and far less excitable than my own, which will perceive, in the circumstances I detail with awe, nothing more than an ordinary succession of very natural causes and effects.",
                    },
                    // More Label objects go here
                }
            }
        };

        Title = "ScrollView as a child layout demo";
        Content = new StackLayout
        {
            Margin = new Thickness(20),
            Children = { titleLabel, scrollView }
        };
    }
}

Orientace

ScrollViewmá Xamarin_Forms ScrollView _ScrollView_Orientation data-linktype="absolute-path">, která představuje směr posouvání Orientation objektu ScrollView . Tato vlastnost je typu ScrollOrientation , který definuje následující členy:

• Vertical označuje, že ScrollView se posune svisle. Tento člen je výchozí hodnotou Xamarin_Forms _ScrollView_Orientation" data-linktype="absolute-path">Orientation vlastnost.
• Horizontal označuje, že ScrollView se bude posunovat vodorovně.
• Both označuje, že ScrollView se bude posunovat vodorovně a svisle.
• Neither označuje, ScrollView že se nebude posouvat.

Rozpoznání posouvání

ScrollView definuje Scrolled událost, která se aktivuje, aby indikuje, že došlo k posouvání. Objekt, ScrolledEventArgs který doprovází Scrolled událost má vlastnosti a , oba typu ScrollXScrollYdouble .

Následující příklad XAML ukazuje , ScrollView který nastaví obslužnou rutinu události pro Scrolled událost:

<ScrollView Scrolled="OnScrollViewScrolled">
		...
</ScrollView>

Ekvivalentní kód jazyka C# je:

ScrollView scrollView = new ScrollView();
scrollView.Scrolled += OnScrollViewScrolled;

V tomto příkladu se OnScrollViewScrolled obslužná rutina události spustí při Scrolled spuštění události:

void OnScrollViewScrolled(object sender, ScrolledEventArgs e)
{
    Console.WriteLine($"ScrollX: {e.ScrollX}, ScrollY: {e.ScrollY}");
}

V tomto příkladu je výstupem obslužné rutiny události OnScrollViewScrolled hodnota ScrolledEventArgs objektu, který událost doprovází.

Posouvání prostřednictvím kódu programu

ScrollView definuje dvě ScrollToAsync metody, které asynchronně posouvání ScrollView . Jedno z přetížení se posune na zadanou pozici v objektu , zatímco druhé ScrollView posune zadaný prvek do zobrazení. Obě přetížení mají další argument, který lze použít k určení, zda se má posouvání animace.

Posunutí pozice do zobrazení

Pozici v rámci ScrollView lze posunout pomocí metody ScrollToAsync , která přijímá doublexy argumenty a . Svislý objekt s názvem ukazuje následující příklad, jak se v horní části objektu posunout na ScrollViewscrollView 150 jednotek nezávislých na ScrollView zařízení:

await scrollView.ScrollToAsync(0, 150, true);

Třetím argumentem je argument , který určuje, jestli se při posouvání prostřednictvím kódu programu zobrazí animace ScrollToAsyncanimated posouvání. ScrollView

Posunutí prvku do zobrazení

Prvek v objektu ScrollView lze posunout do zobrazení pomocí ScrollToAsync metody , která přijímá ElementScrollToPosition argumenty a . Svisle s názvem a s názvem ukazuje následující příklad, jak ScrollViewscrollViewLabellabel posunout prvek do zobrazení:

await scrollView.ScrollToAsync(label, ScrollToPosition.End, true);

Třetím argumentem je argument , který určuje, jestli se při posouvání prostřednictvím kódu programu zobrazí animace ScrollToAsyncanimated posouvání. ScrollView

Při posouvání prvku do zobrazení je možné nastavit přesnou pozici prvku po dokončení posouvání pomocí druhého argumentu positionScrollToAsync metody . Tento argument přijímá člen ScrollToPosition výčtu:

• MakeVisible označuje, že prvek by měl být posunut, dokud není viditelný v ScrollView objektu .
• Start označuje, že prvek by měl být posunut na začátek ScrollView objektu .
• Center označuje, že by měl být element posunut do středu ScrollView .
• End označuje, že by měl být element posunut na konec ScrollView .

Viditelnost posuvníku

ScrollView definuje HorizontalScrollBarVisibility a VerticalScrollBarVisibility vlastnosti, které jsou zajištěny vazbami vlastností. Tyto vlastnosti získají nebo nastavují Xamarin_Forms _ScrollView_HorizontalScrollBarVisibility "data-LINKTYPE =" absolutní cesta ">ScrollBarVisibility hodnota výčtu, která představuje, zda je zobrazen vodorovný nebo svislý posuvník. ScrollBarVisibilityVýčet definuje následující členy:

• Default označuje výchozí chování posuvníku pro platformu a je výchozí hodnotou HorizontalScrollBarVisibilityVerticalScrollBarVisibility vlastností a.
• Always označuje, že se budou zobrazovat posuvníky, a to i v případě, že se obsah vejde do zobrazení.
• Never označuje, že posuvníky nebudou viditelné, i když se obsah nevejde do zobrazení.

Související odkazy

• Ukázky ScrollView (ukázka)
• Xamarin.Forms StackLayout
• Bindable Layouts in Xamarin.Forms