搜索文档 /

部署到iOS和Android

由于我们首次创建了项目时将电容器添加到我们的项目中,因此只剩下几个步骤,直到您的设备上的照片库应用程序为止!请记住,您可以找到此应用程序的完整源代码 这里

电容器设置

电容器是Ionic的官方应betway东盟体育app用程序运行时,它可以轻松地将Web应用程序部署到iOS,Android等本机平台等。如果您过去曾使用过Cordova,请考虑阅读更多有关差异的信息 这里

如果你还在运行 betway东盟体育app离子发球 在终端中,取消它。完成Ionic项目的新构建,修复其报告的任何错误:betway东盟体育app


              $
             betway东盟体育app离子构建

接下来,创建iOS和Android项目:


              $
             betway东盟体育app离子帽
              添加
             ios
              $
             betway东盟体育app离子帽
              添加
             安卓

创建了项目根部的Android和iOS文件夹。这些是完全独立的本地项目,应将其视为您的离子应用程序的一部分(即,将其检查为源控制,使用本机工具等编辑它们等)。betway东盟体育app

每次执行构建时(例如 betway东盟体育app离子构建 )更新您的Web目录(默认值: 建造 ),您需要将这些更改复制到本机项目中:


              $
             betway东盟体育app离子盖副本

注意:在对代码的本机部分进行更新(例如添加新插件)之后,请使用 同步 命令:


              $
             betway东盟体育app离子帽
              同步

ios

要构建iOS应用程序,您将需要一台Mac计算机。

电容器iOS应用程序通过Xcode(Apple的iOS/MAC IDE)进行配置和管理,并由Cocoapods管理。在iOS设备上运行此应用程序之前,需要完成几个步骤。

首先,运行电容器 打开 命令,在Xcode中打开本机iOS项目:


              $
             betway东盟体育app离子帽
              打开
             ios

为了使某些本机插件工作,必须配置用户权限。在我们的照片库应用程序中,这包括相机插件:iOS首次在第一次之后自动显示模式对话框 camera.getphoto() 称为,提示用户允许应用程序使用相机。驱动此驱动的许可被标记为“隐私 - 相机使用”。为了设置它, info.plist 文件必须修改( 这里更多详细信息 )。要访问它,请单击“信息”,然后展开“自定义iOS目标属性”。

XCode自定义iOS目标属性“c-id=

每个设置在 info.plist 具有低级参数名称和一个高级名称。默认情况下,属性列表编辑器显示高级名称,但是切换到显示原始的低级名称通常很有用。为此,右键单击属性列表编辑器中的任何地方,然后切换“原始密钥/值”。

添加 nscamerausateDescription 键并将值设置为描述应用程序为什么需要使用相机的东西,例如“拍照”。当权限提示打开时,将显示值字段显示给应用程序用户。

按照相同的过程添加相机插件所需的其他两个键: nsphotolibraryAddusaDeDescription nsphotolibraryingescription

接下来,单击 应用程序 在左侧的项目导航器中,然后在 签名和功能 部分,选择您的开发团队。

XCode-选择开发团队“c-id=

选择了权限和开发团队,我们准备在真实设备上尝试该应用程序!将iOS设备连接到您的Mac计算机,选择它( 应用 - >马修的iPhone 对我来说)然后单击“构建”按钮以在设备上构建,安装和启动该应用程序:

XCode构建按钮“c-id=

点击照片库选项卡上的相机按钮后,将显示权限提示。点击确定,然后用相机拍照。之后,照片在应用程序中显示!

iOS相机权限“c-id=

安卓

电容器Android应用程序通过Android Studio配置和管理。在在Android设备上运行此应用程序之前,有几个步骤要完成。

首先,运行电容器 打开 Command,在Android Studio中打开本机Android项目:


              $
             betway东盟体育app离子帽
              打开
             安卓

与iOS相似,我们必须使正确的权限能够使用相机。在 androidManifest.xml 文件。Android Studio可能会自动打开此文件,但如果没有,则将其定位在 android/app/src/main/

Android清单位置“c-id=

滚动到 权限 部分并确保包括这些条目:


                <
               用途
              
                安卓:
               姓名
                =
                
               android.permission.read__external_storage
                
               />
             
                <
               用途
              
                安卓:
               姓名
                =
                
               android.permission.write_external_storage
                
              
               />
复制 复制

保存文件。有了权限,我们准备在真实设备上尝试该应用程序!将Android设备连接到您的计算机。在Android Studio中,单击“运行”按钮,选择附加的Android设备,然后单击“确定”以构建,安装和启动该应用程序在您的设备上。

在Android上启动应用程序“c-id=

再次,在“照片库”选项卡上点击相机按钮后,应显示权限提示。点击确定,然后用相机拍照。之后,照片应出现在应用程序中。

Android相机权限“c-id=

我们的照片库应用程序刚刚部署到Android和iOS设备。

在本教程的最后部分,我们将使用离子CLI的实时重新加载功能快速实现照片删除 - 从而完成了我们的照片库功能betway东盟体育app。

以前的
添加手机
下一个
Rapid App Dev与现场重新加载
Baidu