分享 Ionic 开发 Hybrid App 中遇到的问题以及后期发布 iOS/Android 的方方面面

 2. View 缓存的处理

Ionic默认对 View 添加了缓存的机制，不过在此 App 中，全部的 View 都须要进行即时的刷新以及用户添加新的网站后页面也须要进行刷新，那么就须要禁用掉 View 的缓存。

禁用缓存只须要在 View 中禁用便可。

.state('tab.websites', {
url: '/websites',
cache: false,
views: {
'tab-websites': {
templateUrl: 'templates/tab-websites.html',
controller: 'WebSitesCtrl'
}
}
})

全局禁用缓存的方法是：$ionicConfigProvider.views.maxCache(0);

 

3. 键盘的不一样模式的支持

在不一样的用户输入场景下，须要显示不一样的键盘模式以方便用户输入，如在输入邮件时键盘则显示邮件模式等。

在 Ionic 中须要安装键盘插件控制键盘模式的显示。

安装后在$ionicPlatform.ready中调用便可。

1 if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
2     cordova.plugins.Keyboard.disableScroll(true);
3     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
4 }
5 if (window.StatusBar) {
6     // org.apache.cordova.statusbar required
7     StatusBar.styleLightContent();
8 }

对应的 input 只要添加相应的 type 进行控制便可，支持的全部 type 见这里。

<input type="email" placeholder="邮箱" ng-model="data.username">

使用效果以下。

4. 设备网络情况的检查

由于此 App 一直须要联网操做，那么在 App 启动的时候就要对网络状况进行检查，当网络不可用的时候对用户进行相应的提示。

安装网络检查插件后，在 App 启动的时候进行检测并提示便可。

 1 document.addEventListener("deviceready", function () {
 2     // listen for Online event
 3     $rootScope.$on('$cordovaNetwork:online', function (event, networkState) {
 4         var onlineState = networkState;
 5         console.log("device online...");
 6     })
 7     // listen for Offline event
 8     $rootScope.$on('$cordovaNetwork:offline', function (event, networkState) {
 9         var offlineState = networkState;
10         //提醒用户的网络异常
11         $ionicLoading.show({
12             template: '网络异常，不能链接到服务器！'
13         });
14     })
15 }, false);

5. iOS 设备和 Android 设备的图标以及启动画面图片的批量生成

iOS 设备和 Android 设备由于不一样设备的屏幕尺寸适配问题，须要提供不少不一样尺寸的图片资源，包括 icon 和 splash 的不一样尺寸。

若是每个尺寸都去使用 PS 导出，工做量巨大，还好有自动生成的工具，只须要提供最大的尺寸供生成便可。

iOS 的 icon 和 splash生成：http://ios.hvims.com/

Android 相关资源生成：https://romannurik.github.io/AndroidAssetStudio/index.html