Binding image inside datatemplate of contentpresenter

Question

i have a wpf overlay with a contentpresenter:

<Border Background="#2E000000" Name="VentanaEmergente" Visibility="Collapsed" Padding="100" Grid.RowSpan="2" MouseUp="VentanaEmergente_MouseUp">
        <Border Background="AliceBlue" VerticalAlignment="Center" HorizontalAlignment="Center" Width="345" Height="145">
            <Grid>
                <ContentPresenter Name="ContenidoVentanaEmergente" />
            </Grid>
        </Border>
    </Border>

And in the resources have a datatemplate:

<DataTemplate x:Key="contentTemplate">
            <Grid>
                <Grid>
                    <ContentPresenter Content="{Binding ImagenSlideActual}" />
                </Grid>
                <Border BorderBrush="Black" BorderThickness="1" Background="#80000000" Height="80" VerticalAlignment="Bottom">
                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
                        <Button Style="{StaticResource BotonGrande}" Name="BotonImagenAtras" Click="BotonImagenAtras_Click">
                            <Image Style="{StaticResource ImagenGrande}" Source="/VisorSeproban;component/Imagenes/izquierda.png" />
                        </Button>
                        <Button Style="{StaticResource BotonGrande}" Name="BotonImagenesPlay" Click="BotonImagenesPlay_Click">
                            <Image Style="{StaticResource ImagenGrande}" Source="/VisorSeproban;component/Imagenes/play_on.png" />
                        </Button>
                        <Button Style="{StaticResource BotonGrande}" Name="BotonCaputarImagen" Click="BotonCaputarImagen_Click">
                            <Image Style="{StaticResource ImagenGrande}" Source="/VisorSeproban;component/Imagenes/captura_img_on.png" />
                        </Button>
                        <Button Style="{StaticResource BotonGrande}" Name="BotonImagenAdelante" Click="BotonImagenAdelante_Click">
                            <Image Style="{StaticResource ImagenGrande}" Source="/VisorSeproban;component/Imagenes/derecha.png" />
                        </Button>
                    </StackPanel>
                </Border>
            </Grid>
        </DataTemplate>

In my c# code i want to apply this data template in the contentpreseter named ContenidoVentanaEmergente and display an image in the other content presenter on the datatemplate.

To apply the template i do

RadTileViewItem item = sender as RadTileViewItem;
        ImagenSlideActual = ObtenerImagen(item.Uid);

        if (ImagenSlideActual != null)
        {
            ContenidoVentanaEmergente.Content = ImagenSlideActual;
            ContenidoVentanaEmergente.ContentTemplate = (DataTemplate)this.FindResource("contentTemplate");
            this.VentanaEmergente.Visibility = System.Windows.Visibility.Visible;
        }

The template works but the images is not binding, the property Image ImagenSlideActual is public.

How can i do to bind the image in the contentpresenter.?

frno frno · Accepted Answer · 2014-07-04T22:12:02

I tried simplified your example and it did work for me. Try checking if Styles are not interfering here, I did delete those ( BotonGrande and ImagenGrande ). I also added simple empty ViewModel as Content.

<Window.Resources>
    <DataTemplate x:Key="contentTemplate">
        <Grid>
            <Grid>
                <ContentPresenter Content="{Binding ImagenSlideActual}" />
            </Grid>
            <Border BorderBrush="Black" BorderThickness="1" Background="#80000000" Height="80" VerticalAlignment="Bottom">
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
                    <Button Name="BotonImagenesPlay" >
                        <Image Source="/Try;component/Imagenes/play_on.png" />
                    </Button>
                </StackPanel>
            </Border>
        </Grid>
    </DataTemplate>
</Window.Resources>
<Grid x:Name="LayoutRoot">
    <ContentPresenter Name="ContenidoVentanaEmergente" />
</Grid>

and code behind

ContenidoVentanaEmergente.Content = vm;
ContenidoVentanaEmergente.ContentTemplate = (DataTemplate)this.FindResource("contentTemplate");

If nothing works for you make sure you have images added to project and you have not changed BuildAction on images - I have it as Resource.

Binding image inside datatemplate of contentpresenter

1 Answers