FlipViewの上下移動のボタンをクリックしたときにTappedイベントが発生してしまうのをどうにかしたい

表題の通り、FlipViewのTappedイベントで画面遷移を行う処理を書いていたら、マウスのときにFlipViewに表示される上下移動のためのボタンをクリックしただけで画面遷移するようになって悩んでました。

同じ問題に悩んでる人が海外にもいたみたいで話題になってたのを見て解決しました。

• Building Metro style apps with C# or VB - FlipView tap event handler

上記ページのままですが、仕掛けとしては、FlipViewのVisualTree上にあるボタンをとってきてTappedイベントを仕掛けてe.Handled = trueしてやることでFlipViewまでイベントを上げないようにするという感じです。

コードにすると、こんなユーテリティを用意します。

publicstaticclass VisualTreeHelperExtensions
{
    publicstatic IEnumerable<T> GetDescendantsOfType<T>(FrameworkElement target)
        where T : DependencyObject
    {
        return GetDescendants(target).OfType<T>();
    }

    publicstatic IEnumerable<DependencyObject> GetDescendants(DependencyObject target)
    {
        for (int i = 0; i < VisualTreeHelper.GetChildrenCount(target); i++)
        {
            var r = VisualTreeHelper.GetChild(target, i);
            yieldreturn r;
            foreach (var c in GetDescendants(r))
            {
                yieldreturn c;
            }
        }
    }
}

そして、FlipViewのLoadedイベントで以下のようなコードを書きます。

privatevoid FlipView_Loaded(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
    var flipView = (FlipView)sender;
    var buttons = VisualTreeHelperExtensions.GetDescendantsOfType<Button>(flipView);
    foreach (var button in buttons)
    {
        button.Tapped += (_, args) => args.Handled = true;
    }
}

Behaviorにまとめてしまってもいいかもしれませんね。