tvOS:<grid>,锁定标题始终可见(不仅仅是高亮显示)

时间:2016-11-28 15:13:44

标签: javascript tvos apple-tv tvml

我正在使用适用于tvOS的catalogTemplate。在relatedContent区域(由网格填充),我需要锁定来始终显示视频标题。目前,它仅在项目突出显示时显示。有什么方法可以解决这个问题吗?

这是我的TVML。 (来自后端的数据由Mustache.js呈现)

<?xml version="1.0" encoding="UTF-8" ?>
<document>
  <catalogTemplate theme="dark">
    <banner>
      <title style="color: rgb(255, 255, 255); tv-align: left; font-size: 40; padding: 50; font-weight: bold;">Categories</title>
    </banner>
    <list>
      {{#data.categories}}
      <section>
        <listItemLockup>
          <title style="font-size: 30;">{{category}}</title>
          <relatedContent>
            <grid>
              <header>
                <title style="font-weight: bold;">{{category}}</title>
              </header>
              <section>
                {{#videos}}
                <lockup videoURL="{{video_url}}">
                    <img src="{{thumbnail_url}}" width="300" height="169" />
                    <title>{{title}}</title>
                </lockup>
                {{/videos}}
              </section>
            </grid>
          </relatedContent>
        </listItemLockup>
      </section>
      {{/data.categories}}
    </list>
  </catalogTemplate>
</document>

3 个答案:

答案 0 :(得分:1)

我认为设置tv-text-highlight-style样式可以帮助您解决问题:

<title style="tv-text-highlight-style: marquee-on-highlight">{{title}}</title>

可以找到其他选项和样式here

答案 1 :(得分:0)

虽然不理想,但我能够通过使用而不是显示视频标题来实现这一目标。

答案 2 :(得分:0)

我和你的问题一样。我通过将 videourl 替换为 onselect 来解决这个问题。这是一个例子:

    <lockup onselect="playMedia('path to video', 'video')">
          <img src="path to image" width="182" height="274"/>
          <title>Movie 1</title>
    </lockup> 

找到它here

playMedia()是.js文件中的函数,它的代码如下所示。

function playMedia(extension, mediaType) {
    var videourl = baseURL + extension;
    var singleVideo = new MediaItem(mediaType, videourl);
    var videoList = new Playlist();
    videoList.push(singleVideo);
    var myPlayer = new Player();
    myPlayer.playlist = videoList;
    myPlayer.play();
}