PhoneGap中文网

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 29622|回复: 14

$ionicConfigProvider-ionic 中默认安装后tap导航在顶部怎么j解决

  [复制链接]

485

主题

2012

帖子

6528

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6528
发表于 2015-3-14 15:19:26 | 显示全部楼层 |阅读模式
ionic 中默认安装后导航在底部解决方案
$ionicConfigProvider, ios and 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('standard');

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

  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. });
复制代码


回复

使用道具 举报

5

主题

24

帖子

77

积分

注册会员

Rank: 2

积分
77
发表于 2015-4-10 11:03:31 | 显示全部楼层
已经解决,ironic是要修改项目目录下的www文件夹内的内容,不是platform下的,这点与jquerymobile不同,大家要注意!
回复 支持 1 反对 0

使用道具 举报

0

主题

2

帖子

14

积分

新手上路

Rank: 1

积分
14
发表于 2015-3-17 12:49:48 | 显示全部楼层
楼主怎么找到这段配置的,找很久都没有找到,请赐教。看到你的配置才解决了,感谢啊!
回复 支持 反对

使用道具 举报

5

主题

24

帖子

77

积分

注册会员

Rank: 2

积分
77
发表于 2015-4-10 09:23:09 | 显示全部楼层
小米note,安卓4.4.4,用了这段配置,依然在顶部。。。
回复 支持 反对

使用道具 举报

5

主题

24

帖子

77

积分

注册会员

Rank: 2

积分
77
发表于 2015-4-10 09:45:00 | 显示全部楼层
发现问题了,每次build以后,app.js文件又被还原了,这是什么情况?
回复 支持 反对

使用道具 举报

5

主题

24

帖子

77

积分

注册会员

Rank: 2

积分
77
发表于 2015-4-10 11:09:29 | 显示全部楼层
还有,要把导航弄到下面,必须把第六行改成 $ionicConfigProvider.platform.android.tabs.position('bottom');

吐槽一下楼主,发帖时候应该把修改什么目录的哪个文件,要修改的地方都说清楚,可以让人少走很多弯路啊
回复 支持 反对

使用道具 举报

4

主题

22

帖子

176

积分

注册会员

Rank: 2

积分
176
发表于 2015-5-29 11:52:33 | 显示全部楼层
已经解决,把项目目录下的www文件夹内的内容全部修改,然后再platform下->android->assets->www->js->app.js 第24行 新增
.config(function($stateProvider, $urlRouterProvider,$ionicConfigProvider)
然后方法的首行添加以下内容 :
$ionicConfigProvider.platform.ios.tabs.style('standard');
        $ionicConfigProvider.platform.ios.tabs.position('bottom');
        $ionicConfigProvider.platform.android.tabs.style('standard');
        $ionicConfigProvider.platform.android.tabs.position('bottom');

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

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

        $ionicConfigProvider.platform.ios.views.transition('ios');
        $ionicConfigProvider.platform.android.views.transition('android');
回复 支持 反对

使用道具 举报

4

主题

22

帖子

176

积分

注册会员

Rank: 2

积分
176
发表于 2015-5-29 11:53:23 | 显示全部楼层
把项目目录下的www文件夹内的内容全部删除才对,发太快没注意看
回复 支持 反对

使用道具 举报

0

主题

3

帖子

18

积分

新手上路

Rank: 1

积分
18
发表于 2015-8-23 16:53:02 | 显示全部楼层
这东西查下文档就知道了啊。。。或者看源码
回复 支持 反对

使用道具 举报

485

主题

2012

帖子

6528

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6528
 楼主| 发表于 2015-8-28 22:00:32 | 显示全部楼层
conango 发表于 2015-4-10 11:09
还有,要把导航弄到下面,必须把第六行改成 $ionicConfigProvider.platform.android.tabs.position('bottom ...

只能说你你没有看代码,直接app.js里面
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐上一条 /1 下一条

Archiver|手机版|小黑屋|PhoneGap中文网 ( 京ICP备13027796号-1

GMT+8, 2018-1-16 23:39 , Processed in 0.347296 second(s), 43 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表