Animate AppBarButtons like the E-mail application in Windows 8.1 - windows-store-apps

Question

The E-mail application in Windows 8.1 has a nice animation in the AppBar. When a button is not enabled the button disappears and the buttons that are left moves to fill empty space. This happens if several E-mails are selected in the application.
What should I do to add this in my application?
Edit: Below is the animation I’m talking about. The second button from the right is no longer available so it shrinks and then the other buttons is moved to the empty space.

Answer 1

The AppBar control uses StackPanel control for the grid in it. So when a button added, it automatically repositions all the other buttons. Well, even though I don't know how the E-Mail app does the animation you posted, I definitely can show you the way for it. Hope it does give an idea.
Here is the XAML of the AppBar:
<Page.BottomAppBar >
<AppBar IsSticky="True" Name="AppBar" IsOpen="True" FlowDirection="RightToLeft">
<StackPanel Name="bottomAppBar" Orientation="Horizontal" >
<AppBarButton Name="btnOptions" Icon="Setting" Width="100" Label="Options" />
<AppBarButton Name="btnHelp" Icon="Help" Width="100" Label="Help" />
<AppBarButton Name="btnExit" Icon="Import" Width="100" Label="Exit" />
</StackPanel>
</AppBar>
</Page.BottomAppBar>
Assuming you have a button that hides the button you don't want. Let's say btnHelp in this case.
The button should be like this:
<Button Content="Button" HorizontalAlignment="Left" Margin="170,79,0,0"
VerticalAlignment="Top" Height="66" Width="131" Click="Hide_Help_Click"/>
So the click event should be like this
private async void Hide_Help_Click(object sender, RoutedEventArgs e)
{
while (true)
{
await Task.Delay(1);
if( btn.Width > 0 )
{
btnHelp.Width = btnHelp.Width - 2;
}
else
{
break;
}
}
btnHelp.Visibility = Visibility.Collapsed;
}
This way, it's like the exit button goes out on top of the Help button, so maybe it's a little ugly, but this works like what you need. So a little change and maybe some animation you add, it should exactly do the same what you have posted.