Documentation Archive


Apple TV Markup Language Reference

On This Page


Use the oneup template (oneupTemplate) to display a single, full-screen image. Users can navigate left or right on the remote to select another image. Activating an up action on the remote will shrink the image and allow a description to be displayed. Figure 12-2 shows the basic layout for a oneupTemplate page. The default theme for a oneup template is dark.

Figure 12-1Oneup template image: ../Art/ATV_temps_oneup_2x.png

Main Elements of the Oneup Template

Listing 12-1 shows the main elements in TVML format, and Table 12-1 describes the main elements.

Listing 12-1oneupTemplate TVML format
  1. <oneupTemplate>
  2. <section>
  3. <lockup>
  4. <img />
  5. <title>…</title>
  6. <row>
  7. </row>
  8. </lockup>
  9. <lockup>
  10. </lockup>
  11. </section>
  12. </oneupTemplate>

Table 12-1oneupTemplate element descriptions

Element name



The image to be displayed on screen.


A single image and related text.


Subtitle information relating to the selected image.


Multiple lockup elements, each of which contains an item to be displayed.


The title to be displayed when a user selects an image.

Oneup Template Example

Listing 12-2 shows the TVML for a oneupTemplate example. The example shows a full screen image, with information about the image displayed along the bottom of the screen when the user zooms into the image. Figure 12-2 shows the output for the example.

Listing 12-2oneupTemplate example TVML
  1. <document>
  2. <oneupTemplate mode="oneup caption" allowsZooming="true">
  3. <section>
  4. <lockup>
  5. <img src="path to images on your server/Car_Movie_1920x1080.png" />
  6. <title>WWDC Roadtrip</title>
  7. <row>
  8. <subtitle>San Francisco</subtitle>
  9. <subtitle>June 8, 2015</subtitle>
  10. </row>
  11. </lockup>
  12. <lockup>
  13. <img src="path to images on your server/Beach_Movie_1920x1080.png" />
  14. <title>Beach time</title>
  15. <row>
  16. <subtitle>Santa Cruz</subtitle>
  17. <subtitle>May 1, 2015</subtitle>
  18. </row>
  19. </lockup>
  20. <lockup>
  21. <img src="path to images on your server/Space_Movie_1920x1080.png" />
  22. <title>Spaced out</title>
  23. <row>
  24. <subtitle>Space station</subtitle>
  25. <subtitle>July 15, 2015</subtitle>
  26. </row>
  27. </lockup>
  28. </section>
  29. </oneupTemplate>
  30. </document>
Figure 12-2oneupTemplate example output image: ../Art/oneupTemplateSS_2x.png