0

How can I add different CommandBars (AppBars) to an Hub element in Windows Phone 8.1 app. I want to have a different CommandBar for each Hub Section, but I can't declare the CommandBar in the Hub Section. So I can only use one CommandBar in the Hub.

Romasz
  • 29,662
  • 13
  • 79
  • 154
user2025830
  • 872
  • 2
  • 17
  • 37

1 Answers1

1

You can create more than 4 AppBarButton and make it invisible then you change Visibility Property for each per Hub Section. Same way for menu button.

Sample:

<Page.BottomAppBar>
    <CommandBar>
        <CommandBar.PrimaryCommands>
            <AppBarButton x:Uid="Quick" Name="QuickAppBarButton" Label="quick" Icon="Pin" Click="AppBarButton_Click"/>
            <AppBarButton x:Uid="Quick" Name="AddAppBarButton" Label="add" Icon="Add" Click="AppBarButton_Click"/>
            <AppBarButton x:Uid="Quick"
                          Name="CalcAppBarButton"
                          Label="calculator"
                          Icon="Calculator"
                          Click="AppBarButton_Click" />
        </CommandBar.PrimaryCommands>
        <CommandBar.SecondaryCommands>
            <AppBarButton x:Uid="Accounts" Name="AccountsSecondaryButton" Label="accounts" Click="AccountsSecondaryButton_Click"/>
            <AppBarButton x:Uid="CurrencyMenu" Name="CurrencySecondaryButton" Label="currency" Click="CurrencySecondaryButton_Click"/>
            <AppBarButton x:Uid="Categories" Label="categories"/>
            <AppBarButton x:Uid="Settings" Label="settings" Name="SettingsSecondaryButton" Click="SettingsSecondaryButton_Click"/>
            <AppBarButton x:Uid="Tutorials" Label="tutorials"/>
            <AppBarButton x:Uid="About" Label="about"/>
        </CommandBar.SecondaryCommands>
    </CommandBar>
</Page.BottomAppBar>

And C# file (You must set name for every Section):

private void CoinsHub_SectionsInViewChanged(object sender, SectionsInViewChangedEventArgs e)
{
    if(CoinsHub.SectionsInView[0] == TransactionsHubSection)
    {
        QuickAppBarButton.Visibility = Visibility.Collapsed;
        AddAppBarButton.Visibility = Visibility.Visible;
        CalcAppBarButton.Visibility = Visibility.Collapsed;
    }
    else if (CoinsHub.SectionsInView[0] == OverviewHubSection)
    {
        QuickAppBarButton.Visibility = Visibility.Visible;
        AddAppBarButton.Visibility = Visibility.Collapsed;
        CalcAppBarButton.Visibility = Visibility.Collapsed;
    }
    else
    {
        QuickAppBarButton.Visibility = Visibility.Collapsed;
        AddAppBarButton.Visibility = Visibility.Visible;
        CalcAppBarButton.Visibility = Visibility.Visible;
    }
}
Chubosaurus Software
  • 8,133
  • 2
  • 20
  • 26
Bolt Delta
  • 215
  • 1
  • 3
  • 10
  • ok thats a good idea, but on which event can I do this. there is a sectioninviewchanged event, but if i try this i get it just the first time the hub is loaded. if i change the section i don't get an event – user2025830 May 22 '14 at 13:42
  • Add real situation in my app ;) – Bolt Delta May 22 '14 at 13:53
  • that works if you have more than 2 hubsections, but in my case i only have two hubsections and don't get the sectionsinviewchanged event. do you know why? – user2025830 May 23 '14 at 17:16