应用程序栏按钮与WP中的文本

Question

I have application bar with some buttons and menu items when user clicks '...'. Anyway, I realized that meaning of some icons can be hard to understand at first sight.

Is it any way to display icons with text below them? Of course they are visible when user clicks '...' but also with menu items and I don't want it.

Anyone did that?

Answer 1

You can simply use shell:ApplicationBar and set Text property

<shell:ApplicationBar x:Name="dialogsPageAppbar">
        <shell:ApplicationBarIconButton  IconUri="/images/Icons/appbar.add.rest.png" Text="create"/>
        <shell:ApplicationBarIconButton  IconUri="/images/Icons/appbar.refresh.rest.png" Text="refresh"/>
        <shell:ApplicationBarIconButton  IconUri="/images/Icons/appbar.feature.search.rest.png" Text="search"/>
        <shell:ApplicationBar.MenuItems>
            <shell:ApplicationBarMenuItem Text="settings" />
        </shell:ApplicationBar.MenuItems>
    </shell:ApplicationBar>

Answer 2

You can't do it with a standard ApplicationBar . As I said the default dehaviour is to hide the text.

Also WP7 user has a special user-expirience, so if he can't understand the meaning of your icon, he will press "..." to read the text.

But you can emulate an appbar in some scenarious:

<Border Background="{some gray color from phone resources}">
 <StackPannel Orientation="Horisontal">
  <Button Content={Binding TextB} Command="{Binging CommandA}" 
                          Style="{your appbar-like template}"/>
  <Button Content={Binding TextB}  Command="{Binging CommandB}" 
                          Style="{your appbar-like template}"/>
</StackPannel>
</Border>

Put it on the bottom of your page. But be ready to spend lot of time to emulate standard appbar behaviour. I don't think it is a good idea.