Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
145
Unable to use EffectStops
posted

I have an observable collection of items that I am binding my carousel to. The items in the collection work well and populate my CarouselListBox as expected. The issue I have is that I am attempting to have all items in the Carousel stay in the view (don't want them to disappear)  and have the item in the center to be the selected item, and to scale larger. I assumed part of accomplishing the scaling and opacity requirements would be using ScalingEffectStop and ZorderEffectStop properties. When I attempt to add them however, I get the following error:

The value "Infragistics.Windows.Controls.ScalingEffectStop" is not of type "System.Collections.Generic.KeyValuePair'2[System.String,System.Object]" and cannot be used in this generic collection. Parameter name: value

Note: My itemsource is coming from my ViewModel that is being used as the DataContext for my view.

Here is an example of my XAML:

<igWindows:XamCarouselListBox x:Name="xamcarousellistbox"
                                      Grid.Column="1" Grid.Row="0"
                                      ItemsSource="{Binding Loadbank.Sequence}"
                                      ItemTemplate="{StaticResource CarouselTemplate}"
                                      SelectedIndex="0">
            <igWindows:XamCarouselListBox.ViewSettings>
                <igWindows:CarouselViewSettings ItemsPerPage="20"
                                                ItemSize="300,150"
                                                ReserveSpaceForReflections="False"
                                                IsNavigatorVisible="False"
                                                RotateItemsWithPathTangent="False"
                                                ItemPathAutoPad="True"
                                                ShouldScrollItemsIntoInitialPosition="True"
                                                IsListContinuous="False"
                                                UseOpacity="True"
                                                UseZOrder="True"
                                                UseScaling="True"
                                                ScalingEffectStopDirection="UseItemPath"
                                                ZOrderEffectStopDirection="UseItemPath"
                                                ItemHorizontalScrollBarVisibility="Disabled"
                                                ItemVerticalScrollBarVisibility="Disabled"
                                                ItemPathVerticalAlignment="Center"
                                                ItemPathHorizontalAlignment="Center"
                                                AutoScaleItemContentsToFit="False"
                                                ItemPathRenderBrush="Red"
                                                OpacityEffectStopDirection="UseItemPath"
                                                ItemTransitionStyle="AdjustSize">
                    <igWindows:CarouselViewSettings.ScalingEffectStops>
                        <igWindows:ScalingEffectStop Offset="0.0" Value="0" />
                    </igWindows:CarouselViewSettings.ScalingEffectStops>
                </igWindows:CarouselViewSettings>
            </igWindows:XamCarouselListBox.ViewSettings>
        </igWindows:XamCarouselListBox>

Parents
  • 34430
    Verified Answer
    Offline posted

    Hello Antonio,

    Thank you for your post.

    I have created a sample project based on the sample code that you have provided, but at the moment, I am unable to reproduce this exception you are seeing. I have attached the sample project that I have used to test this, and my tests were made against version 16.1.20161.2056 in Infragistics for WPF 2016.1. Is this the same version you are using?

    Regarding the ScalingEffectStop elements only targeting the "selected" item, you will need to play with the ScalingEffectStops collection. If you are adding multiple of these, you can add a ScalingEffectStopCollection to your ScalingEffectStops property of your CarouselViewSettings and add multiple ScalingEffectStop elements for different offsets and add different scale Values for those offsets. In the sample project attached, I have added a collection that looks like the following:

    <ig:CarouselViewSettings.ScalingEffectStops>
     <ig:ScalingEffectStopCollection>
      <ig:ScalingEffectStop Offset="0.3" Value=".5"/>
      <ig:ScalingEffectStop Offset="0.5" Value="1.5"/>
      <ig:ScalingEffectStop Offset="0.7" Value=".5"/>
      <ig:ScalingEffectStop Offset="1"/>
     </ig:ScalingEffectStopCollection>
    </ig:CarouselViewSettings.ScalingEffectStops>

    Using the above, I see that the two items at the center-"front" are 1.5 times the size they are normally, and the ones toward the back are half the size they are normally.

    To keep your items in view, I would recommend that you make the listbox continuous. You can do this by setting the IsListContinuous property of your CarouselViewSettings to "True." With this setting, when one carousel item would normally go out of view, it will move to the other side of the carousel track that is used. This should prevent your items from going out of view as long as the ItemsPerPage property is set to allow more than the amount of items in your ItemsSource. 

    Please let me know if you have any other questions or concerns on this matter.

    Sincerely,
    Andrew
    Associate Developer

    XamCarouselScalingCase.zip
Reply Children
No Data