Hi,
I am createing WAP Browser Application to use RadCarousel, in which I am binding data to RadCarousel with datatable. When I run this xbap it doesnt show any error. but not showing data in CaruselItems.
can you please tell me what I am missing here?
my code is
<Page x:Class="WPFBrowserApplication.Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
xmlns:carousel="clr-namespace:Telerik.Windows.Controls.Carousel;assembly=Telerik.Windows.Controls.Navigation"
Title="Page1">
<Grid>
<Grid.Resources>
<carousel:ArithmeticValueConverter x:Key="ArithmeticValueConverter" />
<Style TargetType="{x:Type telerik:CarouselItem}">
<Setter Property="Template" >
<Setter.Value>
<ControlTemplate TargetType="{x:Type telerik:CarouselItem}">
<Grid ClipToBounds="False" Height="175" Width="150" >
<Border RenderTransformOrigin="0.5, 1" ClipToBounds="False" Width="{Binding ElementName=CarouselItemInnerGrid, Path=ActualWidth}"
Opacity="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.Opacity}"
Visibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.Visibility}"
BorderBrush="White"
BorderThickness="0">
<Border.RenderTransform>
<TransformGroup>
<ScaleTransform
ScaleX="{Binding RelativeSource={RelativeSource TemplatedParent},
Path=ReflectionSettings.WidthOffset,
Converter={StaticResource ArithmeticValueConverter},
ConverterParameter=1}"
ScaleY="{Binding RelativeSource={RelativeSource TemplatedParent},
Path=ReflectionSettings.HeightOffset,
Converter={StaticResource ArithmeticValueConverter},
ConverterParameter=-1}"
CenterY="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.OffsetY}" />
<TranslateTransform X="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.OffsetX}" />
<SkewTransform AngleX="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.Angle}" />
</TransformGroup>
</Border.RenderTransform>
<Border.OpacityMask>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStop Offset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.HiddenPercentage}" Color="Transparent"/>
<GradientStop Offset="1" Color="Black"/>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.OpacityMask>
<Border.Background>
<VisualBrush Visual="{Binding ElementName=CarouselItemInnerGrid}">
</VisualBrush>
</Border.Background>
</Border>
<Grid x:Name="CarouselItemInnerGrid">
<Border x:Name="CarouselItemMainBorder" Opacity="0.5" BorderBrush="#FF91B3FF" BorderThickness="1,1,1,1" CornerRadius="5,5,5,5" SnapsToDevicePixels="True">
<Border.Background>
<LinearGradientBrush EndPoint="108,472" StartPoint="108,23" MappingMode="Absolute">
<GradientStop Color="#FF2C3A68" Offset="0"/>
<GradientStop Color="#FF000000" Offset="1"/>
<GradientStop Color="#FF0F224C" Offset="0.045"/>
<GradientStop Color="#FF000000" Offset="0.0451"/>
</LinearGradientBrush>
</Border.Background>
</Border>
<Border Opacity="1" BorderBrush="#3F000000" BorderThickness="1,1,1,1" CornerRadius="5,5,5,5" Margin="10,10,10,10" x:Name="CarouselItemInnerBorder" SnapsToDevicePixels="True">
<Border.Background>
<LinearGradientBrush EndPoint="101,462" StartPoint="101,13" MappingMode="Absolute">
<GradientStop Color="#FF2C3A68" Offset="0"/>
<GradientStop Color="#FF000000" Offset="1"/>
<GradientStop Color="#FF0F224C" Offset="0.045"/>
<GradientStop Color="#FF000000" Offset="0.0451"/>
</LinearGradientBrush>
</Border.Background>
<ContentPresenter IsHitTestVisible="True" />
<Border.Triggers>
</Border.Triggers>
</Border>
</Grid>
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="False" />
<Condition Property="IsMouseOver" Value="True" />
</MultiTrigger.Conditions>
<MultiTrigger.EnterActions>
<BeginStoryboard>
<Storyboard >
<ColorAnimation Storyboard.TargetName="CarouselItemMainBorder" Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#FF344B97" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemMainBorder" Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#FF233F7E" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemInnerBorder" Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#FF344B97" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemInnerBorder" Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#FF233F7E" Duration="0:0:0.3" />
</Storyboard>
</BeginStoryboard>
</MultiTrigger.EnterActions>
<MultiTrigger.ExitActions>
<BeginStoryboard>
<Storyboard FillBehavior="Stop" >
<ColorAnimation Storyboard.TargetName="CarouselItemMainBorder" Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#FF2C3A68" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemMainBorder" Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#FF0F224C" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemInnerBorder" Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#FF2C3A68" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemInnerBorder" Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#FF0F224C" Duration="0:0:0.3" />
</Storyboard>
</BeginStoryboard>
</MultiTrigger.ExitActions>
</MultiTrigger>
<Trigger Property="IsSelected" Value="True" >
<Setter TargetName="CarouselItemMainBorder" Property="Background">
<Setter.Value>
<LinearGradientBrush EndPoint="108,472" StartPoint="108,23" MappingMode="Absolute">
<GradientStop Color="#FF344B97" Offset="0"/>
<GradientStop Color="#FF000000" Offset="1"/>
<GradientStop Color="#FF233F7E" Offset="0.045"/>
<GradientStop Color="#FF000000" Offset="0.0451"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Setter TargetName="CarouselItemInnerBorder" Property="Background">
<Setter.Value>
<LinearGradientBrush EndPoint="101,462" StartPoint="101,13" MappingMode="Absolute">
<GradientStop Color="#FF344B97" Offset="0"/>
<GradientStop Color="#FF000000" Offset="1"/>
<GradientStop Color="#FF233F7E" Offset="0.045"/>
<GradientStop Color="#FF000000" Offset="0.0451"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="{x:Type telerik:CarouselDataRecordPresenter}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type telerik:CarouselDataRecordPresenter}">
<Grid IsHitTestVisible="False" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Grid.RowDefinitions>
<RowDefinition Height="30" />
<RowDefinition Height="100" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal" VerticalAlignment="Center" >
<Label Content="Name: " Foreground="#ff8FB3FF" FontSize="12"/>
<Label Content="{Binding Path=Data.FirstName}" Foreground="#ff8FB3FF" FontSize="12" />
</StackPanel>
<Rectangle Grid.Row="1" RadiusX="3" RadiusY="3" Width="110" Height="80">
<!--
<Rectangle.Fill>
<ImageBrush x:Name="brush" ImageSource="{Binding Path=Data.Picture}"/>
</Rectangle.Fill>
-->
</Rectangle>
<StackPanel Grid.Row="2" Orientation="Horizontal" VerticalAlignment="Center">
<Label Content="Phone: " Foreground="#ff8FB3FF" FontSize="12"/>
<Label Content="{Binding Path=Data.Phone}" FontSize="12" Foreground="#ff8FB3FF"/>
</StackPanel>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Grid.Resources>
<telerik:RadCarousel x:Name="sampleRadCarousel" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
</Grid>
</Page>
and my datatable is like
public DataTable getData()
{
DataTable dt = new DataTable();
DataSet ds = new DataSet();
dt.Columns.Add("ID", Type.GetType("System.Int32"));
dt.Columns.Add("FirstName", Type.GetType("System.String"));
dt.Columns.Add("LastName", Type.GetType("System.String"));
dt.Columns.Add("Phone", Type.GetType("System.String"));
dt.Columns.Add("Picture");
try
{
DataRow dr = dt.NewRow();
dr["ID"] = 46;
dr["FirstName"] = "Ana";
dr["LastName"] = "Trujillo";
dr["Phone"] = "6562-9722";
dr["Picture"] = pic code here
dt.Rows.Add(dr);
dt.AcceptChanges();
dr = dt.NewRow();
dr["ID"] = 47;
dr["FirstName"] = "Ana";
dr["LastName"] = "Trujillo";
dr["Phone"] = "6562-9722";
dr["Picture"] = pic code here
dt.Rows.Add(dr);
dt.AcceptChanges();
}
catch(Exception ex)
{
}
return dt;
}
I could see blank item in RadCarousel at runtime
I am createing WAP Browser Application to use RadCarousel, in which I am binding data to RadCarousel with datatable. When I run this xbap it doesnt show any error. but not showing data in CaruselItems.
can you please tell me what I am missing here?
my code is
<Page x:Class="WPFBrowserApplication.Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
xmlns:carousel="clr-namespace:Telerik.Windows.Controls.Carousel;assembly=Telerik.Windows.Controls.Navigation"
Title="Page1">
<Grid>
<Grid.Resources>
<carousel:ArithmeticValueConverter x:Key="ArithmeticValueConverter" />
<Style TargetType="{x:Type telerik:CarouselItem}">
<Setter Property="Template" >
<Setter.Value>
<ControlTemplate TargetType="{x:Type telerik:CarouselItem}">
<Grid ClipToBounds="False" Height="175" Width="150" >
<Border RenderTransformOrigin="0.5, 1" ClipToBounds="False" Width="{Binding ElementName=CarouselItemInnerGrid, Path=ActualWidth}"
Opacity="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.Opacity}"
Visibility="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.Visibility}"
BorderBrush="White"
BorderThickness="0">
<Border.RenderTransform>
<TransformGroup>
<ScaleTransform
ScaleX="{Binding RelativeSource={RelativeSource TemplatedParent},
Path=ReflectionSettings.WidthOffset,
Converter={StaticResource ArithmeticValueConverter},
ConverterParameter=1}"
ScaleY="{Binding RelativeSource={RelativeSource TemplatedParent},
Path=ReflectionSettings.HeightOffset,
Converter={StaticResource ArithmeticValueConverter},
ConverterParameter=-1}"
CenterY="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.OffsetY}" />
<TranslateTransform X="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.OffsetX}" />
<SkewTransform AngleX="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.Angle}" />
</TransformGroup>
</Border.RenderTransform>
<Border.OpacityMask>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStop Offset="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ReflectionSettings.HiddenPercentage}" Color="Transparent"/>
<GradientStop Offset="1" Color="Black"/>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.OpacityMask>
<Border.Background>
<VisualBrush Visual="{Binding ElementName=CarouselItemInnerGrid}">
</VisualBrush>
</Border.Background>
</Border>
<Grid x:Name="CarouselItemInnerGrid">
<Border x:Name="CarouselItemMainBorder" Opacity="0.5" BorderBrush="#FF91B3FF" BorderThickness="1,1,1,1" CornerRadius="5,5,5,5" SnapsToDevicePixels="True">
<Border.Background>
<LinearGradientBrush EndPoint="108,472" StartPoint="108,23" MappingMode="Absolute">
<GradientStop Color="#FF2C3A68" Offset="0"/>
<GradientStop Color="#FF000000" Offset="1"/>
<GradientStop Color="#FF0F224C" Offset="0.045"/>
<GradientStop Color="#FF000000" Offset="0.0451"/>
</LinearGradientBrush>
</Border.Background>
</Border>
<Border Opacity="1" BorderBrush="#3F000000" BorderThickness="1,1,1,1" CornerRadius="5,5,5,5" Margin="10,10,10,10" x:Name="CarouselItemInnerBorder" SnapsToDevicePixels="True">
<Border.Background>
<LinearGradientBrush EndPoint="101,462" StartPoint="101,13" MappingMode="Absolute">
<GradientStop Color="#FF2C3A68" Offset="0"/>
<GradientStop Color="#FF000000" Offset="1"/>
<GradientStop Color="#FF0F224C" Offset="0.045"/>
<GradientStop Color="#FF000000" Offset="0.0451"/>
</LinearGradientBrush>
</Border.Background>
<ContentPresenter IsHitTestVisible="True" />
<Border.Triggers>
</Border.Triggers>
</Border>
</Grid>
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="False" />
<Condition Property="IsMouseOver" Value="True" />
</MultiTrigger.Conditions>
<MultiTrigger.EnterActions>
<BeginStoryboard>
<Storyboard >
<ColorAnimation Storyboard.TargetName="CarouselItemMainBorder" Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#FF344B97" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemMainBorder" Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#FF233F7E" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemInnerBorder" Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#FF344B97" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemInnerBorder" Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#FF233F7E" Duration="0:0:0.3" />
</Storyboard>
</BeginStoryboard>
</MultiTrigger.EnterActions>
<MultiTrigger.ExitActions>
<BeginStoryboard>
<Storyboard FillBehavior="Stop" >
<ColorAnimation Storyboard.TargetName="CarouselItemMainBorder" Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#FF2C3A68" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemMainBorder" Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#FF0F224C" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemInnerBorder" Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#FF2C3A68" Duration="0:0:0.3" />
<ColorAnimation Storyboard.TargetName="CarouselItemInnerBorder" Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#FF0F224C" Duration="0:0:0.3" />
</Storyboard>
</BeginStoryboard>
</MultiTrigger.ExitActions>
</MultiTrigger>
<Trigger Property="IsSelected" Value="True" >
<Setter TargetName="CarouselItemMainBorder" Property="Background">
<Setter.Value>
<LinearGradientBrush EndPoint="108,472" StartPoint="108,23" MappingMode="Absolute">
<GradientStop Color="#FF344B97" Offset="0"/>
<GradientStop Color="#FF000000" Offset="1"/>
<GradientStop Color="#FF233F7E" Offset="0.045"/>
<GradientStop Color="#FF000000" Offset="0.0451"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Setter TargetName="CarouselItemInnerBorder" Property="Background">
<Setter.Value>
<LinearGradientBrush EndPoint="101,462" StartPoint="101,13" MappingMode="Absolute">
<GradientStop Color="#FF344B97" Offset="0"/>
<GradientStop Color="#FF000000" Offset="1"/>
<GradientStop Color="#FF233F7E" Offset="0.045"/>
<GradientStop Color="#FF000000" Offset="0.0451"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="{x:Type telerik:CarouselDataRecordPresenter}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type telerik:CarouselDataRecordPresenter}">
<Grid IsHitTestVisible="False" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Grid.RowDefinitions>
<RowDefinition Height="30" />
<RowDefinition Height="100" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal" VerticalAlignment="Center" >
<Label Content="Name: " Foreground="#ff8FB3FF" FontSize="12"/>
<Label Content="{Binding Path=Data.FirstName}" Foreground="#ff8FB3FF" FontSize="12" />
</StackPanel>
<Rectangle Grid.Row="1" RadiusX="3" RadiusY="3" Width="110" Height="80">
<!--
<Rectangle.Fill>
<ImageBrush x:Name="brush" ImageSource="{Binding Path=Data.Picture}"/>
</Rectangle.Fill>
-->
</Rectangle>
<StackPanel Grid.Row="2" Orientation="Horizontal" VerticalAlignment="Center">
<Label Content="Phone: " Foreground="#ff8FB3FF" FontSize="12"/>
<Label Content="{Binding Path=Data.Phone}" FontSize="12" Foreground="#ff8FB3FF"/>
</StackPanel>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Grid.Resources>
<telerik:RadCarousel x:Name="sampleRadCarousel" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
</Grid>
</Page>
and my datatable is like
public DataTable getData()
{
DataTable dt = new DataTable();
DataSet ds = new DataSet();
dt.Columns.Add("ID", Type.GetType("System.Int32"));
dt.Columns.Add("FirstName", Type.GetType("System.String"));
dt.Columns.Add("LastName", Type.GetType("System.String"));
dt.Columns.Add("Phone", Type.GetType("System.String"));
dt.Columns.Add("Picture");
try
{
DataRow dr = dt.NewRow();
dr["ID"] = 46;
dr["FirstName"] = "Ana";
dr["LastName"] = "Trujillo";
dr["Phone"] = "6562-9722";
dr["Picture"] = pic code here
dt.Rows.Add(dr);
dt.AcceptChanges();
dr = dt.NewRow();
dr["ID"] = 47;
dr["FirstName"] = "Ana";
dr["LastName"] = "Trujillo";
dr["Phone"] = "6562-9722";
dr["Picture"] = pic code here
dt.Rows.Add(dr);
dt.AcceptChanges();
}
catch(Exception ex)
{
}
return dt;
}
I could see blank item in RadCarousel at runtime