how to change the background image of a grid or the image of a picturebox

Kairo Martins 21

I already tested this method.

My.settings.back = openfiledialg.Filename

Our

My.settings.back = New BitmapImage(New Uri(openfiledialg.filename))

'Click event

Picturebox.source = New BitmapImage(New Uri(my.settings.back))

grid.backgroud = New imageBush(New BitmapImage(New Uri(my.settings.back)))

2 answers

DaisyTian-1203 11,616 Reputation points

2021-01-18T05:47:33.5+00:00
Set grid's background image in xaml:

<Grid Name="myGird" Width="800" Height="225"> <Grid.Background> <ImageBrush ImageSource="/1.jpg"></ImageBrush> </Grid.Background> </Grid>

Set grid's background image in cs:

ImageBrush b = new ImageBrush(); b.ImageSource = new BitmapImage(new Uri("pack://application:,,,/1.jpg")); myGird.Background = b;

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.
Please sign in to rate this answer.

0 comments No comments
Sign in to comment

Kairo Martins 21

the code below
presents the error without any code referring to the System.NullReferenceException

1
dim w as mainwindow

Private Sub openbtn_Click(sender As Object, e As RoutedEventArgs) Handles openbtn.Click

    Dim dlg As Microsoft.Win32.OpenFileDialog = New Microsoft.Win32.OpenFileDialog()

    Dim result As Nullable(Of Boolean) = dlg.ShowDialog()

    If result = True Then
        My.Settings.Background = dlg.FileName
        My.settings.save()
        w.bgv()
    End If
End Sub

Public Sub bgv()

        Dim img = New ImageBrush
        Dim exePath As String = My.Application.Info.DirectoryPath
        img.ImageSource = New BitmapImage(New Uri(My.Settings.Background))


        bacground.Background = img

XML MAIN WINDOW

                </Rectangle.Effect>
            </Rectangle>
            <Image Height="Auto" Margin="15" VerticalAlignment="Stretch" Width="Auto" Source="globe_100px.png">
                <Image.Effect>
                    <DropShadowEffect Opacity="0.2"/>
                </Image.Effect>
            </Image>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="true">
                <Setter TargetName="bac" Property="Fill">
                    <Setter.Value>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#f2f2f2" Offset="0"/>
                            <GradientStop Color="#b3b3b3" Offset="1"/>
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
                <Setter TargetName="bac" Property="Stroke">
                    <Setter.Value>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#f2f2f2" Offset="0"/>
                            <GradientStop Color="#b3b3b3" Offset="1"/>
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
            </Trigger>


        </ControlTemplate.Triggers>

    </ControlTemplate>
</Window.Resources>
<Grid x:Name="bacground">
    <Grid.Background>
        <ImageBrush ImageSource="tvos_back.jpg"/>
    </Grid.Background>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition Width="0*"/>
    </Grid.ColumnDefinitions>

    <Grid Margin="0,0,-3,-3" Background="#99FFFFFF" Grid.ColumnSpan="2" Height="100" VerticalAlignment="Bottom">
        <Grid.Effect>
            <DropShadowEffect Direction="400" Opacity="0.5"/>
        </Grid.Effect>
        <Button x:Name="google" Content="Button" HorizontalAlignment="Left" Margin="10,15,0,0" VerticalAlignment="Top" Width="65" Height="65" Template="{DynamicResource Buttont}"/>
        <Button x:Name="youtube" Content="Button" HorizontalAlignment="Left" Margin="90,15,0,0" VerticalAlignment="Top" Width="65" Height="65" Template="{DynamicResource ButtonControlTemplate1}">
            <Button.Resources>
                <ControlTemplate x:Key="ButtonControlTemplate1" TargetType="{x:Type Button}">
                    <Grid>
                        <Rectangle x:Name="bac" Fill="#FFF4F4F5" HorizontalAlignment="Stretch" Height="Auto" Stroke="#FFF4F4F5" VerticalAlignment="Stretch" Width="Auto" RadiusY="19.5" RadiusX="19.5">
                            <Rectangle.Effect>
                                <DropShadowEffect Opacity="0.3"/>

                            </Rectangle.Effect>
                        </Rectangle>
                        <Image Height="Auto" Margin="15" VerticalAlignment="Stretch" Width="Auto" Source="play_button_100px.png">
                            <Image.Effect>
                                <DropShadowEffect Opacity="0.2"/>
                            </Image.Effect>
                        </Image>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter TargetName="bac" Property="Fill">
                                <Setter.Value>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#f2f2f2" Offset="0"/>
                                        <GradientStop Color="#b3b3b3" Offset="1"/>
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                            <Setter TargetName="bac" Property="Stroke">
                                <Setter.Value>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#f2f2f2" Offset="0"/>
                                        <GradientStop Color="#b3b3b3" Offset="1"/>
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                        </Trigger>


                    </ControlTemplate.Triggers>

                </ControlTemplate>
            </Button.Resources>
        </Button>

        <Button x:Name="config" Content="Button" HorizontalAlignment="Left" Margin="1830,15,0,0" VerticalAlignment="Top" Width="65" Height="65" Template="{DynamicResource ButtonControlTemplate1}">
            <Button.Resources>
                <ControlTemplate x:Key="ButtonControlTemplate1" TargetType="{x:Type Button}">
                    <Grid>
                        <Rectangle x:Name="bac" Fill="#FFF4F4F5" HorizontalAlignment="Stretch" Height="Auto" Stroke="#FFF4F4F5" VerticalAlignment="Stretch" Width="Auto" RadiusY="19.5" RadiusX="19.5">
                            <Rectangle.Effect>
                                <DropShadowEffect Opacity="0.3"/>

                            </Rectangle.Effect>
                        </Rectangle>
                        <Image Height="Auto" Margin="15" VerticalAlignment="Stretch" Width="Auto" Source="settings_100px.png">
                            <Image.Effect>
                                <DropShadowEffect Opacity="0.2"/>
                            </Image.Effect>
                        </Image>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter TargetName="bac" Property="Fill">
                                <Setter.Value>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#f2f2f2" Offset="0"/>
                                        <GradientStop Color="#b3b3b3" Offset="1"/>
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                            <Setter TargetName="bac" Property="Stroke">
                                <Setter.Value>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#f2f2f2" Offset="0"/>
                                        <GradientStop Color="#b3b3b3" Offset="1"/>
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                        </Trigger>


                    </ControlTemplate.Triggers>

                </ControlTemplate>
            </Button.Resources>
        </Button>

    </Grid>
    <Grid x:Name="horas" HorizontalAlignment="Left" Margin="825,55,0,0" Width="270" Height="155" VerticalAlignment="Top">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="11*"/>
            <ColumnDefinition Width="10*"/>
            <ColumnDefinition Width="33*"/>
        </Grid.ColumnDefinitions>
        <Grid.Effect>
            <DropShadowEffect Opacity="0.4" Direction="400"/>
        </Grid.Effect>
        <Rectangle Fill="#B2F4F4F5" RadiusY="19.5" RadiusX="19.5" Margin="5,0,10,20" Grid.ColumnSpan="3"/>
        <Label x:Name="horas1" Content="00" HorizontalAlignment="Left" Margin="25,25,0,0" FontSize="72" Height="106" VerticalAlignment="Top" FontFamily="Arial" FontWeight="Bold" Foreground="#FF7A7A7A" Grid.ColumnSpan="3">
            <Label.Effect>
                <DropShadowEffect Opacity="0.2"/>
            </Label.Effect>
        </Label>
        <Label x:Name="ponto" Content=":" HorizontalAlignment="Left" Margin="11,20,0,0" FontSize="72" Height="106" VerticalAlignment="Top" FontFamily="Arial" FontWeight="Bold" Foreground="#FF7A7A7A" RenderTransformOrigin="0.441,0.292" Grid.Column="2"/>
        <Label x:Name="minutos" Content="00" HorizontalAlignment="Left" Margin="45,25,0,0" FontSize="72" Height="106" VerticalAlignment="Top" FontFamily="Arial" FontWeight="Bold" Foreground="#FF7A7A7A" Grid.Column="2">
            <Label.Effect>
                <DropShadowEffect Opacity="0.2"/>
            </Label.Effect>
        </Label>
    </Grid>

</Grid>

</Window>

error type:

System.NullReferenceException

Kairo Martins 21 Reputation points

2021-01-19T16:07:42.337+00:00

presents the error without any code referring to the System.NullReferenceException
valdom 16 Reputation points

2021-01-19T16:55:05.557+00:00

Why do you answer to your own question ?
DaisyTian-1203 11,616 Reputation points

2021-01-20T02:39:19.96+00:00

@Kairo Martins
Could you show the rest of Xaml code for me to reproduce the error? And what do My , w and bacground refer to？By the way, is your project a WPF or Windows forms project? and what framework does it target? Framework or .Net core?
Kairo Martins 21 Reputation points

2021-01-20T13:22:21.94+00:00

@DaisyTian-MSFT
is a wpf project with net framework 4.7.
W is the public reference to "Main Window"
bacground is a common grid.

I left the mainform full xAml
the second part of the code I posted is in a different window
made bgv a sub public
W would be a reference to main Window
EX

dim w as mainform
w.eventpublic
DaisyTian-1203 11,616 Reputation points

2021-01-21T06:29:18.783+00:00

@@Kairo Martins
You need to create new instance of MainWindow. SoPlease replace your dim w as mainform to Dim w As MainWindow = New MainWindow().
Kairo Martins 21 Reputation points

2021-01-21T13:20:27.987+00:00

I
@DaisyTian-MSFT

I did what you said the most when the stranger does not change the image, and when I close the app it continues running.
and when I stop and debug again it comes back with the image changed.
Kairo Martins 21 Reputation points

2021-01-21T13:24:45.803+00:00

@DaisyTian-MSFT

I need to change the image during execution without having to restart

DaisyTian-1203 11,616

@Kairo Martins Your w is a new instance, it is not the shown MainWindow.
I update your code like below:

 Private Sub openbtn_Click(sender As Object, ByVal e As RoutedEventArgs)  
        Dim window = Application.Current.MainWindow  
        Dim a As MainWindow = New MainWindow()  
        Dim dlg As Microsoft.Win32.OpenFileDialog = New Microsoft.Win32.OpenFileDialog()  
        Dim result As Nullable(Of Boolean) = dlg.ShowDialog()  
  
        If result = True Then  
            My.Settings.Background = dlg.FileName  
            My.Settings.Save()  
        End If  
  
        a.bgv(window)  
    End Sub  
  
    Private Sub bgv(win As Window)  
        Dim img = New ImageBrush()  
        img.ImageSource = New BitmapImage(New Uri(My.Settings.Background))  
        win.Background = img  
    End Sub