ionic-native-transitions

1. 下载

   npm install ionic-native-transitions –save

2. 安装

   cordova plugin add https://github.com/Telerik-Verified-Plugins/NativePageTransitions

3. 引入

4. 如果是ios9，页面切换抖动，则安装

   cordova plugin add cordova-plugin-wkwebvie

5. 注入

   angular.module('yourApp', [ 'ionic-native-transitions' 
   ]); 
   

6. 配置

   .config(function($ionicNativeTransitionsProvider){ $ionicNativeTransitionsProvider.setDefaultOptions({ duration: 400, // in milliseconds (ms), default 400, slowdownfactor: 4, // overlap views (higher number is more) or no overlap (1), default 4 iosdelay: -1, // ms to wait for the iOS webview to update before animation kicks in, default -1 androiddelay: -1, // same as above but for Android, default -1 winphonedelay: -1, // same as above but for Windows Phone, default -1, fixedPixelsTop: 0, // the number of pixels of your fixed header, default 0 (iOS and Android) fixedPixelsBottom: 0 // the number of pixels of your fixed footer (f.i. a tab bar), default 0 (iOS and Android) triggerTransitionEvent: '$ionicView.afterEnter', // internal ionic-native-transitions option backInOppositeDirection: false // Takes over default back transition and state back transition to use the opposite direction transition to go back }); $ionicNativeTransitionsProvider.setDefaultTransition({ type: 'slide', direction: 'left' }); $ionicNativeTransitionsProvider.setDefaultBackTransition({ type: 'slide', direction: 'right' }); 
   }); 

7. 其他参考https://github.com/shprink/ionic-native-transitions 或者pdf

删除默认滚动条

.config(function($ionicConfigProvider) {$ionicConfigProvider.scrolling.jsScrolling(false);// Or for only a single platform, use// if( ionic.Platform.isAndroid() ) {// $ionicConfigProvider.scrolling.jsScrolling(false);// }
}

使用缓存

1. 安装

   bower install –save angular-cache

2. 注入

   angular.module(‘myApp’, [‘angular-cache’])

3. 使用

   .controller('Posts', function (CacheFactory) {if (!CacheFactory.get('postCache')) {CacheFactory.createCache('postCache');
   }
   var postCache = CacheFactory.get('postCache');// Cache a post
   postCache.put(id, data);// Delete from cache
   postCache.remove(id);// Get a post
   $scope.post = postCache.get(id);})

4. 详情请看https://github.com/jmdobry/angular-cache

使用Crosswalk WebView

1. 安装

   cordova plugin add cordova-plugin-crosswalk-webview

2. 如果使用了第一步优化，在config.xml加入

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！