Tag: Apple TV

立即响应Native和Apple TV: 我总是检查React Native中每个发行版的注释。前几天，我对v0.36.0-rc.0中一个有趣功能的宣布感到惊讶：对Apple TV的支持。我从查看提交（由dlowder-salesforce所做）开始，我发现UIExplorer示例项目已经对此提供支持，但是由于状态栏存在问题而无法正常工作，我认为这是因为没有t状态栏。在分析了对项目所做的更改并阅读了github报告的有关该主题的票证之后，我找到了启用Apple TV的必要步骤。好的，现在不用多说，这里是将Apple TV支持添加到新的React Native项目的步骤。我将在步骤中尽可能详细：创建一个新项目 react-native初始化apple_tv_example 使用package.json中的候选发布者用以下命令替换本机版本（在我的情况下为^ 0.35.0）： git：//github.com/facebook/react-native.git#v0.36.0-rc.0 注意：由于它将是版本的一部分，因此将来将是可选的。通过运行安装对软件包所做的更改我注意：您会收到一个 UNMET PEER DEPENDENCY 错误-没关系。要验证软件包是否已正确安装，请在 node_modules / react-native 下的文件中查找对 TARGET_OS_TV的引用，应该有很多。通过在xCode上转到“文件>新建>目标”，然后选择“ tvOS>应用程序>单视图应用程序”，将tvOS应用程序添加到项目中。通过在Linked Frameworks and Libraries中按“ +”将所有tvOS库链接到新目标。在工作区中，搜索包含“ tvOS”的所有库，然后添加它们。通过添加来添加对ObjC和LC ++的支持 $（继承）-ObjC -lc ++ 到“构建设置”下的“其他链接器标志”。删除为新目标创建的文件夹内的所有文件和文件夹，但保留Info.plist。通过删除Main storyboard文件的基本名称（假设我们不会使用任何Storyboard）并添加App Transport […]

tvOS应用开发挑战：焦点效果和无限轮播: 苹果公司的tvOS基于iOS 9，并使用许多相同的框架和技术，但是为苹果电视构建应用程序会遇到一些独特的挑战。由于用户是在整个房间而不是在手掌之间与设备进行交互，因此要使之与Apple的本机tvOS应用程序一样引人入胜且令人身临其境，就需要开发人员和设计师进行创造性的思考。在该平台上体验应用程序在很大程度上受到焦点引擎的影响，焦点引擎是UIKit中控制焦点和焦点移动的系统。在为客户构建Apple TV应用程序时，我们在聚焦引擎方面遇到了两个主要挑战：聚焦效果和无限轮播。我们还开发了一些创造性的解决方案。焦点效果我们的一位客户委托我们开发一款Apple TV应用，该应用以令人难忘的设计呈现独特的内容。我们知道它需要充满活力和内在。特别是，我们要确保所有交互元素都使用动画焦点效果。 Apple TV上的焦点效果类似于将鼠标指针悬停在网页上时发生的情况。当您的拇指在Siri远程触摸板上滑动时，焦点将在电视屏幕周围缩放。苹果内置应用程序中的焦点效果始终是交互式的。轻轻地在触摸板上摇动手指，使聚焦的元素在周围摆动，就好像您直接接触它一样。也有很酷的三维效果，有助于整体体验。与iOS（您的手指直接在屏幕上轻敲）不同，tvOS使用焦点引擎作为手指在触摸板上位置的代理。聚焦效果，尤其是交互式摆动动画，将您的眼睛吸引到聚焦的元素上，使应用程序更易于使用和更有趣。考虑一下本机电影应用程序中的以下示例：借助交互式动画，可以毫无误解地关注哪个电影海报。挑战我们的目标是在客户的应用程序中实现与Apple自己的应用程序相同或更好的焦点效果。但是，当我们开始从事该项目时，我们遇到了一个大问题。除了静态矩形图像，没有直接的方法可以向任意UI元素添加交互式焦点效果。开箱即用，不支持其他类型的元素（圆形头像，文本框，按钮，嵌入式视频等）。经过大量的研究和实验，我们意识到，再现苹果标准效果所需的所有原材料都已经存在。我们只需要找到正确的食谱。挑战是双重的。首先，我们需要将Apple的所有焦点效果分解为基本元素，编写较小的代码块来重新创建每个代码。其次，我们需要一种混合和匹配基本效果的方法，将它们组合成最适合每种特定类型的UI元素的分组。解决方案通过组合从iOS移植到tvOS的许多较旧的API并将它们包装在自定义框架中，我们构建了所需的工具，可为客户应用程序中的每个视图添加焦点效果。我们甚至可以调整细微的方面，例如投影半径和最大倾斜角度，以达到完全适合客户设计目标的效果，而不是有限的内置选项的“一刀切”方法。虽然我们无法向您展示客户的实际应用程序，但我们可以向您展示测试项目中的一些示例。以下是“扁平化”视图层次结构的示例。每个单元格都有一个圆角背景图像，一个大表情符号字符文本标签和一个标题标签。所有这三个元素都正在一致地移动，就好像它们只是一个视图一样。我们竭尽全力使焦点效果与Apple自己的效果完全匹配，因此用户立即就可以熟悉该应用程序。只有受过训练的开发人员的眼睛才能看到创建这些效果所付出的隐藏额外努力。这是我们如何创建具有多个视图的自定义视差效果的另一个示例。每个单元格都有一个大文本标签，显示单个表情符号字符，并在其后面提供许多图像视图以创建隧道效果。这些视图可能是任何东西：更多文本标签，嵌入式视频播放器，动画GIF。我们的自定义框架允许我们组合所需的任何元素，独立控制每一层的视差效果。有了这个自定义框架，我们就可以调整每个元素的详细信息，直到看起来完全符合客户希望的方式为止。能够说“是的，我们可以做到”，而不是“对不起，那太难了”，这真的很不错。无限轮播另一个客户要求我们进行设计，该设计在其应用程序主屏幕顶部包括“无限轮播”。一个示例就是Apple TV上“电影”应用顶部的轮播：用户可以向右或向左滚动而不到达结尾。内容会不断重复，直到您希望滚动为止。苹果的旋转木马是很好的灵感来源，但我们希望客户得到更好的东西。我们的设计目标包括： […]

苹果电视案例研究：我们如何保持领先地位，以及我们在此过程中学到的知识: 今年早些时候，苹果公司在主题演讲中向全球观众分享了我们的PLUS7应用程序，以作为卓越典范，这是工程团队引人入胜的旅程的结晶。当Apple宣布推出第四代Apple TV时，我们知道它将非常适合扩展我们的PLUS7产品。 Apple TV简单而优雅的体验非常适合以允许用户直接获得所需内容的方式进行设计。基于我们对iOS和现有Apple框架的了解，开发tvOS应用程序的过程非常迅速，并且确实使我们的工程师能够在更大的屏幕上重新定义PLUS7观看体验方面取得突破。迅速随着Swift仍在不断发展，选择使用它并不是没有一定的风险和开销。经过评估，我们认为它已经足够成熟，可以在生产应用程序中使用，这将是我们前进的道路。尽管我们可以从iOS实现中重用Objective-C代码，但我们还是决定从头开始，并且tvOS构建中的代码是100％Swift。我们现在认为这一决定是一个好决定；甚至我们的测试版本也非常稳定，并且代码行比其iOS版本少得多。此外，我们现在可以在iOS版本的未来版本中使用可以说更好的Swift代码。建造我们最初有一个应用程序的原型版本，该应用程序是在业余时间构建的，没有设计团队的投入。最终，随着构建的进行，迭代了该版本。我们遇到的主要问题之一是与tvOS或位码不兼容的第三方SDK。有了一点点建议，我们就能解决其中的大多数问题，但我们用于视频广告的SDK除外。广告在iOS和Android上，我们使用Google的IMA SDK进行视频广告，目前与tvOS不兼容。显然，在没有视频广告的情况下针对苹果电视推出PLUS7对我们的业务而言并不是可行的策略。因此，我们决定自己在Swift中实施VAST规范。我们看了一些（旧的）开源VAST实现，不幸的是结果证明不合适。乍一看，VAST实施看起来相当简单。但是，事实证明，这比乍一看要复杂得多。视频包含“提示点”，这些提示指示何时播放广告时段。有三种类型的广告集：前片（在流之前播放），中片（每个视频在流中间播放几个）和后片（在流之后播放）。每个提示点都映射到一个广告“ pod”。广告连播由许多广告组成。因此，第一个预卷可能包含一个15秒的广告。第一个插播广告连播可能包含4个不同长度的广告（15到60秒之间），接下来的5个不同长度的广告，依此类推。视频开始播放时，我们进行一次查询，该查询返回每个广告连播中的每个元素。但是，每个广告都是对广告服务器的递归广告调用，您必须不断查询它，直到获得实际的广告素材。第一台广告服务器可能没有内容，但会转到另一台广告服务器，依此类推。另外，遍历的每个广告服务器将为播放期间可能发生的每个事件（例如，播放，播放，暂停，停止等事件的每个四分位数）添加自己的跟踪URL。此外，沿着特定路径向下移动广告服务器可能会导致无限循环（！）或播放错误，在这种情况下，将应用特定规则。正确执行VAST规范至关重要，因为我们的业务收入取决于此。在1.0版的开发上花费的大部分时间都花在了这项工作上。视频播放器在向用户提供无缝体验的同时播放内容和视频广告（是独立的视频流）并不是一件容易的事。每个视频广告都会提前获取，存储在列表中，然后传递给tvOS API提供的视频控制器。在每个广告序列之后，在不同的控制器中暂停和恢复内容。向前寻找一个或多个“提示点”意味着我们必须在广告连播中播放最后一组广告，依此类推：如果足够耐心的话，用户也可能会进入帖子列表。我们会尽力提前获取所需的数据。只要我们有足够的信息来播放预告片，我们就会做，然后继续执行对特定广告的其余请求，以使用户不必等待每次广告播放时就发生这种情况。用户界面由于遥控器的特性，Apple TV体验具有一些独特的功能。我们的第一个迭代具有多个选项卡的网格视图和一个主视图/详细视图。它起作用了，但是有一个明显的缺点，就是必须过度垂直滚动才能简单地浏览。得到反馈（并亲自使用该应用程序）后，我们大大简化了导航，并在主屏幕上创建了多个水平滚动收集视图，并在“搜索”屏幕上快速过滤了已知内容。 […]

我在App Store的第一个应用程序: 从前，Dropbox是我生活中的重要组成部分。将我一生中将近4年以上的照片和视频存储在Dropbox中。使用iCloud几年后，我逐渐习惯了Apple的云存储服务。我经常会想念一些旧照片，包括女儿在婴儿月份的照片。我可以在电话上安装Dropbox客户端，因此我可以看到但也经常觉得我希望它们在具有Apple提供的出色用户体验的漂亮大屏幕上显示。 🤓 因此，我在Apple TV上打开了我的App Store，开始搜索是否可以使用JUST FOR BROWSING！照片和视频。好吧，我找到了几个可以满足我需求的应用程序。但是臭虫！有支付。来吧，我只是为了浏览照片而必须购买此商品吗？好吧，答案是肯定的。如果您感兴趣的是多少钱–大约是5.99美元或4.99美元。是的，我知道喝一杯咖啡是钱，而且我是个紧屁股。 judge不要判断！！无论如何，我拒绝付那笔钱。因此，我开始研究Dropbox API和Swift编程语言。在几个小时内，我有了一个可以工作的原型，可以完成我想要的事情。万岁！ 🎉所以我解决了我的问题。我现在可以使用它。 🤘 因此，我很兴奋，并告诉了我的妻子和一些朋友。其中一位建议运送它。哪里？！ 🧐到太平洋！不，我在开玩笑！ 😁当然可以到App Store。好吧，我认为这是个好主意，然后我开始开发我的第一个应用程序。在业余时间里，我一直在发展自己的想法，现在我的附带项目终于在市场上出现了。但是，嘿，我免费提供它。我解决了我的问题，为什么我不能解决其他人的问题。我敢肯定，还有另一个像我这样的疯狂人，在世界的另一端也想免费在Apple TV上观看他/她的照片！任何人都想重新发现他们的旧照片或视频，或者只是想浏览。好了，他们现在可以下载它。如果您在App Store（Apple TV的App Store，您在其他任何地方都看不到）中搜索“云”，那么它被称为Cloud Client。您将在下面看到这个丑陋的图标。如果您读到现在为止，非常感谢！ 🙏

将TVML和UIKit组合为Apple TV: 如许多iOS开发人员所知，UIKit提供了强大的API，可创建可自定义的交互式应用程序。当来自iOS背景时，使用UIKit创建您的AppleTV应用程序似乎不费吹灰之力… 但是，TVML模板是一个非常有用的工具，可以简化UI并显着减少开发时间。让我们看一些好处： TVML模板为用户提供了熟悉的体验。您是否注意到许多AppleTV应用程序具有类似的浏览，预览，搜索，播放等方式？这是因为它们中的许多人都使用TVML模板，这些模板对他们而言具有独特的外观。这大大减少了设计时间。即使很少的JavaScript经验，模板也非常易于实现。自动版式会为您处理。延迟加载图像会自动发生。苹果已经解决了屏幕上每个UI元素的行为。模板结构化且可自定义。模板是即插即用的，但是您仍然可以自定义UI元素的某些方面样式和属性您可以在网络服务器上托管TVML / TVJS文件。这使您可以对应用程序进行更改，而无需用户将更新下载到应用程序。这意味着您无需等待3天即可让Apple批准您的UI更改！那么，如何选择使用UIKit或TVML开发tvOS应用程序呢？好消息-您不必！ UIKit和TVML模板可以在同一项目中混合在一起。这意味着您可以利用UIKit自定义功能，而无需为TVML自动提供的一切重新设计轮子！在这篇文章中，我将演示如何完成两个框架的结合。首先在Xcode中创建一个新的TVML App项目，或者打开现有项目。确保托管application.js文件进行测试，以便显示TVML模板。要创建用于测试的本地服务器，请在终端应用程序的项目文件夹中使用以下命令： python -m SimpleHTTPServer 9001 显示TVML模板要求您使用控制JavaScript上下文的对象： TVApplicationController 。创建新项目时，将在AppDelegate.swift中为您创建该对象。将UIViewController添加到堆栈堆栈很容易：这使您可以将自定义UIViewController推入导航堆栈。如果要返回，只需像往常一样将viewController从导航堆栈中弹出即可。现在我们可以在项目中同时显示TVML模板和自定义UIViewControllers，现在该学习如何在两个世界之间进行通信了。我们可以从Swift代码库中调用托管JavaScript代码库中的方法。为此，我们创建了一个方法，该方法告诉我们appController中的JavaScript上下文我们想调用JavaScript方法。这是一个例子：此示例假设我们的JavaScript代码库中有一个名为pushAlert（）的方法。在Swift中调用pushAlertJS（）将在我们的JavaScript代码库中调用pushAlert（）方法（也许您可以在application.js中创建pushAlert（）作为测试）。这意味着您可以在用户按下UIViewController上的按钮后显示TVML模板。很酷有时，当用户与TVML模板进行交互时，您可能想在Swift中调用方法。为此，我们需要向JavaScript上下文中注入一些自定义的Swift代码。这是一个例子： createSwiftPrint（）将代码注入JavaScript上下文；因此，需要在运行JavaScript代码之前调用它。确保在应用程序安装过程中调用这些注入方法。 […]

tvOS：开始第一个项目之前需要了解的内容: 我刚刚完成了我的第一个tvOS项目（视频流应用程序，例如Netflix）。我过去两个月从事此项目，在那两个月中，我学到了很多有关tvOS平台的知识。在本文中，我将尝试总结tvOS的主要局限性和优点，因此您将比以前更加为第一个项目做准备。这可能是iOS和tvOS之间最重要的区别。没有手势识别器，您无法触摸UI组件。这很明显，因为大多数电视都没有触摸屏。考虑到这一点，设计您的应用程序非常重要。代替tvOS中的手势，有一种叫做焦点的东西。我花了一些时间来熟悉它。您可以在Apple的《人机界面指南》中阅读有关它的更多信息。 iOS和tvOS组件相似，但不相同。 tvOS上的某些iOS组件略有不同，有些根本不可用。例如，图像02显示了UITabBar的示例，它与iOS完全不同。（仅UI，它以相同的方式工作）另一个是UITextField，它在tvOS中具有详细视图。（图像03）。在图像03中，您可以看到UITextField的详细信息屏幕。在此键盘上键入电子邮件和密码的体验绝对可怕。尝试尽可能少地使用它们。例如，您可以在屏幕上显示一些代码，而不是通过要求用户键入电子邮件和密码来登录，然后用户将转到他/她的计算机或智能手机并输入代码。这就是Facebook的LoginKit SDK的工作方式，在我看来，它比那些电子邮件和密码文本字段要好得多。在那里，它的工作方式与iOS中相同，请放心。 🙂 Apple TV没有Safari，因此UIWebView不可用。我知道我已经谈论过tvOS上缺少一些iOS UI组件的问题，但是我认为谈论这一点尤为重要，因为无法作弊。您不能以某种方式破解，UIWebView只是不可用。苹果可能决定不将Safari和UIWebView包含在tvOS上，因为事实是，它很难控制和导航。在tvOS上，AppIcon更为复杂。第一件事是AppIcon必须具有多个层。（两个或三个）每个图层都必须作为矛状PNG文件导出。第二件事是顶部货架图像，如果它位于主屏幕的第一行并且具有焦点，则它是显示在应用程序上方的宽图像。（图像05）应用程序上方的该区域也可以是动态的，所有这些（AppIcon，顶部架子图像-静态还是动态）在Apple的《人机界面指南》中进行了描述。今天是我的事情，希望您今天能学到一些东西，有一天能对您有所帮助。如果您现在有一两分钟的时间，并且您有此需要，我想请您给我写这篇文章的反馈，以便将来为您撰写更好的文章。谢谢您阅读，托马斯。