Windows Phone Toolkit 紹介 その10 LockablePivot

月曜日 , 12, 3月 2012 Leave a comment

 標準のPivotなどを使うとページ内のコントロールをフリックできないなどの不便を感じることがあります。

 今回紹介するLockablePivotはロックすることでフリックしてもページ遷移しないPivotを作成することが可能にするコントロールです。

通常のPivotのようだけど、ロックするボタンを押すと

スライドしないように固定できる

 

 

導入

 

 HubTileを利用するには「Silverlight for Windows Phone Toolkit」が必要です。

 インストーラー形式でもNuGetでも導入可能です。(インストール方法解説はこちら)

 

 

 続いてxmlnsの追加

xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

 これで導入準備完了。

 

 xamlコードは以下のような感じ。ほぼ通常のPivotと同じです。

        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <toolkit:LockablePivot x:Name="pivot" >
                <controls:PivotItem Header="Page1">
                    <TextBlock Text="ページ1です"></TextBlock>
                </controls:PivotItem>

                <controls:PivotItem Header="Page2">
                    <TextBlock Text="ページ2です"></TextBlock>
                </controls:PivotItem>

                <controls:PivotItem Header="Page3">
                    <TextBlock Text="ページ3です"></TextBlock>
                </controls:PivotItem>
            </toolkit:LockablePivot>

            <Button Content="ロックする" Height="72" HorizontalAlignment="Left" Margin="139,544,0,0" Name="button1" VerticalAlignment="Top" Width="226" Click="button1_Click" />
        </Grid>

 続いてボタンを押してロックする処理を実装。

        private void button1_Click(object sender, RoutedEventArgs e)
        {
            if (this.pivot.IsLocked == false)
            {
                this.pivot.IsLocked = true;

                var button = sender as Button;
                button.Content = "解除する";
            }
            else
            {
                this.pivot.IsLocked = false;

                var button = sender as Button;
                button.Content = "ロックする";
            }
        }

 XAML上でIsLockedを設定しようとエラーになった・・・

 


Please give us your valuable comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください