[00:00] In this lesson, we'll talk about the Carousel component. The Carousel is a way to show one or more views based off of user selection. We'll begin by heading over to the perspective component pallet and under the Embedding category we'll grab a Carousel component and place that on the view. We'll start with the view's property. We see element zero which I'll expand and there's a whole host of properties down here. The view's array allows you to specify one or more views as well as some configurations associated with them. The view path property determines which view should be positioned at this element. We can click the drop down and see a list of available views in our project. I'll select View A and press okay. We now see there's a view inside of the Carousel. If we add more array elements, we can specify another view to be placed inside of the Carousel. So I'll select View B here and click okay. We now see on the component there are some dots at the bottom as well as some arrows on the side. These allow us to look at the different views. So if we enter preview mode by clicking the play button at the top of our designer, I can click and drag my views. I can also click on the dots at the bottom or by clicking on the arrows. Now you may notice that there's a slight delay in the transition, that's determined by the transition speed property. The value here is the number of milliseconds it takes to transition. So if we reduce the value on the property, it transitions faster. If we increase the value on this property, it transitions slower. Notice I have scroll bars in my views here. That's due to the configuration of my views. Right now the Carousel is trying to use the default width and height. We can change this or override it with the use default views properties. So if I disable these properties, it means the views have to use the layout and dimensions of the Carousel. Now back on the views property, let's add another array element. I'll click the drop down again and under my smaller views folder, I'll select View C, so a third view and hit okay. Now that I have three, we'll scroll down in the property editor and talk about the slides to show property. If I increase this, my component now shows multiple views simultaneously. Although, I still transition one at a time. I'll set this back to one for right now. Now let's talk about view parameters or viewparams. View C here has a label as well as a view parameter. If we head back to View C at the bottom of the designer and we have the view selected, we can see under the params category I have a property called display with a value of hello. The label on this view has its text property bound to display. So when we're working back with our Carousel, if we take the designer back into design mode I can select the Carousel. Under the views property, we'll expand element two, which has View C inside of it and we see this view params property. If I expand this, we can add an object member. Display was a value member so I'll add a value member and I'll type in the name of my view param, which was display. Once I hit enter we can see that the value on the property and the Carousel are now synchronized so I can type something here and it shows up on the view inside of the Carousel. So now because we have these view params I can place a binding on display here and have its value automatically update based on user selection or some other criteria. So that was a brief overview of the Carousel component. It's a very easy way to show multiple views within a very small amount of space.