How to pass an image to SfRotator when navigating to control page?
You can pass an image to SfRotator when navigating to control page using the following steps:
Step 1: Add necessary assemblies in the PCL, Android, iOS, and UWP projects. Refer to this UG documentation to know more about the assemblies required for adding to your project.
Step 2: Add a new page with button. Bn clicking this button, you can navigate to a new page where the SfRotator control is added.
Step 3: On SfRotator, bind the ItemsSource with the collection that has been passed to the control page during the button click.
XAML code for Main page:
<ContentPage.Content> <StackLayout VerticalOptions="CenterAndExpand"> <Button x:Name="navigateButton" Text="Next Page" Clicked="OnNavigateButtonClicked" HorizontalOptions="Center"/> </StackLayout> </ContentPage.Content>
C# code for Main page:
namespace RotatorControl
{
public partial class MainPage : ContentPage
{
public MainPage(string date)
{
InitializeComponent();
}
async void OnNavigateButtonClicked(object sender, EventArgs e)
{
var contact = new Contact
{
ImageCollection = new System.Collections.Generic.List<RotatorModal>()
{
new RotatorModal("person1.png"),
new RotatorModal("person2.png"),
new RotatorModal("person3.png"),
new RotatorModal("person4.png"),
new RotatorModal("person5.png")
}
};
var secondPage = new SecondPage();
secondPage.BindingContext = contact;
await Navigation.PushAsync(secondPage);
}
}
}
XAML page for SfRotator control page:
<ContentPage.Content>
<StackLayout x:Name="mainStack" HorizontalOptions="Center" VerticalOptions="Center">
<syncfusion:SfRotator x:Name="rotator" SelectedIndex="1" DotPlacement="None" ItemsSource="{Binding ImageCollection}" NavigationDirection="Horizontal" BackgroundColor="#ececec" NavigationStripPosition="Left">
<syncfusion:SfRotator.ItemTemplate>
<DataTemplate>
<Image Source="{Binding Image}"/>
</DataTemplate>
</syncfusion:SfRotator.ItemTemplate>
</syncfusion:SfRotator>
</StackLayout>
</ContentPage.Content>
Output Image:
Main Page
Second page
|
You can download the sample for passing an image to SfRotator when navigating to control page from this link: Sample
