Search code examples
c#wpfbindingdatatemplatecontentpresenter

Binding image inside datatemplate of contentpresenter


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.?


Solution

  • 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.