UWP Toolbar autohide "More" (...) button RRS feed

  • Question

  • User395271 posted

    I need help with taming CommandBar in UWP application.

    Desired behaviour is like this:

    1. If there is no items, ToolBar is empty (exactly like it works now)



    1. If there is no Secondary buttons, only primary buttons is shown (now it still shows "more" button that do nothing)



    1. If there is both Primary and Secondary buttons, show Primary and move secondary into "More" button (working now as planned)

    <ContentPage.ToolbarItems> <ToolbarItem Text="" IconImageSource="button.png" Clicked="DoSomePrimaryStuff" Order="Primary"/> <ToolbarItem Text="Secondary button" IconImageSource="button2.png" Clicked="DoSomeSecondaryStuff" Order="Secondary"/> </ContentPage.ToolbarItems>

    So the problem is only with second situation. Is there any way to autohide "more" button if it's empty?

    And if there isn't, please help or advise on how to attach to some event or property so when the bar is appearing, I could manually find that button inside CommandBar and hide/show it if necessary.

    Wednesday, July 22, 2020 1:02 PM

All replies

  • User369979 posted

    There isn't a control on UWP to present the navigationbar. It is customized by Forms: So we can't dynamically adjust its appearance on UWP. However, we could achieve it by adding this key in the App on UWP: <Application x:Class="NavigationSample.UWP.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:NavigationSample.UWP" RequestedTheme="Light"> <Application.Resources> <x:Double x:Key="AppBarExpandButtonThemeWidth">0</x:Double> </Application.Resources> </Application>

    Thursday, July 23, 2020 7:38 AM
  • User395271 posted

    @LandLu said: However, we could achieve it by adding this key in the App on UWP: <x:Double x:Key="AppBarExpandButtonThemeWidth">0</x:Double>

    Can i change it from code behind dynamically before opening certain pages?

    Thursday, July 23, 2020 10:16 AM
  • User89714 posted

    @LandLu said: AppBarExpandButtonThemeWidth

    There is also the scenario on UWP where there are only primary toolbar items, but where the screen width is large enough for all of the primary toolbar items to be displayed without overflowing into the "more" dropdown menu. In that case, it would be good if the ellipsis/more button did not appear (but if items did overflow into the dropdown menu that the button does appear).

    Note that I don't need the button to show the text on the primary toolbar items (by default, it serves two functions - showing the text, and performing the dropdown) as I use the following in my app.xaml on UWP: <Style TargetType="uwp:FormsCommandBar"> <Setter Property="DefaultLabelPosition" Value="Right" /> </Style>

    Any idea how to make the button only appear if the dropdown would contain something, whether overflowed primary toolbar items, or secondary toolbar items?

    Thursday, July 23, 2020 10:17 AM