locked
Image in Application bar RRS feed

  • Question

  • Hello everyone,

    I am trying to put image in applicationbariconbutton. But i am getting failed. I set the background of application bar is to Gray. I set the foreground of my page is BLACK. I don't set foreground of application bar. Image is not displayed. So what change in application bar or page that image of application bar is shown. I tried size of  image of application bar is 48*48 & 56*56 both. & set the Build Action is content & copy to output directory is do not copy any one have solution.

           And one more thing this whole code is written in windows phone OS 7.1 so this image is shown But this code is written in windows phone OS 8.0 this image is not show. So what is wrong with the  windows phone OS 8.0.

    • Edited by Khant Nipun Saturday, February 16, 2013 11:34 AM
    Saturday, February 16, 2013 10:22 AM

Answers

  • There are two things to note:

    1. You are setting Mode="Minimized". I hope you are not seeing your icons even after making the ApplicationBar visibile by tapping on the elipses (...).
    2. You may not be setting the foreground of the ApplicationBar. But the .png should have its background set to 100% Transparent. That is your icons should be drawn with white on a transparent canvas. If you are using icons that were developed for WP and downloaded, then that would have been ensured.

    If any of the above is not the reason, then you may post a screenshot of what is displayed on the phone or emulator. There is nothing wrong with your XAML shown.


    ThanQ...

    • Marked as answer by Khant Nipun Friday, February 22, 2013 4:49 AM
    Tuesday, February 19, 2013 2:27 PM

All replies

  • Can you provide the XAML or the C# code, as the case may be, that you used to set the Image property of an ApplicationBarIconButton?


    ThanQ...

    Monday, February 18, 2013 3:35 PM
  • My XAML Code of Application Bar:

    <phone:PhoneApplicationPage.ApplicationBar>
            <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True" BackgroundColor="#333" Mode="Minimized">
                <shell:ApplicationBarIconButton x:Name="btnsearch" IsEnabled="True" Text="Search" IconUri="/Assets/AppBar/icon_01.png"/>
                <shell:ApplicationBarIconButton x:Name="Favourite" IconUri="/Assets/AppBar/icon_03.png" Text="Favourite"/>
                <shell:ApplicationBarIconButton x:Name="about"  Text="About us" IconUri="/Assets/AppBar/icon_02.png"/>
            </shell:ApplicationBar>
        </phone:PhoneApplicationPage.ApplicationBar>

    Tuesday, February 19, 2013 4:49 AM
  • There are two things to note:

    1. You are setting Mode="Minimized". I hope you are not seeing your icons even after making the ApplicationBar visibile by tapping on the elipses (...).
    2. You may not be setting the foreground of the ApplicationBar. But the .png should have its background set to 100% Transparent. That is your icons should be drawn with white on a transparent canvas. If you are using icons that were developed for WP and downloaded, then that would have been ensured.

    If any of the above is not the reason, then you may post a screenshot of what is displayed on the phone or emulator. There is nothing wrong with your XAML shown.


    ThanQ...

    • Marked as answer by Khant Nipun Friday, February 22, 2013 4:49 AM
    Tuesday, February 19, 2013 2:27 PM
  • Also worth checking that you have marked the png files are marked as Content

    Paul Marques - Lead developer @Bytemarq
    http://www.bytemarq.com
    #NoteboxPro - http://www.noteboxpro.co.uk
    If my post/reply answers your question then please mark it as Answered. Thank you.

    Wednesday, February 20, 2013 9:34 AM