I have a commandbar in my UWP application, and I want to hide the bar and only display a ellipsis button when a user click on the hide button. In additional, I would like the commandbar to be opened/shown when the application is being launched.
This is what my command bar looks like,
And I am trying to get something like this, when I click on the last button:
Here is my code for the designer:
<CommandBar IsSticky="True"
Name="WebViewCommandBar"
Height="52"
Background="{StaticResource CitiKioskBackgroundBrush}"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom"
OverflowButtonVisibility="Collapsed">
<CommandBar.Transitions>
<TransitionCollection>
</TransitionCollection>
</CommandBar.Transitions>
<CommandBar.PrimaryCommands>
<AppBarButton Icon="Back"
IsCompact="True"
IsEnabled="{Binding CanGoBack,ElementName=webView}"
Name="WebViewBackButton"
Click="WebViewBackButton_Click" />
<AppBarButton Icon="Forward"
IsCompact="True"
IsEnabled="{Binding CanGoForward,ElementName=webView}"
Name="WebViewForwardButton"
Click="WebViewForwardButton_Click"
Margin="0 0 1450 0"/>
<AppBarButton
IsCompact="True"
Name="WebViewContactButton"
Click="WebViewContactButton_Click"
Foreground="White">
<AppBarButton.Icon>
<BitmapIcon UriSource="ms-appx:///Assets/Images/icon_smsLocation.png"/>
</AppBarButton.Icon>
</AppBarButton>
<AppBarButton Icon="Refresh"
IsCompact="True"
Name="WebViewRefreshButton"
Click="WebViewRefreshButton_Click"
Foreground="White"/>
<AppBarButton Icon="DockBottom"
IsCompact="True"
Name="WebViewHideNavigationButton"
Click="WebViewHideNavigationButton_Click"
Foreground="White"/>
</CommandBar.PrimaryCommands>
</CommandBar>
And for my button click event:
private void WebViewHideNavigationButton_Click(object sender, RoutedEventArgs e)
{
WebViewCommandBar.IsOpen = false;
}
Set IsOpen = false
, ClosedDisplayMode = Minimal
and OverflowButtonVisibility = Visible
in your button click
event.
private void MinimalButton_Click(object sender, RoutedEventArgs e)
{
MyCommandBar.IsOpen = false;
MyCommandBar.ClosedDisplayMode = AppBarClosedDisplayMode.Minimal;
MyCommandBar.OverflowButtonVisibility = CommandBarOverflowButtonVisibility.Visible;
}
Set OverflowButtonVisibility = Collapsed
in Opening
event
private void MyCommandBar_Opening(object sender, object e)
{
MyCommandBar.OverflowButtonVisibility = CommandBarOverflowButtonVisibility.Collapsed;
}
Set ClosedDisplayMode = Compact
in Opened
event
private void MyCommandBar_Opened(object sender, object e)
{
MyCommandBar.ClosedDisplayMode = AppBarClosedDisplayMode.Compact;
}