This is a migrated thread and some comments may be shown as answers.

[Solved] WCF Image in GridView

1 Answer 109 Views

GridView

This is a migrated thread and some comments may be shown as answers.

This question is locked. New answers and comments are not allowed.

Drew asked on 11 Nov 2010, 03:55 AM

Hi,

I am trying to display an image in my GridView similar to the "FirstLook GridView" in the RadControls Demo.

My images are stored within an SQL table and I am able to successfully pull all the SQL Data across using a WCF service. The images are stored as a Linq.Binary image in the SQL table.

I have bound the GridView to the results successfully, all text fields show fine, however the image does not display. I have the converter included. Here is my code.

<Grid x:Name="LayoutRoot">

<Grid.Resources>

<telerik:BinaryImageConverter x:Key="converter" />

</Grid.Resources>

<telerik:RadGridView x:Name="radGridView" RowDetailsVisibilityMode="VisibleWhenSelected" AutoGenerateColumns="False">

<telerik:RadGridView.Columns>

<telerik:GridViewDataColumn Header="Surname" Width="250" DataMemberBinding="{Binding LastName}" />

<telerik:GridViewDataColumn Header="First Name" Width="250" DataMemberBinding="{Binding FirstName}" />

</telerik:RadGridView.Columns>

<telerik:RadGridView.RowDetailsTemplate>

<DataTemplate>

<telerik:RadTabControl BackgroundVisibility="Collapsed" x:Name="RadTabControl" Margin="8" VerticalAlignment="Center" Background="Transparent">

<telerik:RadTabItem Header="Details" DataContext="{Binding}" Margin="10,0,0,0" Height="24">

<Grid Width="Auto" HorizontalAlignment="Stretch">

<Grid.RowDefinitions>

<RowDefinition />

<RowDefinition Height="15" />

</Grid.RowDefinitions>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="Auto" />

</Grid.ColumnDefinitions>

<Border Grid.Column="0" Grid.RowSpan="6" Grid.Row="0" VerticalAlignment="Top" HorizontalAlignment="Stretch" Height="115" Width="115" Margin="15" BorderThickness="1" CornerRadius="1" BorderBrush="#FF848484">

<Border Margin="0" BorderThickness="1,1,1,1" CornerRadius="0,0,0,0" BorderBrush="Gainsboro">

<Border.Background>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#33FFFFFF" Offset="1"/>

<GradientStop Color="#00000000"/>

<GradientStop Color="#7FFFFFFF" Offset="0.17"/>

<GradientStop Color="#66FFFFFF" Offset="0.18"/>

</LinearGradientBrush>

</Border.Background>

<Image Source="{Binding Photo, Converter={StaticResource converter}}" HorizontalAlignment="Center" VerticalAlignment="Center" Height="96" Width="96">

<Image.OpacityMask>

<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="Black" Offset="0.935"/>

<GradientStop Offset="1"/>

<GradientStop Color="#00000000"/>

<GradientStop Color="Black" Offset="0.113"/>

</LinearGradientBrush>

</Image.OpacityMask>

</Image>

</Border>

<TextBlock Text="ID: " Margin="5,10,0,0" FontWeight="Bold" Grid.Row="0" Grid.Column="1" />

<TextBlock Text="{Binding StudentID}" Margin="10,10,0,0" Grid.Row="0" Grid.Column="2" />

<TextBlock Text="Surname: " Margin="5,0,0,0" FontWeight="Bold" Grid.Row="1" Grid.Column="1" />

<TextBlock Text="{Binding LastName}" Margin="10,0,0,0" Grid.Row="1" Grid.Column="2" />

<TextBlock Text="First Name:" Margin="5,0,0,0" FontWeight="Bold" Grid.Row="2" Grid.Column="1" />

<TextBlock Text="{Binding FirstName}" Margin="10,0,0,0" Grid.Row="2" Grid.Column="2" />

</Grid>

</telerik:RadTabItem>

<telerik:RadTabItem Header="Results" Height="24">

</telerik:RadTabItem>

<telerik:RadTabItem Header="Performance Chart" HorizontalContentAlignment="Stretch" HorizontalAlignment="Left">

</telerik:RadTabItem>

</telerik:RadTabControl>

</DataTemplate>

</telerik:RadGridView.RowDetailsTemplate>

</telerik:RadGridView>

</Grid>

[Solved] WCF Image in GridView

1 Answer, 1 is accepted