眠るシーラカンスと水底のプログラマー

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

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

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

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

導入

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

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

　続いてｘｍｌnsの追加

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を設定しようとエラーになった・・・

Tweet