lightning:carousel example

In this blog, I am going to explain how to use lightning: carousel example. Here I am using to display the user chatter profile image to display as the carousel.A lightning: carousel component displays a series of images in a single container. This example creates a basic carousel with three images. Auto-scrolling is enabled by default, and every image stays active for 5 seconds before moving on to the next one.

Apex Class

public class UserProfileController {

    public static List<User> getUserProfiles(){
        return [Select Id,Address ,BannerPhotoUrl,CompanyName,Department,Email,FirstName , LastName ,FullPhotoUrl from User];

Lightning Component 

<aura:component controller="UserProfileController">
    <aura:attribute name="users" type="List" />
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    <lightning:carousel >
        <aura:iteration items="{!v.users}" var="user">
                                     src = "{!user.FullPhotoUrl}" 
                                     header = "{!user.FirstName}" 
                                     description = "{!user.AboutMe}" 
                                     alternativeText = "{!user.LastName}"></lightning:carouselImage>


    doInit : function(component, event, helper) {
        var action = component.get("c.getUserProfiles"); 
        action.setCallback(this, function(response){
            var state = response.getState();
            if (component.isValid() && state === "SUCCESS") {
                var retrunRes = response.getReturnValue();
                component.set("v.users" ,retrunRes );

Simple App for testing

<aura:application extends="force:slds">
    <c:CarouselExample />