当前位置: 代码迷 >> Android >> ionic tab导航在android 真机测试中 导航在顶部解决方法
  详细解决方案

ionic tab导航在android 真机测试中 导航在顶部解决方法

热度:156   发布时间:2016-04-28 01:17:57.0
ionic tab导航在android 真机测试中 导航在顶部解决办法
在 iOS中, tabs 一直处于底部. 在android中 ionic tabs 一直在顶部,如果要改我们可以通过配置$ionicConfigProvider


  1. .config(function($stateProvider, $urlRouterProvider,$ionicConfigProvider) {

  2.         $ionicConfigProvider.platform.ios.tabs.style('standard'); 
  3.         $ionicConfigProvider.platform.ios.tabs.position('bottom');
  4.         $ionicConfigProvider.platform.android.tabs.style('standard');
  5.         $ionicConfigProvider.platform.android.tabs.position('bottom');

  6.         $ionicConfigProvider.platform.ios.navBar.alignTitle('center'); 
  7.         $ionicConfigProvider.platform.android.navBar.alignTitle('center');

  8.         $ionicConfigProvider.platform.ios.backButton.previousTitleText('').icon('ion-ios-arrow-thin-left');
  9.         $ionicConfigProvider.platform.android.backButton.previousTitleText('').icon('ion-android-arrow-back');        

  10.         $ionicConfigProvider.platform.ios.views.transition('ios'); 
  11.         $ionicConfigProvider.platform.android.views.transition('android');


  12.   // Ionic uses AngularUI Router which uses the concept of states
  13.   // Learn more here: https://github.com/angular-ui/ui-router
  14.   // Set up the various states which the app can be in.
  15.   // Each state's controller can be found in controllers.js
  16.   $stateProvider

  17.   // setup an abstract state for the tabs directive
  18.     .state('tab', {
  19.     url: "/tab",
  20.     abstract: true,
  21.     templateUrl: "templates/tabs.html"
  22.   })

  23.   // Each tab has its own nav history stack:

  24.   .state('tab.dash', {
  25.     url: '/dash',
  26.     views: {
  27.       'tab-dash': {
  28.         templateUrl: 'templates/tab-dash.html',
  29.         controller: 'DashCtrl'
  30.       }
  31.     }
  32.   })

  33.   .state('tab.chats', {
  34.       url: '/chats',
  35.       views: {
  36.         'tab-chats': {
  37.           templateUrl: 'templates/tab-chats.html',
  38.           controller: 'ChatsCtrl'
  39.         }
  40.       }
  41.     })
  42.     .state('tab.chat-detail', {
  43.       url: '/chats/:chatId',
  44.       views: {
  45.         'tab-chats': {
  46.           templateUrl: 'templates/chat-detail.html',
  47.           controller: 'ChatDetailCtrl'
  48.         }
  49.       }
  50.     })

  51.   .state('tab.account', {
  52.     url: '/account',
  53.     views: {
  54.       'tab-account': {
  55.         templateUrl: 'templates/tab-account.html',
  56.         controller: 'AccountCtrl'
  57.       }
  58.     }
  59.   });

  60.   // if none of the above states are matched, use this as the fallback
  61.   $urlRouterProvider.otherwise('/tab/dash');

  62. });

  相关解决方案