Wpf - Carga una imagen en el control wpf image

Descripción general

Código que muestra como se carga una imagen en un control Wpf image, usando un controlador de eventos y una clase command

[TOC] Tabla de Contenidos

• Una imagen de como queda la ventana
• Declaración de la ventana.
• El evento Click
• La clase Command

En este documento se muestra de forma sencilla como se carga de forma dinámica una imagen en un control Wpf image. Usando para ello un control de eventos y una clase Command.

Controlador de eventos

En primer lugar declararemos una ventana con un control imagen y dos botones, uno que usara el evento "Clic" y otro que usara una clase Command.

↑↑↑

Una imagen de como queda la ventana

↑↑↑

Declaración de la ventana.

<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfCargaImagen01"
mc:Ignorable="d"
Title="MainWindow" Height="234.601" Width="383.605">

<!-- Recursos estáticos de la ventana. -->
<Window.Resources>
<!-- Declaración de la referencia de la clase Command-->
<local:CargaImagenCommand x:Key="CargaImagenCommando" />
</Window.Resources>

<Grid>
<!-- Aquí se declara que la ventana tendrá dos lineas -->
    <Grid.RowDefinitions>
    <RowDefinition Height="*" />
    <RowDefinition Height="auto" />
    </Grid.RowDefinitions>

    <!-- Linea dos, que contiene los dos botones -->

        <!-- Declaración del control image en la primera linea ( que es la linea cero) -->
        <Image Grid.Row="0" x:Name="controlImage" 
        HorizontalAlignment="Stretch"  VerticalAlignment="Stretch" 
        Stretch="Fill" StretchDirection="Both"
        Margin="10"/>

        <!-- Declaración del botón que usara el evento click -->
        <Button  Grid.Row="1" x:Name="buttonAgregarImagen" 
        Content="Agregar imagen" 
        HorizontalAlignment="Left" VerticalAlignment="Bottom"
        Margin="5"  Width="150" 
        Click="buttonAgregarImagen_Click" />

        <!-- Declaración del botón que usara la clase Command 
        Observa que usa una llamada al recuso estático que hemos definido previamente,
        también se pasa por parámetro el control imagen de esta ventana -->
        <Button  Grid.Row="1" x:Name="buttonAgregarImagenCommand" 
        Content="Agregar imagen Command" 
        HorizontalAlignment="Right" VerticalAlignment="Bottom"
        Margin="5"  Width="150"
        Command="{Binding Mode=OneWay, Source={StaticResource CargaImagenCommando}}"
        CommandParameter="{Binding ElementName=controlImage, Mode=OneWay}"  />

        </Grid>

        </Window>

↑↑↑

El evento Click

Private Sub buttonAgregarImagen_Click(sender As Object, e As RoutedEventArgs)

    Dim openFile As New Microsoft.Win32.OpenFileDialog
    Dim b As New BitmapImage()

    openFile.Title = "Seleccione la Imagen a Mostrar"
    openFile.Filter = "Todos(*.*)|*.*|Imágenes|*.jpg;*.gif;*.png;*.bmp"

    Dim resultado As Nullable(Of Boolean)
    resultado = openFile.ShowDialog
    If resultado = True Then
        b.BeginInit()
        b.UriSource = New Uri(openFile.FileName)
        b.EndInit()
        Me.controlImage.Source = b
    End If
End Sub

↑↑↑

La clase Command

Public Class CargaImagenCommand
    Implements ICommand

    Public Event CanExecuteChanged As EventHandler Implements ICommand.CanExecuteChanged

    Public Sub Execute(parameter As Object) Implements ICommand.Execute
        ' en este ejemplo, el parámetro debe contener el 
        ' Control imagen donde se va a cargar con la imagen
        If Not (parameter Is Nothing) Then
            Dim target As System.Windows.Controls.Image
            target = CType(parameter, System.Windows.Controls.Image)
            If Not (target Is Nothing) Then
                ' el parámetro contiene un control imagen
                '------------------------
                ' Proceso de carga de la imagen
                Dim openFile As New Microsoft.Win32.OpenFileDialog
                Dim b As New BitmapImage()

                openFile.Title = "Seleccione la Imagen a Mostrar"
                openFile.Filter = "Todos(*.*)|*.*|Imágenes|*.jpg;*.gif;*.png;*.bmp"

                Dim resultado As Nullable(Of Boolean)
                resultado = openFile.ShowDialog
                If resultado = True Then
                    b.BeginInit()
                    b.UriSource = New Uri(openFile.FileName)
                    b.EndInit()
                    ' ----------------------
                    ' Aquí es donde se carga la imagen en el control imagen
                    target.Source = b
                End If
            End If
        End If
    End Sub

    Public Function CanExecute(parameter As Object) As Boolean Implements ICommand.CanExecute
        Return True
    End Function
End Class

↑↑↑

A.2.Enlaces

[Para saber mas]

[Grupo de documentos]

[Documento Index]

[Documento Start]

[Imprimir el Documento]