# Quick XAML Reference

## Content



This topic is dedicated to providing a quick overview of the XAML used to complete various [C1MediaPlayer](/componentone/api/wpf/online-mediaplayer/dotnet-framework-api/C1.WPF.MediaPlayer.4.6.2/C1.WPF.MediaPlayer.C1MediaPlayer.html) tasks. For more information, see the [C1MediaPlayer Task-Based Help](/componentone/docs/wpf/online-mediaplayer/C1MediaPlayer_Task-Based_Help) section.

The XAML markup in this section illustrates how to create a **C1MediaPlayer** control with three media items. Each media item contains three chapters. The control is themed with the **RainierOrange** theme, which is included as part of the Studio package.

```xml
<!—Theme->        
<c1:C1ThemeRainierOrange>
<!—MediaPlayer Markup->                    
     <c1:C1MediaPlayer HorizontalAlignment="Left" Margin="10,10,0,0" Name="c1MediaPlayer1" VerticalAlignment="Top" Height="329" Width="400">
<!—First MediaItem->                    
          <c1:C1MediaItem   MediaSource="http://ia600300.us.archive.org/22/items/DasKabinettdesDoktorCaligariTheCabinetofDrCaligari/The_Cabinet_of_Dr._Caligari_512kb.mp4" Title="The Cabinet of Dr. Caligari" NaturalDuration="02:00:00">
<!—First MediaItem's  Chapters->         
               <c1:C1MediaChapter Title="Title Sequence" Position="00:01:00" />
               <c1:C1MediaChapter Title="Intermission" Position="00:35:00" />
               <c1:C1MediaChapter Title="End Credits" Position="01:55:00" />
     </c1:C1MediaItem >
<!—Second MediaItem->         
     <c1:C1MediaItem MediaSource="Dracula.mp4" Title="Dracula" NaturalDuration="02:35:00">
<!—Second MediaItem's  Chapters->         
          <c1:C1MediaChapter Title="Title Sequence" Position="00:00:20" />
          <c1:C1MediaChapter Title="Intermission" Position="00:32:00" />
          <c1:C1MediaChapter Title="End Credits" Position="02:32:00" />
     </c1:C1MediaItem>
<!—Third MediaItem->         
     <c1:C1MediaItem MediaSource="Frankenstein.mp4" Title="Frankenstein" NaturalDuration="01:38:00">
<!—Third MediaItem's  Chapters->         
          <c1:C1MediaChapter Title="Title Sequence" Position="00:00:30" />
          <c1:C1MediaChapter Title="Intermission" Position="00:42:00" />
          <c1:C1MediaChapter Title="End Credits" Position="01:35:00" />
     </c1:C1MediaItem>
</c1:C1MediaPlayer>
</c1:C1ThemeRainierOrange>
```

At startup, the **C1MediaPlayer** will look like this:

![](https://cdn.mescius.io/document-site-files/images/35d97b39-ed23-40ca-bb1b-90a2e9178ac1/graphics/narrative/xamlref_mediaplayeratstartup.png)

If you click the **Item List** button, you will see the three items that were added to the list:

![](https://cdn.mescius.io/document-site-files/images/35d97b39-ed23-40ca-bb1b-90a2e9178ac1/graphics/narrative/xamlref_mediaplayeritemlist.png)

And if you click the **Chapter List** button, you will see the chapter in the item you are currently on:

![](https://cdn.mescius.io/document-site-files/images/35d97b39-ed23-40ca-bb1b-90a2e9178ac1/graphics/narrative/xamlref_mediaplayerchapterlist.png)