Search code examples
javascripttvosapple-tvtvmltvjs

TVML Creating Dynamic Templates


Is it possible to create dynamic templates/pages with TVML without relying on Apple's standard templates?

Say I'd like to create a template that has 2 images next to each other and on top of these images a couple of textfields that I want to position based on some parameters.

Could I create a template/view i UIKit and populate it from JS as an alternative?

How would I go about this?


Solution

  • I think you're talking about a mix of "divTemplate", which exists precisely to let you use whatever layout you want with no predefined structure or placement, and using native code to define your own custom TVML elements.

    From Apple's documentation, "There is no built-in layout for the contained elements. Use the style properties listed in TVML Styles to personalize the elements placed inside of the div template." It's for completely free-form by-hand element layout.

    As for the other path: the way to add a UIKit view to TVML is by defining a custom element. That's how the TVML system knows where your custom view is supposed to go within the TVML "page". If you go down that path, you'll want to read up on TVMLKit, not just TVML and TVJS. You make a class that conforms to the TVInterfaceCreating protocol, potentially create a subclass of TVViewElement (if one of the existing classes isn't enough for your needs), register the element with [TVElementFactory registerViewElementClass: [MyTVViewElement class] forElementName:@"mycustomelement" ], and register your TVInterfaceCreating class with [[TVInterfaceFactory sharedInterfaceFactory] setExtendedInterfaceCreator: myInterfaceCreator].

    So the way I see it, you could use a divTemplate and a ton of carefully crafted style info to do it entirely without any custom code or UIView objects, or you could make one or a small number of custom elements for the part you're talking about. I do not know if you can make a new "template" that is itself a custom element, however -- that's something I haven't tried yet.

    If you decide to go down the native code path and you find that the TVViewElement-related APIs aren't rich enough for the coordination you want between JavaScript and your custom view, you may also need to read up on the JavaScriptCore APIs. Those let you expose arbitrary native-backed functionality via JavaScript, via the APIs on JSContext. In a TVML app, a good place to hook into all this is by implementing the - appController:(TVAppController *) evaluateAppJavaScriptInContext:(JSContext *) method from the TVApplicationControllerDelegate protocol.