欢迎来到代码驿站!

JavaScript代码

当前位置:首页 > 网页前端 > JavaScript代码

Ionic默认的Tabs模板使用实例

时间:2021-06-13 08:43:20|栏目:JavaScript代码|点击:

Ionic 默认的Tabs 模板  ,Android的在上方,IOS的在下方。在www/js/app.js修改配置,添加一个变量,再修改相应属性: 

.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');


然后再在Android平台上调试 Tabs就在下面了 并且别的组件工作也正常 

 

 

特别注意
Cordova的配置一定要正确 尤其是Android ADT
Visual Studio 默认是不配置的
具体参考这篇文章
 

复制代码 代码如下:
').addClass('pre-numbering').hide(); \((this).addClass('has-numbering').parent().append(\)numbering); for (i = 1; i <= lines; i++) { \(numbering.append(\)('
 ').text(i)); }; $numbering.fadeIn(1700); }); });

 以上就介绍了Ionic Tabs,包括了ionic,tabs方面的内容,希望对IOS开发有兴趣的朋友有所帮助。

上一篇:Bootstrap基本组件学习笔记之导航(10)

栏    目:JavaScript代码

下一篇:JavaScript学习笔记之检测客户端类型是(引擎、浏览器、平台、操作系统、移动设备)

本文标题:Ionic默认的Tabs模板使用实例

本文地址:http://www.codeinn.net/misctech/140938.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有