How to Change Foreground Color of Image in View

Question

I have a horizontal StackPanel of an Image and TextBlock. What I need to accomplish is changing the foreground of both to a certain color. I can easily change the TextBlock with the Foreground property, but I am not sure how to do this with an Image. The image is just a basic app icon.

<StackPanel Orientation="Horizontal">
    <Image Source="/Assets/Icons/appbar.book.perspective.png" Width="50" Height="50" Margin="-8,0,-6,0"/>
    <TextBlock Text="BOOK" VerticalAlignment="Center" Foreground="Blue"/>
</StackPanel>

Answer 1

BitmapIcon is helpful for what you can use instead:

<BitmapIcon Width="20" Height="20" Foreground="Red" UriSource="ms-appx:///Assets/Resources/YourImage.png" />

That's my way...:)

Answer 2

Instead of having an ImageViewer and Textblock use Grid and Textblock. Give the background of grid as desired image source.Place a Textblock inside the grid.And assign the text to the TextBlock inside the grid. You can accomplish your task.

Answer 3

Do you want to change image background color then take image with transparent backround and set code as below

    <StackPanel Orientation="Horizontal">
        <Grid Background="Blue" Width="50" Height="50" Margin="-8,0,-6,0">
            <Image Source="/Assets/Icons/appbar.book.perspective.png" />
        </Grid>
        <TextBlock Text="BOOK" VerticalAlignment="Center" Foreground="Blue"/>
    </StackPanel>