Position of Navigation Template of RadCoverFlow

[kalyan]

Hi,

I want to position the Navigation Template of RadCoverFlow for my own use. Let's say I want my navigation panel in the left side of the Image List. I didn't find any property which defines position of the panel. Plz advise me for this purpose. Unless i want a different template of RadCoverFlow, so that i can further modify this control for my purpose.

Kalyan

[Miroslav Nedyalkov]

Hello kalyan,

There is no property to change the position of the navigation template. To do this, you need to override the ControlTemplate of the CoverFlow control. I am attaching an example. The ContentPresenter called NavigationParent shows the navigation panel and the ItemsPresenter shows the images.

Sincerely yours,
Miroslav Nedyalkov
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[kalyan]

Hi Miroslav ,

I have a small problem with my navigation panel. The starting index of this panel is always 0 and i want this to be 1. I am not able to fix this because i am not finding any option for this property. Plz help me.

Thanks

Kalyan

[Miroslav Nedyalkov]

Hi Kalyan,

If you are changing the NavigationPanelTemplate property, and your navigation element (slider, scroller, etc.) needs to get minimum value of 1, you can just use 1 instead of {Binding MinimumIndex}. If you want to do something else, we will need additional information to be able to provide more to-the-point reply.

All the best,
Miroslav Nedyalkov
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[kalyan]

Hi Miroslav ,

Thanks for the reply . Actually i am using RadCoverFlow for my MultiImageViewer Application. For navigating the images i am using a customized NavigationPanel. Here always the starting index is 0. As you told i have tried it by putting the value 1 instead of {Binding MinimumIndex}. Ok then the starting index is 1. But when i click next  for the first time then the next image navigates but the index doesn't change. It means suppose i have five images then  after every successive navigation the currentindex will be { 1,1,2,3,4}. I am sending my application Xaml  plz look at it.

<

UserControl.Resources>

 

 

<DataTemplate x:Key="NavigationTemplate">

 

 

<Grid HorizontalAlignment="Center" VerticalAlignment="Stretch">

 

 

<Grid HorizontalAlignment="Center">

 

 

<Grid.Resources>

 

 

<telerikNavigation:DoubleToIntConverter x:Key="doubleToIntconverter" />

 

 

</Grid.Resources>

 

 

<Grid.ColumnDefinitions>

 

 

<ColumnDefinition Width="Auto" />

 

 

<ColumnDefinition Width="200" />

 

 

<ColumnDefinition Width="Auto" />

 

 

</Grid.ColumnDefinitions>

 

 

<Grid.RowDefinitions>

 

 

<RowDefinition Height="25" />

 

 

</Grid.RowDefinitions>

 

 

<telerikInput:RadNumericUpDown Grid.Column="1" Grid.Row="0" MinWidth="200"

 

 

Minimum="1"

 

 

Maximum="{Binding MaximumIndex, Mode=TwoWay}"

 

 

Value="{Binding CurrentIndex, Mode=TwoWay, Converter={StaticResource doubleToIntconverter}}"

 

 

SmallChange="1" LargeChange="3">

 

 

 

</telerikInput:RadNumericUpDown>

 

 

<StackPanel Grid.Column="0" Grid.Row="0" Orientation="Horizontal"

 

 

HorizontalAlignment="Left">

 

 

<!--<Button telerikNavigation:Navigation.PreviousLargeStepEventName="Click"

 

Content="®" />-->

 

<Button telerikNavigation:Navigation.PreviousEventName="Click" Content="←" ToolTipService.ToolTip="Previous image"/>

 

 

</StackPanel>

 

 

<StackPanel Grid.Column="2" Grid.Row="0" Orientation="Horizontal"

 

 

HorizontalAlignment="Right">

 

 

<Button telerikNavigation:Navigation.NextEventName="Click" Content="→" ToolTipService.ToolTip="Next image" />

 

 

<!--<Button telerikNavigation:Navigation.NextLargeStepEventName="Click"

 

Content="¯" />-->

 

</StackPanel>

 

 

</Grid>

 

 

</Grid>

 

 

</DataTemplate>

 

 

</UserControl.Resources>

 

 

 

<Grid x:Name="LayoutRoot" Background="White" Width="Auto" Height="Auto">

 

 

<Grid Margin="24,19,24,19" x:Name="Border">

 

 

<Rectangle HorizontalAlignment="Stretch" Margin="0,0,0,0" VerticalAlignment="Stretch" RadiusX="10" RadiusY="10">

 

 

<Rectangle.Fill>

 

 

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

 

 

<LinearGradientBrush.Transform>

 

 

<MatrixTransform />

 

 

</LinearGradientBrush.Transform>

 

 

<LinearGradientBrush.RelativeTransform>

 

 

<MatrixTransform />

 

 

</LinearGradientBrush.RelativeTransform>

 

 

<GradientStop Color="#4C5A70A3" Offset="1" />

 

 

<GradientStop Color="#00000000" Offset="0" />

 

 

</LinearGradientBrush>

 

 

</Rectangle.Fill>

 

 

</Rectangle>

 

 

<Path Height="1.376" HorizontalAlignment="Stretch"

 

 

Margin="0.540000021457672,39.2639999389648,1.49000000953674,0"

 

 

VerticalAlignment="Top" Stretch="Fill"

 

 

Data="M24.000011,58.662556 L717.70642,58.662556">

 

 

<Path.Stroke>

 

 

<SolidColorBrush Color="#99FFFFFF">

 

 

<SolidColorBrush.Transform>

 

 

<MatrixTransform />

 

 

</SolidColorBrush.Transform>

 

 

<SolidColorBrush.RelativeTransform>

 

 

<MatrixTransform />

 

 

</SolidColorBrush.RelativeTransform>

 

 

</SolidColorBrush>

 

 

</Path.Stroke>

 

 

</Path>

 

 

<telerikNavigation:RadCoverFlow

 

 

Margin="24,19,24,19"

 

 

x:Name="CoverFlow"

 

 

ItemMaxHeight="300"

 

 

CenterOffsetY="100"

 

 

CameraY="-180"

 

 

ReflectionStartAlpha="250"

 

 

ReflectionRelativeHeight="0.4"

 

 

NavigationPanelVisibility="Visible"

 

 

NavigationPanelTemplate="{StaticResource NavigationTemplate}"

 

 

 

SelectedItemMouseUp="CoverFlow_SelectedItemMouseUp"

 

 

/>

 

 

</Grid>

 

 

<Image Margin="24,19,24,19" x:Name="imgShow" Visibility="Collapsed" BindingValidationError="imgShow_BindingValidationError" ImageFailed="imgShow_ImageFailed" MouseLeftButtonUp="imgShow_MouseLeftButtonDown"/>

 

 

</Grid>

 

[Miroslav Nedyalkov]

Hi Kalyan,

I think this time I understand you correctly - you want to index the images starting at 1 (i.e. the first one to be number 1, the second - number 2, etc.). You can do this by creating your own value converter and replacing the doubleToIntconverter with it.

Hope this helps.

Kind regards,
Miroslav Nedyalkov
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[kalyan]

Miroslav,

I think i was not able to elaborate what i wanted to explain you regarding my issue. What you have answered to my query was not about my requirement but it will be useful for some applications. I have nothing to do with the valueConverter. I just want to show you that if i put the  minimum property of RadNumericUpDown to 1 instead of ="{Binding MinimumIndex, Mode=TwoWay}",

 then the current index of the Coverflow is not changing correctly while navigating the images by clicking the next and previous button of the navigationpanel.This is strange but happening in my end. This is what i am facing in my end. You can put a couple of imagescollection as the itemcollection of the coverflow  then yu can come across the same issue i faced. You can try it by using the XAML source  sent by me in the earlier message. May be it is one of my mistake. I want you to please look at this particular issue. .

Thanks

Kalyan

[Miroslav Nedyalkov]

Hello kalyan,

We investigated the problem and what we found was that the problem was in the RangeBase control (the base control of the RadNumericUpDown). This is by design of the RangeBase control and it is not a bug, but you shouldn't set minimum and maximum values if the datafield bound to the value could be beyond this range.

I am not sure that I understand what you are up to, therefore I am attaching an example. Could you take a look at it and if it is not what you want, it would be best if you elaborate a bit more on your goal so that we can find solution to your problem.

The attached example cntains a CoverFlow with 8 items and navigation panel that has a NumericUpDown showing indexes from 1 to 8.

Best wishes,
Miroslav Nedyalkov
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[kalyan]

Mirsolav ,

 Thanks for your patience to answer my issues. At last it is resolved.

Kalyan