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. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to change the image size from original size in carousel Item?

Platform: WinForms |
Control: Carousel |
Published Date: July 13, 2018 |
Last Revised Date: May 27, 2019 |
.NET Framework: 4

Carousel control displays the image in its original size by default. But we can customize the selected item image size in Carousel by changing the Bitmap image size. The following code demonstrates the same.

 

C#

//Initialize the data table
 
DataTable dt = new DataTable();
 
dt.Columns.Add("col1", typeof(byte[]));
 
//Set Image
 
Image img = Image.FromFile(@"../../Images/10812.jpg");
 
Image img1 = Image.FromFile(@"../../Images/Bird.jpg");
 
Image img2 = Image.FromFile(@"../../Images/10811.jpg");
 
Image img3 = Image.FromFile(@"../../Images/Bird.jpg");
 
DataRow dr = dt.NewRow();
 
DataRow dr1 = dt.NewRow();
 
DataRow dr2 = dt.NewRow();
 
DataRow dr3 = dt.NewRow();
 
//Add image to data table
 
dr["col1"] = imageToByteArray(img);
 
dr1["col1"] = imageToByteArray(img1);
 
dr2["col1"] = imageToByteArray(img2);
 
dr3["col1"] = imageToByteArray(img3);
 
dt.Rows.Add(dr);
 
dt.Rows.Add(dr1);
 
dt.Rows.Add(dr2);
 
dt.Rows.Add(dr3);
 
//Image into carousel
 
SetImagesForCarousel();
 
public byte[] imageToByteArray(System.Drawing.Image imageIn)
{
 
MemoryStream ms = new MemoryStream();
 
imageIn.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg);
 
return ms.ToArray();
 
}
 
‘To Add Carousel dynamically
 
object value = null;
 
private void SetImagesForCarousel()
{
 
foreach (DataRow drow in dt.Rows)
{
 
value = drow["col1"];
 
if (value.ToString().Length > 0)
{
 
byte[] imagenbuffer = (byte[])value;
 
MemoryStream ms = new MemoryStream(imagenbuffer);
 
CarouselImage carouselImage = new CarouselImage();
 
 
carouselImage.ItemImage = Image.FromStream(ms);
 
//To change the dimension of the image.
 
carouselImage.ItemImage = resizeImage(carouselImage.ItemImage, new Size(800, 600));
 
carousel1.ImageListCollection.Add(carouselImage);
 
}
}
 
this.carousel1.ImageSlides = true;
 
this.carousel1.RotateAlways = false;
 
this.carousel1.TransitionSpeed = 1f;
 
this.carousel1.ShowImagePreview = true;
 
carousel1.UseOriginalImageinPreview = true;
 
}
 
public static Image resizeImage(Image imgToResize, Size size)
{
 
return (Image)(new Bitmap(imgToResize, size));
 
}

 

VB

'Initialize the data table

 

Private dt As New DataTable()

 

dt.Columns.Add("col1", GetType(Byte()))

 

'Set Image

 

Dim img As Image = Image.FromFile("../../Images/10812.jpg")

 

Dim img1 As Image = Image.FromFile("../../Images/Bird.jpg")

 

Dim img2 As Image = Image.FromFile("../../Images/10811.jpg")

 

Dim img3 As Image = Image.FromFile("../../Images/Bird.jpg")

 

Dim dr As DataRow = dt.NewRow()

 

Dim dr1 As DataRow = dt.NewRow()

 

Dim dr2 As DataRow = dt.NewRow()

 

Dim dr3 As DataRow = dt.NewRow()

 

'Add image to data table

 

dr("col1") = imageToByteArray(img)

 

dr1("col1") = imageToByteArray(img1)

 

dr2("col1") = imageToByteArray(img2)

 

dr3("col1") = imageToByteArray(img3)

 

dt.Rows.Add(dr)

 

dt.Rows.Add(dr1)

 

dt.Rows.Add(dr2)

 

dt.Rows.Add(dr3)

 

'Image into carousel

 

SetImagesForCarousel() 

 

Public Function imageToByteArray(ByVal imageIn As System.Drawing.Image) As Byte()

 

Dim ms As New MemoryStream()

 

imageIn.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg)

 

Return ms.ToArray()

 

End Function

 

''' <summary>

''' To Add Carousel dynamically

''' </summary>

 

Private value As Object = Nothing

 

Private Sub SetImagesForCarousel()

 

For Each drow As DataRow In dt.Rows

 

value = drow("col1")

 

If value.ToString().Length > 0 Then

 

Dim imagenbuffer() As Byte = DirectCast(value, Byte())

 

Dim ms As New MemoryStream(imagenbuffer)

 

Dim carouselImage As New CarouselImage()

 

carouselImage.ItemImage = Image.FromStream(ms)

 

'To change size of the image.

 

carouselImage.ItemImage = resizeImage(carouselImage.ItemImage, New Size(1500, 600))

 

carousel1.ImageListCollection.Add(carouselImage)

 

End If

 

Next drow

 

Me.carousel1.ImageSlides = True

 

Me.carousel1.RotateAlways = False

 

Me.carousel1.TransitionSpeed = 1F

 

Me.carousel1.ShowImagePreview = True

 

carousel1.UseOriginalImageinPreview = True

 

End Sub

 

Public Shared Function resizeImage(ByVal imgToResize As Image, ByVal size As Size) As

Image

 

Return CType(New Bitmap(imgToResize, size), Image)

 

End Function

 

Screenshot

 

 

Carousel item image displayed in its original size

Figure 1: By default, selected Carousel Item Image displayed in its original size.

 

Carousel item image size changed

Figure 2: Selected Carousel Item Image size has been changed/resized.

 

Samples:

 

C#: CarouselSample

 

VB: CarouselSample

 

2X faster development

The ultimate WinForms UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon