ScrollViewコントロールを使用すると、画面からはみ出してしまうようなデザインでも、スクロールして表示することができます。
はみ出してしまいそうなデザインは<ScrollView>から</ScrollView>の内側に配置します。
また、ScrollToAsyncというメソッドを使用すると、任意の位置へスクロールさせることができます。
ScrollToAsyncのメソッドには以下のようなオーバーロードがあります。
書式1
scrollView.ScrollToAsync(スクロールさせたい位置にあるコントロール, スクロール先のコントロールの位置, アニメーションをするかどうか);
書式2
scrollView.ScrollToAsync(横方向のスクロール位置, 縦方向のスクロール位置, アニメーションをするかどうか)
以下にScrollViewの使用例を示します。
この例では縦方向に「ラベル」「ボックス」「ラベル」「ボックス」「ラベル」を配置しています。上部には3つのボタンが配置してあり、これらのボタンを押すことでコード内で指定した位置へスクロールをします。
<StackLayout Margin="10,30,10,10"> <StackLayout Orientation="Horizontal"> <Button x:Name="btnMoveMid" Text="Middleへ移動 "/> <Button x:Name="btnMove400" Text="400の位置へ移動 " /> <Button x:Name="btnMoveBottom" Text="Bottomへ移動 " /> </StackLayout> <ScrollView x:Name="scrollView"> <StackLayout> <Label Text="Top" /> <BoxView HeightRequest="600" BackgroundColor="Blue" /> <Label x:Name="lblMiddle" Text="Middle" /> <BoxView HeightRequest="600" BackgroundColor="Blue" /> <Label x:Name="lblBottom" Text="Bottom" /> </StackLayout> </ScrollView> </StackLayout>
public MainPage() { InitializeComponent(); // [Middleへ移動]ボタンタップ時の処理 btnMoveMid.Clicked += (sender, e) => { scrollView.ScrollToAsync(lblMiddle, ScrollToPosition.Start, true); }; // [400の位置へ移動]ボタンタップ時の処理 btnMove400.Clicked += (sender, e) => { scrollView.ScrollToAsync(0, 400, true); }; // [Bottomへ移動]ボタンタップ時の処理 btnMoveBottom.Clicked += (sender, e) => { scrollView.ScrollToAsync(lblBottom, ScrollToPosition.Start, true); }; }
Please follow and like us:
コメント