We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

define XAML Rotator Items

Hello i want to add ItemContents through XAML and not in code behind but i don't figure out how to do this.
I try'd following but with no success. My goal is that i have two rotor pages i.e. with different menu buttons.

     <syncfusion:SfRotator x:Name="rotator" NavigationStripMode="Dots" NavigationStripPosition="Bottom" BackgroundColor="Silver" >         <syncfusion:SfRotatorItem x:Name="ritem1" HorizontalOptions="Fill" VerticalOptions="Fill">             <syncfusion:SfRotatorItem.ItemContent>                 <Grid x:Name="LayoutGrid1" VerticalOptions="Fill" HorizontalOptions="Fill" RowSpacing="0" ColumnSpacing="0" BackgroundColor="Aqua">                     <Grid.RowDefinitions>                         <RowDefinition Height="*" />                     </Grid.RowDefinitions>                     <Grid.ColumnDefinitions>                         <ColumnDefinition Width="*" />                     </Grid.ColumnDefinitions>                     <Label Grid.Column="0" Grid.Row="0" Text="Test1" />                 </Grid>             </syncfusion:SfRotatorItem.ItemContent>         </syncfusion:SfRotatorItem>         <syncfusion:SfRotatorItem x:Name="ritem2" HorizontalOptions="Fill" VerticalOptions="Fill">             <syncfusion:SfRotatorItem.ItemContent>                 <Grid x:Name="LayoutGrid2" VerticalOptions="Fill" HorizontalOptions="Fill" RowSpacing="0" ColumnSpacing="0" BackgroundColor="Red">                     <Grid.RowDefinitions>                         <RowDefinition Height="*" />                     </Grid.RowDefinitions>                     <Grid.ColumnDefinitions>                         <ColumnDefinition Width="*" />                     </Grid.ColumnDefinitions>                     <Label Grid.Column="0" Grid.Row="0" Text="Test2" />                 </Grid>             </syncfusion:SfRotatorItem.ItemContent>         </syncfusion:SfRotatorItem>     </syncfusion:SfRotator>

7 Replies

HM Hemalatha Marikumar Syncfusion Team August 14, 2017 07:19 PM UTC

Hi Richard Grothe

Thanks for contacting Syncfusion Support.

Query : Add ItemContents through XAML.

Yes. It is possible to define the RotatorItem's ItemContent through XAML code. We have created a sample for achieving your requirement. Please download the sample from below link

Sample Link : http://www.syncfusion.com/downloads/support/forum/132076/ze/OUT-974062511 

We have to assign the collection of SfRotatorItem into DataSource of Rotator control to get the view of desired item on Rotator.

Please have a code example from below
 
  
<lib:SfRotator.DataSource>
    <lib:SfRotatorItem>
        <lib:SfRotatorItem.ItemContent>
              <!--Item1--!/>
        </lib:SfRotatorItem.ItemContent>
   </lib:SfRotatorItem>
   <lib:SfRotatorItem>
        <lib:SfRotatorItem.ItemContent>
              <!--Item2--!/>
        </lib:SfRotatorItem.ItemContent>
    </lib:SfRotatorItem>
<lib:SfRotator.DataSource>
  
Please let us know if you have any other concern.

Regards,
Hemalatha M.
 



RA Raymond Au October 6, 2017 07:23 PM UTC

Hi,

I tried the sample link project but just get blank rotator views after I built and ran it.




HM Hemalatha Marikumar Syncfusion Team October 9, 2017 10:05 AM UTC

Hi Raymond,

Thanks for your update.

Query : Get blank rotator view while using Itemcontent in iOS

We have checked the reported issue with our latest Syncfusion version 15.3451.0.33. We were able to reproduce the reported issue in iOS platforms. That is working fine in Android platforms. We have logged the defect report in iOS platforms regarding this issue. A support incident to track the status of this defect has been created under your account.

Please log on to our support website to check for further updates.

Link: https://www.syncfusion.com/account/login?ReturnUrl=%2fsupport%2fdirecttrac%2fincidents/

Regards,
Hemalatha M.



RG Richard Grothe November 15, 2017 10:37 AM UTC

Hello, i try to use the new nov 2017 version. Now i have the problem,
that the datasource property is obsolete and i should use the itemSource.
I have defined views as rotator itmes in xaml

    <syncfusion:SfRotator x:Name="rotator" IsTextVisible="False" EnableSwiping="False" SelectedIndexChanged="rotator_SelectedIndexChanged" NavigationStripPosition="Bottom" BackgroundColor="#FF222d33" DotsBorderColor="Silver" DotPlacement="Default" NavigationStripMode="Dots" UnselectedDotColor="Silver">

        <syncfusion:SfRotator.DataSource>
<
syncfusion:SfRotatorItem x:Name="ritem1" HorizontalOptions="Fill" VerticalOptions="Fill">
            <syncfusion:SfRotatorItem.ItemContent>
                <Grid x:Name="LayoutGrid1" VerticalOptions="Fill" HorizontalOptions="Fill" RowSpacing="0" ColumnSpacing="0" BackgroundColor="Aqua">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
 
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <Label Grid.Column="0" Grid.Row="0" Text="Test1" />
                </Grid>
            </syncfusion:SfRotatorItem.ItemContent>
       </syncfusion:SfRotatorItem>
        </syncfusion:SfRotator.DataSource>

    </syncfusion:SfRotator>

When i change this to <...ItemSource>, i get a error message that there are no items available?
Thank you and greetings



VA Vinnalan Aravazhi Syncfusion Team November 16, 2017 09:58 AM UTC

Hi Richard Grothe,

Thanks for the contacting Syncfusion Support.

We have checked the reported issue "define XAML Rotator Items" from our side. You have tried to use ItemsSource instead of Datasource in the given XAML code, so while replacing the datasource with ItemSource, assign the content to the ItemTemplate API. We have created the sample which shows how to implement ItemsSource with the use of ItemTemplate. Please find the sample from the below link.

Sample: http://www.syncfusion.com/downloads/support/forum/132076/ze/I192402-1595553769 
  
Please let us know if you have any other query.

Regards,
Vinnalan K A. 



RG Richard Grothe November 20, 2017 02:49 PM UTC

Thank you for your sample but this is not for my need.
I am using the rotator as rotating menu not as a data view.

Here is a sample XAML code how i'am using it:

 <syncfusion:SfRotator x:Name="rotator" Grid.Row="0" IsTextVisible="False"
                          NavigationDelay="1000"
                          NavigationDirection="Horizontal"
                          NavigationStripMode="Dots"
                          BackgroundColor="#ececec"
                          NavigationStripPosition="Bottom">

            <syncfusion:SfRotator.DataSource>

                <syncfusion:SfRotatorItem x:Name="ritemZER" HorizontalOptions="Fill" VerticalOptions="Fill" ItemText="ZER">
                    <syncfusion:SfRotatorItem.ItemContent>
                        <Grid BackgroundColor="Red" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">

                            <Grid.RowDefinitions>
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>

                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                        </Grid>
                    </syncfusion:SfRotatorItem.ItemContent>
                </syncfusion:SfRotatorItem>


                <syncfusion:SfRotatorItem x:Name="ritemCRM" HorizontalOptions="Fill" VerticalOptions="Fill" ItemText="CRM">
                    <syncfusion:SfRotatorItem.ItemContent>
                        <Grid BackgroundColor="Blue" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">

                            <Grid.RowDefinitions>
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>

                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                        </Grid>
                    </syncfusion:SfRotatorItem.ItemContent>
                </syncfusion:SfRotatorItem>

            </syncfusion:SfRotator.DataSource>

        </syncfusion:SfRotator>

This depends on a predefined Datasource with SfRotatorItems in XAML (No additional binding in code behind).
Now i get always in code behind, that the DataSource is obsolete and i should use the ItemSource.
How can i change this definition to ItemSource?

thank you and greetings,
Richard





RK Rathana Kumar Sekar Syncfusion Team November 21, 2017 12:40 PM UTC

Hi Richard, 
  
Thanks for your update, 
  
We have checked the reported requirement from our side and while prepared the SfRotator sample using ItemsSource properly we have facing some internal issue's from our side and we have logged bug report for that. The fix will be available our Volume 4 SP1 release, which will be rolled out by the December first week. 
  
Meanwhile you can use the Datasource properly instead of ItemsSource and in code behind it only show warning as obsolute, but which is work as expected. 
  
We will let you know once our volume 4  SP1 release has been rolled out. 
  
Regards, 
Rathanakumar S. 


Loader.
Live Chat Icon For mobile
Up arrow icon