How to handle the numerous data in Xamarin.iOS Carousel?
Carousel control provides the virtualization support to handle the numerous data. It has been achieved by one of the LoadMore options. In that LoadMore , instead of loading all data, it will split that using LoadMoreItemsCount and render that into our view with LoadMore view. By the way of tapping that LoadMore view (By default there will be LoadMore Label, we have option to customize that LoadMore view), it will another set of items with previous loaded data.
Properties are used to achieve LoadMore options
Properties | Data Type | Default Value | Usage |
AllowLoadMore | Boolean | false | Enable or disable LoadMore options in carousel control |
LoadMoreItemsCount | int | 3 | It will intimate the number of items will be in carousel view. |
LoadMoreView | UIView | null | We can customize the LoadMore view by using this property. |
ItemsSource | IEnumerable | null | To load the custom class collection of instead of collection of SfCarouselItem |
DrawView event is used to pass the custom view into your carousel view. It holds the following arguments.
- Index – Gets the indexed of carousel item.
- View – Gets and Sets the custom view of carousel’s item.
- Item – Gets the indexed carousel item.
The following code example illustrates the way to use the LoadMore feature on carousel control.
In ViewDidLoad:
C#
public override void ViewDidLoad()
{
base.ViewDidLoad();
SFCarousel sfCarousel = new SFCarousel();
sfCarousel.Frame = new CoreGraphics.CGRect(0, 150, 400, 400);
ObservableCollection<string> list = new ObservableCollection<string>();
for (int i = 1; i < 100000; i++)
{
list.Add("Item " + i.ToString());
}
sfCarousel.ItemWidth = 150;
sfCarousel.ItemHeight = 150;
sfCarousel.AllowLoadMore = true;
sfCarousel.LoadMoreItemsCount = 4;
UILabel loadmore1 = new UILabel() { TextColor = UIColor.White, Text = "Load More...", Font = UIFont.FromName("Helvetica-Bold", 13f), TextAlignment = UITextAlignment.Center };
UIView loadView1 = new UIView();
loadView1.BackgroundColor = UIColor.Red;
loadmore1.Frame = new CoreGraphics.CGRect(12, 61, 150, 17);
loadView1.AddSubview(loadmore1);
sfCarousel.LoadMoreView = loadView1;
sfCarousel.ViewMode = SFCarouselViewMode.SFCarouselViewModeLinear;
sfCarousel.ItemsSource = list;
sfCarousel.DrawView += (object sender, DrawViewEventArgs e) =>
{
UIView carouselView = new UIView();
carouselView.BackgroundColor = UIColor.Red;
carouselView.Frame = new CoreGraphics.CGRect(0, 0, 150, 150);
UILabel iconLabel = new UILabel();
iconLabel.Frame = new CoreGraphics.CGRect(35, 30, 80, 80);
iconLabel.Text = (sfCarousel.ItemsSource as ObservableCollection<string>)[e.Index];
iconLabel.TextColor = UIColor.White;
iconLabel.TextAlignment = UITextAlignment.Center;
carouselView.AddSubview(iconLabel);
e.View = carouselView;
};
View.AddSubview(sfCarousel);
// Perform any additional setup after loading the view, typically from a nib.
}
Sample:
https://www.syncfusion.com/downloads/support/directtrac/general/ze/LoadMoreSampleiOS717074124
Output Will Be Like,
|
Conclusion
I hope you enjoyed learning about how to handle the numerous data in Carousel using LoadMore options.
You can refer to our Xamarin.iOS Carousel feature tour page to know about its other groundbreaking feature
representations and documentation, and how
to quickly get started for configuration specifications. You can also
explore our Xamarin.iOS Carousel example
to understand
how to create and manipulate data.
For current customers, you can check out
our components from the License and Downloads page. If you are new to Syncfusion, you can try our
30-day free
trial
to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!
