WP7 Application Bar Icons not showing on Simulator (but works in Blend)

c# vb.net xaml windows-phone-7 windows-phone-8

13,394

Solution 1

Make sure that the image properties 'build to action' is Content.

Solution 2

Are your icons:

Transparent with a white foreground
The right size (48x48)
PNGs

? If so, that should be fine. What does your XAML look like?

13,394

Author by

Thomas Joulin

I'm an iOS/Windows Phone developer

Updated on July 21, 2022

Comments

Thomas Joulin almost 2 years

It is most probably a stupid mistake, but can anyone tell me why my icons are showing in Blend, but not in the simulator (and not in VS10, but that's not really an issue)?

WP7 Application Bar Icons. Blend (left), Simulator (right)

Edit - Here is my XAML :

    <phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
        <shell:ApplicationBarIconButton IconUri="/Images/share.png" Text="Partager"/>
        <shell:ApplicationBarIconButton IconUri="/Images/appbar.edit.rest.png" Text="Note"/>
        <shell:ApplicationBarIconButton IconUri="/Images/appbar.feature.camera.rest.png" Text="Photos/Vidéos"/>
        <shell:ApplicationBarIconButton IconUri="/Images/calendar.png" Text="Rendez-vous"/>
        <shell:ApplicationBar.MenuItems> 
            <shell:ApplicationBarMenuItem Text="MenuItem 1"/>
            <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
        </shell:ApplicationBar.MenuItems>
    </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

My four .png files are 48x48, transparent .png with black foreground, since the appbar.*.rest.png files where like that and found in the Microsoft icons folder

Thomas Joulin over 13 years

I updated my question, the foreground is black, but otherwise everything is like you said. I found two of these icons in Program Files\Microsoft SDKs\Windows Phone\v7.0\Icons, so I don't think the black foreground is the issue...
Jon Skeet over 13 years

@Thomas: Well, the documentation specifically says that the foreground should be white IIRC, so it's at least worth trying that.
Amr H. Abd Elmajeed over 13 years

i was just about to say that, this is the answer to most of the "i can't see the app bar icon" questions
Thomas Joulin over 13 years

My problem was solved using the build action, but indeed, I should have put a white foreground image then. But when a button is highlighted (clicked), it becomes white and then I would need to change the image, right ? I'm supposed to do that programmatically ?
Jon Skeet over 13 years

@Thomas: No, you don't need to do anything - the system handles things like rotating it etc.
Thomas Joulin over 13 years

Yep, I so that, and changing the color with the theme. But I mean, when the user's finger taps the button, and hold it there, the background changes to white, and the icon doesn't change colour
Jon Skeet over 13 years

@Thomas: The icon foreground should change to black (i.e. it's a white filled in circle with your icon as black on top). That's certainly what happens with my app, and I didn't need to do anything for that to happen.
Thomas Joulin over 13 years

Well, I created an empty project, uncommented the tabbar code and set a system icon in Blender, and it's not working. You can dl the archive here dl.dropbox.com/u/3475545/AppBar.zip or see my solution here : db.tt/gSenDVE
Jon Skeet over 13 years

@Thomas: I'll see if I can have a look tonight.
Ciaran Gallagher about 11 years

I tried this but it didn't solve the problem, would you have any other suggestions? (I rebuilt and cleaned the solution before trying)