Tag: Hybrid Apps
24小时内的应用程序：我的React Native体验
对于最终版，我删去了一些功能，而略过了其他功能，例如菜单栏，上/下投票动画以及最重要的是语音搜索。 这是一个有趣的小项目，I̶̶a̶m̶̶c̶u̶r̶r̶e̶n̶t̶l̶y̶̶d̶e̶b̶a̶t̶i̶n̶g̶̶o̶n̶̶w̶e̶t̶h̶e̶r̶̶t̶o̶̶o̶p̶e̶nlisht̶i̶n̶t̶l̶y̶n̶-̶ React Native是一个很棒的JS框架，用于构建应用程序，我已经利用该框架构建跨平台应用程序的功能开发了我的第一个功能齐全的android应用程序。 RN非常适合真正的基本应用程序，这些应用程序在应用程序商店中占很大比例。 对于游戏或其他广泛交互和自定义应用程序等其他热门游戏，坚持使用Swift / Objective-c或Java等本地语言将是您的最佳选择。 我肯定会越来越多地使用RN，看看在2017年将带给我什么。 ✌🏾 该项目现已在Github上开源 Apple拒绝了Urban Dictionary应用程序，因为它与现有应用程序过于相似。 🤷🏽
适用于iOS的Basecamp 3：混合架构
过去，我们已经针对构建混合移动应用程序的方法撰写了很多文章。 Basecamp 3代表了该架构的最新一代，它吸收了我们从先前版本中学到的所有知识。 Basecamp 2应用程序的第一个应用程序仅为iPhone，使用RubyMotion编写，作为UIWebView的薄包装。 接下来，我们为Basecamp 2开发了一个新的通用应用程序，该应用程序使用Xcode + Objective-C编写，仍然使用UIWebView，但是还添加了一些本机代码。对于Basecamp 3，我们用Swift，UIWebView替换了Objective-C与WKWebView并添加了Turbolinks，以及更多的本机代码，以及本机和Web之间的更深入的集成。 定义混合 首先，有助于弄清我们所说的“混合”是什么意思。 该术语在许多不同的上下文中使用，几乎没有意义。 在我们的使用中，我们指的是标准本机应用程序，其中很大一部分内容是使用网络技术呈现的。 我在那里明确表示内容，因为这是一个重要的区别。 我们没有使用试图模仿使用HTML / CSS的本机控件的框架。 我们没有使用试图将另一种语言编译为本机代码，或从单个代码库制作跨平台应用程序的框架。 对我们来说，这意味着使用Xcode + Swift，并遵守有关导航/表示的所有平台约定。 我们的应用程序的构建基块由UINavigationController ， UITabViewController ， UISplitViewController ， UIViewController等组成。在这些容器中，我们有很多屏幕都是使用UITableView或UICollectionView构建内容的，而在由WKWebView填充角色的地方，还有更多的WKWebView 。 引擎盖下 适用于iOS的Basecamp 3使用最新版本的Xcode在Swift 3.1中（即将成为4）100％编写。 我们只有几个依赖项，但是我们确实有一些依赖项是由Carthage管理的。 启用这种混合体系结构的核心库是Turbolinks。 我们在网络上使用Turbolinks，并且我们的iOS和Android配套框架也允许我们在本机应用程序中使用它。 该框架处理与Turbolinks.js的通信，并允许使用在多个不同屏幕之间共享的单个WKWebView 。 路由器/导航器 除了Turbolinks，我们还有许多其他组件来支持它。 我们在iOS应用中的大多数导航都是URL驱动的。 网址可以来自许多来源（Web链接，推送通知，来自另一个应用程序的通用链接，本机操作等），它们都通过路由器。 该路由器负责确切确定对给定的URL采取什么操作。 如果路由器用于其他域，则路由器可以在Safari中打开url，如果图像/视频是路由器，则可以显示媒体查看器，或者在通常情况下，创建要显示的新视图控制器。 路由器将视图控制器移交给负责演示的导航器 。 大多数视图控制器被推送到当前导航堆栈上，但是我们还支持模态显示某些屏幕（例如新视图/编辑视图），或在适当时替换当前屏幕。 桥 构成混合体系结构的最后一个组件（尽管我们还有许多其他与混合部分无关的组件）被称为“桥梁”。 这是涉及本机→网络（或Web→本机）通信的应用程序各个部分的总称。 此处的主要代码是嵌入在应用程序中并使用WKUserScript注入到Web视图中的本地JavaScript文件（以TypeScript编写）。 这为本机代码提供了一个API，用于与Web视图进行通信，而无需直接查询DOM或执行复杂的JS。 使用WKScriptMessageHandler ，我们可以响应通过网桥从Web视图发送的消息。 […]
使用WebKit从Swift调用WKWebView JavaScript和从JavaScript调用Swift
许多移动应用程序都将远程网页合并为被动（静态）内容，或者在这种情况下作为UI的组成部分。 使用此处介绍的WebKit / WKWebView技术，您的本机应用程序可以更好地与Web内容集成，并为最终用户提供卓越的体验。 Swift和JavaScript之间的双向集成 在本文中，我们将构建一个完整的混合本机/ Web应用程序示例，该应用程序在本机iOS应用程序（用Swift编写）和移动网页（用HTML / JavaScript编写）之间使用双向函数调用。 通过利用这两个功能，我们可以构建一个高度健壮的混合应用程序，其中本机和Web组件作为平等的合作伙伴协作，以提供有价值的客户解决方案。 解决方案概述 最终的解决方案包含两个组件： 在Swift中开发的本机iOS应用程序 托管在远程Web服务器上的静态HTML / JavaScript网页（在本例中为Microsoft Azure托管）。 完成学习的应用程序实现了三个主要功能： ＃1-从远程加载网页。 如果您使用过WKWebView，那么您将了解所有有关此功能的信息。 加载UIViewController时，会将网页URL设置为WKWebView，该WebKView使用HTTP GET方法获取HTML内容。 ＃2 —从Swift操纵WebView的外观。 接下来，我们通过向WKWebView内容页面发送命令以根据本机Segment控件中的用户选择来更改页面背景颜色，来轻而易举地进入互操作性领域。 ＃3-从HTML / JavaScript回调到Swift。 最后，通过将本机iOS应用程序中的地理位置功能公开到网页，我们使解决方案更加复杂和有趣。 当用户输入地址时，在Web视图页面上按一个按钮，将完成以下操作： 网页（使用JavaScript）调用Swift函数，将用户输入的地址作为JSON对象传入。 Swift本机应用程序使用CLLocation异步调用Apple，以确定用户输入地址的纬度和经度。 从Apple返回纬度/经度时，Swift本机应用程序将调用网页中的JavaScript函数，以使用输入地址的纬度/经度来更新网页。 解决方案演示 在遍历代码之前，让我们演示完整的应用程序的外观（动画GIF）。 UI故事板设计 学习应用程序包含一个名为ViewController的 UIViewController。 ViewController在Storyboard中只有两个UI控件： 一个UISegmentedControl，允许用户将WebView背景颜色更改为五种颜色之一。 UIView，放置在情节提要中，用作WKWebView控件的容器视图。 更改网页颜色 为了深入研究混合解决方案，让我们实现一个从 Swift 到 WKWebView的简单调用。 ViewController具有与本机视图顶部的Segment控件中的颜色选择相对应的颜色成员数组。 让颜色= [“黑色”，“红色”，“蓝色”，“绿色”，“紫色”] 当用户在Segment控件中点击新的细分时，事件处理程序将调用JavaScript函数changeBackgroundColor ，并传递与用户选择相对应的字符串： @IBAction func colorChoiceChanged（_发送者：UISegmentedControl）{ webView.evaluateJavaScript […]
