TVML 菜单栏问题

Posted 2023-02-24

【中文标题】TVML 菜单栏问题

【英文标题】：TVML MenuBar issue

【发布时间】：2017-10-28 06:33:51

【问题描述】：

我正在使用 TVML 为 TVOS App 开发模板。该应用程序使用菜单栏。但是只有当用户单击 Home/Back 按钮时，此 MenuBar 才会打开。我只想通过向上滑动来实现它。就像它在 TVOS 的 Youtube 应用程序中一样。 index.xml 的代码（MenuBar 在哪里）：

<?xml version="1.0" encoding="UTF-8" ?>
<document>
  <menuBarTemplate>
    <menuBar>
      <menuItem documentURL="/templates/MyProject/Events.xml" autoHighlight="true">
        <title>Events</title>
      </menuItem>
      <menuItem documentURL="/templates/MyProject/News.xml">
        <title>News</title>
      </menuItem>
      <menuItem documentURL="/templates/MyProject/Programs.xml">
        <title>Programs and Courses</title>
      </menuItem>
        <menuItem documentURL="/templates/MyProject/Settings.xml">
        <title>Settings</title>
      </menuItem>
    </menuBar>
  </menuBarTemplate>
</document>

【参考方案1】：

您需要将功能添加到您的 application.js，例如（来自https://developer.apple.com/library/content/documentation/TVMLKitJS/Conceptual/TVMLProgrammingGuide/AddingaMenuBar.html）：

var baseURL;

function loadingTemplate() 
    var loadingDoc = "<document><loadingTemplate><activityIndicator>
    <text>Loading Page</text></activityIndicator></loadingTemplate>
    </document>";
var parser = new DOMParser();
var parsedTemplate = parser.parseFromString(loadingDoc, "application/xml");
return parsedTemplate;


function alertTemplate() 
    var alertDoc = "<document><alertTemplate><title>Error</title>
<description>Page failed to load</description></alertTemplate></document>";
    var parser = new DOMParser();
    var parsedTemplate = parser.parseFromString(alertDoc, 
    "application/xml");
    return parsedTemplate;


function loadAndPushDocument(url) 
    var loadingDocument = loadingTemplate();
    navigationDocument.pushDocument(loadingDocument);
    var request = new XMLHttpRequest();
    request.open("GET", url, true);

request.onreadystatechange = function() 
    if (request.readyState != 4) 
        return;
    

    if (request.status == 200) 
        var document = request.responseXML;
        document.addEventListener("select", handleSelectEvent);
        navigationDocument.replaceDocument(document, loadingDocument)
    
    else 
        navigationDocument.popDocument();
        var alertDocument = alertTemplate();
        navigationDocument.presentModal(alertDocument);
    
;
request.send();


function updateMenuItem(menuItem, url) 
    var request = new XMLHttpRequest();
    request.open("GET", url, true);

request.onreadystatechange = function() 
    if (request.status == 200) 
        var document = request.responseXML;
        document.addEventListener("select", handleSelectEvent);
        var menuItemDocument = 
menuItem.parentNode.getFeature("MenuBarDocument");
        menuItemDocument.setDocument(document, menuItem)
    
;

request.send();


function handleSelectEvent(event) 
    var selectedElement = event.target;

    var targetURL = selectedElement.getAttribute("selectTargetURL");
    if (!targetURL) 
    return;
    
targetURL = baseURL + targetURL;

if (selectedElement.tagName == "menuItem") 
    updateMenuItem(selectedElement, targetURL);

else 
    loadAndPushDocument(targetURL);
    


App.onLaunch = function(options) 
    baseURL = options.BASEURL;
    var startDocumentURL = baseURL + "templates/menuBar.xml";

    loadAndPushDocument(startDocumentURL)