Articles in this section
Category / Section

How to render images loaded in PCL files as an embedded resource to Carousel

1 min read

We can access the images of Carousel control anywhere in the project. The following Knowledge base task link will help you to access the images of carousel control in corresponding project

 

https://www.syncfusion.com/kb/7538/how-to-render-images-within-the-application-in-carousel-in-different-platforms

 

And also we can access the images in all platforms by only adding the images are in PCL file with build action of “Embedded Resource”.

 

Project

 

The following code example is getting the images from PCL folder

C#

public partial class CarouselFeatureSample : ContentPage
{
public CarouselFeatureSamplePage()
{
    InitializeComponent();
 
    // Initialize of carousel control
 
    SfCarousel sfCarousel = new SfCarousel();
 
    if (Device.OS == TargetPlatform.Android)
    {
        sfCarousel.ItemWidth = 170;
        sfCarousel.ItemHeight = 250;
    }
    if (Device.OS == TargetPlatform.iOS)
    {
        sfCarousel.ItemWidth = 150;
        sfCarousel.ItemHeight = 300;
    }
 
 
    ObservableCollection<SfCarouselItem> collectionOfItems = new ObservableCollection<SfCarouselItem>();
    collectionOfItems.Add(new SfCarouselItem() { ImageName = "/Users/customer/Documents/CarouselFeatureSample/CarouselFeatureSample/image1.png" });
    collectionOfItems.Add(new SfCarouselItem() { ImageName = "/Users/customer/Documents/CarouselFeatureSample/CarouselFeatureSample/image1.png" });
    collectionOfItems.Add(new SfCarouselItem() { ImageName = "/Users/customer/Documents/CarouselFeatureSample/CarouselFeatureSample/image1.png" });
    collectionOfItems.Add(new SfCarouselItem() { ImageName = "/Users/customer/Documents/CarouselFeatureSample/CarouselFeatureSample/image1.png" });
    collectionOfItems.Add(new SfCarouselItem() { ImageName = "/Users/customer/Documents/CarouselFeatureSample/CarouselFeatureSample/image1.png" });
    collectionOfItems.Add(new SfCarouselItem() { ImageName = "/Users/customer/Documents/CarouselFeatureSample/CarouselFeatureSample/image1.png" });
 
};
var carouselModelDataTemplate = new DataTemplate(() =>
{
    var grid = new Grid();
    var nameLabel = new Image();
    nameLabel.SetBinding(Image.SourceProperty, "Image");
    grid.Children.Add(nameLabel);
    return grid;
});
 
// Assign the collection of carousel to datasource
sfCarousel.ItemTemplate = carouselModelDataTemplate;
sfCarousel.DataSource = carouselModel; 
 
this.Content = sfCarousel;
 
}
} 
 
public class CarouselModel
{
public CarouselModel(string imagestr)
{
    Image = imagestr;
}
private string _image;
 
public string Image
{
    get { return _image; }
    set { _image = value; }
}
}
 

 

 

 

 

 

 

Screenshot

Carousel

 

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied