Windows Phone 7 Does Not Show Icons Inside ApplicationBar Buttons

Question

I am developing my first application for Windows Phone 7, and I need to add an application bar with icons.

I mentioned this "How To": http://msdn.microsoft.com/en-us/library/ff431786(VS.92).aspx ("Creating an Application Bar in XAML")

But when I start the emulator, I see no signs: I see a black circle with an X in the center and the ApplicationBarIconButton_Click event is correctly raised.

I am using the icon from the WP7AppBarIcons.zip samples, and my code is below:

<phone:PhoneApplicationPage.ApplicationBar> <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True"> <shell:ApplicationBarIconButton IconUri="/images/appbar.transport.play.rest.png" Text="Home" Click="ApplicationBarIconButton_Click"/> <shell:ApplicationBarIconButton IconUri="/images/appbar.favs.rest.png" Text="Preferiti" Click="ApplicationBarIconButton_Click"/> <shell:ApplicationBarIconButton IconUri="/images/appbar.questionmark.rest.png" Text="About" Click="ApplicationBarIconButton_Click"/> <shell:ApplicationBar.MenuItems> <shell:ApplicationBarMenuItem Text="MenuItem 1"/> <shell:ApplicationBarMenuItem Text="MenuItem 2"/> </shell:ApplicationBar.MenuItems> </shell:ApplicationBar> </phone:PhoneApplicationPage.ApplicationBar> 

Obviously, I have a root folder named "images" containing the mentioned 48 x 48 icons.

Thanks a lot!

Answer 1

Whether the Build Action image is set to "Content" and not "Resource", as this is a common mistake - I did it a couple of times myself. They should be like this because the ApplicationBar is not a Silverlight control, and the images must be set to Content.

Answer 2

Are your PNGs definitely 2 color, only white on a transparent background? IIRC they will not boot if it is not. You might want to grab PNG from a sample project that works, just to check if this file content is causing the problem or something else.

Also check the case of “images” - all samples use “Images” instead of “images”; probably not that wrong, but worth checking out :)

Answer 3

you can right-click on the project, then> Add> Existing Element, then add your .png image that meets the criteria that Mr. John Skeet mentioned in the answer above.

after that you should find the image that appears in the solution explorer, right-click on the image from the solution explorer> Properties, then change the "Create Action" property to "Content"

hope it works

world