CODEWITHSUNDEEP
windows-8microsoft-metro
AmbilyKK
AmbilyKK

Reputation: 172

Windows Store App – App Bar Icon change on Click Event

I have a Windows Store App with App Bar Icons. I am using a global App Bar for navigating across Section pages. App Bar is defined using Custom Images and it look like

<AppBar>
        <StackPanel Orientation="Horizontal" x:Name="topAppBar">
            <Button x:Name="homeAppB"  Click="homeAppB_Click" >
                <Button.Content>
                    <StackPanel Orientation="Vertical">
                        <Image Source="Assets/home_default.png" Width="40"/>
                        <TextBlock Text="Home"/>
                    </StackPanel>
                </Button.Content>
            </Button>
     </StackPanel>
    </AppBar>

Once I click on the Icon, I need to change the image to home_onClick.png; this is to indicate which App Bar is selected to land on the Current Page.

Currently this is implemented using the Code behind code like

homeB.Content = Utilities.AppBarIconChange(new Uri("ms-appx:/Assets/home_onClick.png"), "Home");
------------------------------------------------------

public static StackPanel AppBarIconChange(Uri imageUrl, string labelMsg)
    {
        StackPanel panel = new StackPanel();
        Image img = new Image();
        img.Source = new BitmapImage(imageUrl);
        TextBlock txt = new TextBlock();
        txt.Text = labelMsg;
        panel.Children.Add(img);
        panel.Children.Add(txt);

        return panel;
    }

Is there any way where I can achieve this behavior in XAML itself?

Upvotes: 0

Views: 715

Answers (1)

Igor Kulman
Igor Kulman

Reputation: 16361

I do no think you can do it entirely in XAML, some code in the homeAppB_Click event handler will always be needed.

A more elegant way would be to the the Images' source property bound to a property on your ViewModel that holds the URL and in the homeAppB_Click event handler just changing this property.

Upvotes: 1

Related Questions