ionic 删除返回按钮文字,及自定义nav两侧的按钮和title格式
1、删除返回按钮文字
1)可以在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('standard');
$ionicConfigProvider.platform.ios.navBar.alignTitle('center');
$ionicConfigProvider.platform.android.navBar.alignTitle('center');
$ionicConfigProvider.platform.ios.backButton.previousTitleText('').icon('ion-android-arrow-back');
$ionicConfigProvider.platform.android.backButton.previousTitleText('').icon('ion-ios-arrow-back');
2)如果上面行不通,那么就去改源码 如下所示
打开lib下的ionic.bundle.js
注释掉下面这句代码:
// buttonEle.appendChild(buttonTextEle);
function hasIconClass(ele) {
return /ion-|icon/.test(ele.className);
}
var defaultIcon = $ionicConfig.backButton.icon();
if (!hasIcon && defaultIcon && defaultIcon !== 'none') {
buttonEle.innerHTML = '<i class="icon ' + defaultIcon + '"></i> ' + buttonEle.innerHTML;
buttonEle.className += ' button-clear';
}
if (!hasInnerText) {
var buttonTextEle = $document[0].createElement('span');
buttonTextEle.className = 'back-text';
if (!hasButtonText && $ionicConfig.backButton.text()) {
buttonTextEle.innerHTML += '<span class="default-title">' + $ionicConfig.backButton.text() + '</span>';
}
if (!hasPreviousTitle && $ionicConfig.backButton.previousTitleText()) {
buttonTextEle.innerHTML += '<span class="previous-title"></span>';
}
// buttonEle.appendChild(buttonTextEle);
}
2、隐藏默认返回按钮
在ion-view标签加上 hide-back-button="true" 即可;
3、自定义Nav两侧的button及Nav的title
1)两侧按钮
//nav左边功能按钮
<ion-nav-buttons side="left">
<button class="button button-clear">
<i class="icon ion-ios-chatbubble-outline"></i>
</button>
</ion-nav-buttons>
//nav右边功能按钮
<ion-nav-buttons side="right">
<button class="button button-clear">
<i class="icon ion-ios-chatbubble-outline"></i>
</button>
</ion-nav-buttons>
2)Nav的title
//ion-nav-title 标签里面的内容随便改
<ion-nav-title>
<h1 class="title"> 购物车</h1>
</ion-nav-title>
ionic 删除返回按钮文字,及自定义nav两侧的按钮和title格式的更多相关文章
- Ionic3学习笔记(四)修改返回按钮文字、颜色
本文为原创文章,转载请标明出处 目录 修改返回按钮文字 修改返回按钮颜色 1. 修改返回按钮文字 参考官网 Ionic API---Config 文档 可在 ./src/app/app.module. ...
- Swift - 修改导航栏“返回”按钮文字和图标 /手势冲突解决/响应范围
iOS11之前 修改导航栏“返回”按钮文字,图标 https://blog.csdn.net/u012701023/article/details/50264265 iOS11 完美解决导航栏按钮偏移 ...
- Swift - 修改导航栏“返回”按钮文字,图标
Swift - 修改导航栏“返回”按钮文字,图标 2015-11-27 09:13发布:hangge浏览:4037 项目中常常会使用 UINavigationController 对各个页面进行导 ...
- iOS7 修改导航系统默认返回按钮文字及颜色
//iOS7 修改系统默认返回按钮文字及颜色 UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithTitle:@"返" ...
- iOS 设置导航栏 返回按钮文字隐藏
//隐藏返回按钮文字 [[UIBarButtonItem appearance] setBackButtonTitlePositionAdjustment:UIOffsetMake(0, -60) f ...
- 【转】自定义iOS的Back按钮(backBarButtonItem)和pop交互手势(interactivepopgesturerecognizer) --- 不错
原文网址:http://blog.csdn.net/joonsheng/article/details/41362499 序 说到自定义UINavigetionController的返回按钮,iOS7 ...
- 如何得到自定义UITableViewCell中的按钮所在的cell的indexPath.row
在自定义UITableViewCell中创建了一个按钮. 想在点击该按钮时知道该按钮所在的cell在TableView中的行数.就是cell的 indexPath.row两种方法都很好.-(IBAct ...
- 自定义jQuery Mobile工具栏按钮
自定义jQuery Mobile工具栏按钮 1.实现效果
- Spring Cloud实战: 基于Spring Cloud Gateway + vue-element-admin 实现的RBAC权限管理系统,实现网关对RESTful接口方法权限和自定义Vue指令对按钮权限的细粒度控制
一. 前言 信我的哈,明天过年. 这应该是农历年前的关于开源项目 的最后一篇文章了. 有来商城 是基于 Spring Cloud OAuth2 + Spring Cloud Gateway + JWT ...
随机推荐
- 小白学python-day04-作业-九九乘法表相关
作业内容: 作业一: 作业二: 作业三: (1) (2) \n换行 \t制表符 end="" 代表打印不换行,双引号里面可以在结果之间加字符. print() 代表换行打印,使用时 ...
- 你真的熟练使用webpack吗?
https://www.webpackjs.com/ 官网地址 当自己在简历中写着熟练使用webpack的时候,殊不知自己只是在vue脚手架,react脚手架的路上走着比较轻松而已. 当面试官问你这几 ...
- 关于STM32F103+ESP8266+阿里云过程之修改SDK连接至阿里云(二)
继上篇的阿里云物联云平台设置之后,接下来的工作就是对安信可官方给的sdk进行修改 安信可ESP系列集成环境,SDK,aliyun_mqtt_app,下载地址在上一篇博客,https://www.cnb ...
- java数组扩容
有些时候使用数组代替栈,玩意数组容量不够需要扩容 则: 1.Array.toString();直接遍历打印数组 2.数组扩容采用Array.copyOf(),直接实现数组扩容功能,非常强大 (实际 ...
- 考试安排查询脚本(CUP)
去年热情高涨的时候心血来潮做了个简易的查询脚本,限于当时技术水平(菜),实现得不是很好,这几天终于想起来填坑了.环境依赖: brew install python3 pip3 install requ ...
- JavaScript数据结构——集合的实现与应用
与数学中的集合概念类似,集合由一组无序的元素组成,且集合中的每个元素都是唯一存在的.可以回顾一下中学数学中集合的概念,我们这里所要定义的集合也具有空集(即集合的内容为空).交集.并集.差集.子集的特性 ...
- cesium学习——cesium中的坐标
一.坐标展现形式 在cesium中,对于坐标数值单位有三种:角度.弧度和坐标值 1.角度 角度就是我们所熟悉的经纬度,对于地球的坐标建立如下: 图中以本初子午线作为x和z的面,建立了一个空间坐标系.可 ...
- 自定义SWT控件七之自定义Shell(可伸缩窗口)
7.可伸缩窗口 该自定义窗口可以通过鼠标随意更改窗口大小 package com.hikvision.encapsulate.view.control.shell; import org.eclips ...
- Java基础之二十 并发
20.1 并发得多面性 并发编程令人困惑的一个主要原因:使用并发时需要解决的问题有多个,而实现并发的方法也有多种,并且在这两者之间没有明显的映射关系. 20.1.1 更快的执行 速度问题初听起来很简单 ...
- C#的委托事件总结
什么是委托?1.委托是C#中由用户自定义的一个类型.2.类表示的是数据和方法的集合,而委托实际上是一个能持有对某个或某些方法的引用的类.3.与其他的类不同,委托类能拥有一个签名,并且他只能持有与他的签 ...