TVML-TVOS Сделать более 1 шаблона вместе

Question

Я недавно начал работать с TVML/TVJS и не уверен, что делать с приведенным ниже вопросом.

Проблема под рукой заключается в использовании нескольких шаблонов на одной странице при рендеринге страницы, т.е. я хочу добавить MenuBarTemplate поверх ListTemplate и аналогично.

Но если я добавлю оба на странице, он рендерит только ListTemplate, а не MenuTemplate

Вот фрагмент кода:

<menuBarTemplate>
  <menuBar>
     <menuItem id="navigation_top_movies" data-identifier="list">
        <title>Top Movies</title>
     </menuItem>
     <menuItem id="navigation_genres" data-identifier="index">
        <title>Genres</title>
     </menuItem>
     <menuItem id="navigation_search" data-identifier="search">
        <title>Search</title>
     </menuItem>
     <menuItem id="navigation_edit" data-identifier="edit">
        <title>Edit</title>
     </menuItem>
     <menuItem id="navigation_settings_add" data-identifier="add_settings">
        <title>Add Settings</title>
     </menuItem>
  </menuBar>
</menuBarTemplate>
<productTemplate>
  <background>
  </background>
  <banner>
     <infoList>
        <info>
           <header>

           </header>
        </info>
     </infoList>
     <stack>
        <title>WWDC Road Trip</title>
        <row>
           <text><badge src="resource://tomato-fresh"/> 99%</text>
           <text>1hr 54min</text>
           <text>Comedy</text>
           <text>2015</text>
           <badge src="resource://mpaa-pg" class="badge" />
           <badge src="resource://cc" class="badge" />
        </row>
        <description allowsZooming="true" moreLabel="more">An aspiring developer gets a ticket to WWDC, but cant afford to fly there. Now he needs to get across country in time for the keynote, and the only person who can help him is his slacker roommate.</description>
        <text>Language information can go here</text>
        <row>
           <buttonLockup>
              <badge src="resource://button-preview" />
              <title>Preview</title>
           </buttonLockup>
           <buttonLockup type="buy">
              <text>$9.99</text>
              <title>Buy</title>
           </buttonLockup>
        </row>
     </stack>
     <heroImg src="path to images on your server/Car_Movie_720x1080.png" />
  </banner>

  </productTemplate>

Любая помощь в этом была бы отличной. Благодарю.

Answer 1

Вы можете иметь только один шаблон на страницу. Приходя в menuBarTemplate это примерно то же самое, но фреймворк внутренне отображает выбранную вкладку, показывая как меню, так и productTemplate

Например, принимая ваш menuBarTemplate и установка шаблона для первого элемента меню:

<menuBarTemplate>
  <menuBar>
     <menuItem id="navigation_top_movies" data-identifier="list" template="${this.BASEURL}templates/productTemplate.xml.js">
        <title>Top Movies</title>
     </menuItem>
     <menuItem id="navigation_genres" data-identifier="index">
        <title>Genres</title>
     </menuItem>
     <menuItem id="navigation_search" data-identifier="search">
        <title>Search</title>
     </menuItem>
     <menuItem id="navigation_edit" data-identifier="edit">
        <title>Edit</title>
     </menuItem>
     <menuItem id="navigation_settings_add" data-identifier="add_settings">
        <title>Add Settings</title>
     </menuItem>
  </menuBar>
</menuBarTemplate>

А потом в отдельном файле под названием productTemplate.xml.js:

var Template = function() { return `<?xml version="1.0" encoding="UTF-8" ?>
<document>
<productTemplate>
  <background>
  </background>
  <banner>
     <infoList>
        <info>
           <header>

           </header>
        </info>
     </infoList>
     <stack>
        <title>WWDC Road Trip</title>
        <row>
           <text><badge src="resource://tomato-fresh"/> 99%</text>
           <text>1hr 54min</text>
           <text>Comedy</text>
           <text>2015</text>
           <badge src="resource://mpaa-pg" class="badge" />
           <badge src="resource://cc" class="badge" />
        </row>
        <description allowsZooming="true" moreLabel="more">An aspiring developer gets a ticket to WWDC, but cant afford to fly there. Now he needs to get across country in time for the keynote, and the only person who can help him is his slacker roommate.</description>
        <text>Language information can go here</text>
        <row>
           <buttonLockup>
              <badge src="resource://button-preview" />
              <title>Preview</title>
           </buttonLockup>
           <buttonLockup type="buy">
              <text>$9.99</text>
              <title>Buy</title>
           </buttonLockup>
        </row>
     </stack>
     <heroImg src="path to images on your server/Car_Movie_720x1080.png" />
  </banner>

  </productTemplate>
</document>`
}

По умолчанию будет отображена первая вкладка строки меню. Если вы предоставите шаблоны для других вкладок, вкладка изменится автоматически при сохранении строки меню.