Tentukan HubSection yang dipilih di Hub dengan dua HubSections

@Depechie telah mengarahkan Anda ke arah yang benar.. Anda dapat menggunakan Kontrol SelectionHub Saya membuat dan menambahkan acara ke dalamnya yang diaktifkan ketika indeks yang dipilih berubah

public event EventHandler SelectionChanged;

private static void OnSelectedIndexChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
    var hub = d as SelectionHub;
    if (hub == null) return;

    // do not try to set the section when the user is swiping
    if (hub._settingIndex) return;

    // No sections?!?
    if (hub.Sections.Count == 0) return;
    hub.OnSelectionChanged();
}

private void OnSelectionChanged()
{
    var section = Sections[SelectedIndex];
    ScrollToSection(section);
    var handler = SelectionChanged;
    if(handler != null)
    {
        handler(this, EventArgs.Empty);
    }
}

Anda dapat memperluas ini dengan menambahkan argumen peristiwa pilihan yang diubah ke dalamnya. Dengan ini Anda kemudian dapat berlangganan acara dalam kode Anda di belakang dan mengubah tombol bilah aplikasi berdasarkan indeks.

Setelah membaca Artikel Shawn disarankan oleh @Depechie. Saya mencoba menerapkan solusi yang sama di aplikasi saya untuk memperbarui konten AppBar dengan tombol khusus bagian.

Meskipun saya sudah berusaha, saya tidak dapat membuatnya berhasil jadi saya memodifikasi beberapa bagian solusinya. Saya menggunakan solusi perilaku dan hanya mengubah ScrollerOnViewChangedfungsi sebagai berikut. Ini mungkin bukan cara terbaik atau mungkin menyebabkan hasil yang tidak diharapkan dalam skenario yang berbeda, tetapi dalam kasus saya ini berhasil tanpa masalah.

    private void ScrollerOnViewChanged(object sender, ScrollViewerViewChangedEventArgs scrollViewerViewChangedEventArgs)
    {
        _settingIndex = true;
        ScrollViewer scrollViewer = sender as ScrollViewer;
        if (scrollViewer.HorizontalOffset > (scrollViewer.ViewportWidth / 2))
            SelectedIndex = 1;
        else
            SelectedIndex = 0;

        _settingIndex = false;
    }

Setelah itu saya menambahkan properti ke model tampilan saya untuk menyimpan indeks yang dipilih.

    private int _selectedIndex;

    public int SelectedIndex
    {
        get { return _selectedIndex; }
        set
        {
            SetProperty(ref this._selectedIndex, value);
        }
    }

Saya menggunakan perilaku di XAML untuk memperbarui SelectedIndex di ViewModel saya.

<Hub>
    <i:Interaction.Behaviors>
        <behaviors:HubSelectionBehavior SelectedIndex="{Binding SelectedIndex, Mode=TwoWay}" />
    </i:Interaction.Behaviors>

    <HubSection>...</HubSection>
    <HubSection>...</HubSection>
</Hub>

Hal terakhir yang harus dilakukan adalah mengatur visibilitas AppBarButtons menggunakan properti ini. SectionIndexToVisibilityConverter membandingkan SelectedIndex dengan ConverterParameter dan mengembalikan Visibility.Visible jika sama.

<CommandBar>
    <AppBarButton Label="Open" Icon="World" Command="{Binding OpenInBrowserCommand}" Visibility="{Binding SelectedIndex, Converter={StaticResource SectionIndexToVisibilityConverter}, ConverterParameter=0}"/>

    <AppBarButton Label="Previous" Icon="Back" Command="{Binding PreviousAnswerCommand}" Visibility="{Binding SelectedIndex, Converter={StaticResource SectionIndexToVisibilityConverter}, ConverterParameter=1}"/>
    <AppBarButton Label="Next" Icon="Forward" Command="{Binding NextAnswerCommand}" Visibility="{Binding SelectedIndex, Converter={StaticResource SectionIndexToVisibilityConverter}, ConverterParameter=1}"/>
</CommandBar>

Terima kasih @Depechie telah menyarankan artikelnya dan @Shawn telah menulis artikelnya :)