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
140
Resizing CarouselPanelItem content...
posted

I am using a XamCarouselPanel with 3 items on a custom path.  I have added different images (size 300x300) to each CarouselPanelItem.  I have also set the following styling to try to get the images to fill the viewbox in the CarouselPanelItem Template but it doesn't work, only a small portion of the .jpg is visible (presumably the default ViewBox size).  Any help is GREATLY appreciated.  Here is the code:

<Style TargetType="{x:Type igWindows:CarouselPanelItem}">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="{x:Type igWindows:CarouselPanelItem}">

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="*"/>

</Grid.RowDefinitions>

<ScrollViewer x:Name="ScrollViewer" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Disabled">

<Viewbox x:Name="ViewBox" HorizontalAlignment="Center" VerticalAlignment="Center" Width="300" Height="300">

<Grid x:Name="itemContentHolder">

<!--<Canvas x:Name="itemCanvas" Width="300" Height="300"/>-->

<ContentControl Margin="0,0,0,0" x:Name="itemContent" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>

</Grid>

</Viewbox>

</ScrollViewer>

</Grid>

<ControlTemplate.Triggers>

<MultiTrigger>

<MultiTrigger.Conditions>

<Condition Property="IsFirstItem" Value="True"/>

<Condition Property="IsListContinuous" Value="True"/>

</MultiTrigger.Conditions>

<Setter Property="Margin" TargetName="itemContent" Value="0,0,0,0"/>

</MultiTrigger>

<MultiTrigger>

<MultiTrigger.Conditions>

<Condition Property="IsLastItem" Value="True"/>

<Condition Property="IsListContinuous" Value="True"/>

</MultiTrigger.Conditions>

<Setter Property="Margin" TargetName="itemContent" Value="0,0,0,0"/>

</MultiTrigger>

<Trigger Property="AutoScaleItemContentsToFit" Value="True">

<Setter Property="HorizontalScrollBarVisibility" TargetName="ScrollViewer" Value="Hidden"/>

<Setter Property="VerticalScrollBarVisibility" TargetName="ScrollViewer" Value="Hidden"/>

<Setter Property="Stretch" TargetName="ViewBox" Value="Uniform"/>

<Setter Property="StretchDirection" TargetName="ViewBox" Value="Both"/>

<Setter Property="Width" Value="300"/>

<Setter Property="Height" Value="300"/>

</Trigger>

</ControlTemplate.Triggers>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style> 

Parents
No Data
Reply
  • 54937
    Verified Answer
    Offline posted

    I tried putting a 300x300 image into a xamCarouselPanel whose ItemSize was set to 300x300 and it seems to show correctly. Do you have a sample demonstrating the problem you are having? Note, you shouldn't need to retemplate the CarouselPanelItem. e.g.

            <igWindows:XamCarouselPanel>
                <igWindows:XamCarouselPanel.ViewSettings>
                    <igWindows:CarouselViewSettings ItemSize="300,300" />
                </igWindows:XamCarouselPanel.ViewSettings>
                
                <Image Source="\Resources\Images\Bitmap1.bmp" />
            </igWindows:XamCarouselPanel>

     

Children