标题栏

标题栏

5 人关注该话题

wap2app如何关闭所有的原生标题栏呢? 标题栏

wap2app 幻影之光 发起了问题 • 1 人关注 • 0 个回复 • 113 次浏览 • 2018-05-20 15:01

MUI 标题栏渐变 怎样让整个标题渐变,而不仅仅是标题栏的背景颜色? 标题栏 mui 透明渐变

MUI BoringTu 回复了问题 • 2 人关注 • 2 个回复 • 281 次浏览 • 2018-05-08 10:22

个推,在ios上的流程 推送插件配置指南 标题栏

5+ SDK 太烏 回复了问题 • 2 人关注 • 1 个回复 • 170 次浏览 • 2018-01-29 16:36

【报Bug】 标题栏

HTML5+ 所谓 发起了问题 • 1 人关注 • 0 个回复 • 159 次浏览 • 2017-12-14 11:49

ios设备上,页面滑动时标题栏会跟着消失 标题栏 iOS

MUI 953734487@qq.com 回复了问题 • 2 人关注 • 2 个回复 • 258 次浏览 • 2017-11-10 08:56

首页titleNView在mainfest.json指定onclick回调函数报错。 标题栏 titleNView

HTML5+ DCloud_IOS_XTY 回复了问题 • 5 人关注 • 4 个回复 • 466 次浏览 • 2017-10-24 17:00

X

赞助DCloud可免广告,点此前往赞助页面

原生标题栏 点击事件 标题栏

wap2app DCloud_MUI_CHB 回复了问题 • 2 人关注 • 1 个回复 • 276 次浏览 • 2017-09-29 10:19

标题栏文字不可以动态更换吗 标题栏

HTML5+ thyiad 回复了问题 • 3 人关注 • 3 个回复 • 307 次浏览 • 2017-08-29 14:12

标题栏设置图标字体IOS/android显示不同 标题栏

HTML5+ DCloud_客服_Trust 回复了问题 • 2 人关注 • 1 个回复 • 222 次浏览 • 2017-08-24 18:12

在原生标题栏绘制的图标,如何动态修改? 标题栏

5+ SDK nearwmy@gmail.com 回复了问题 • 3 人关注 • 2 个回复 • 499 次浏览 • 2017-07-20 14:38

更多...
2

赞同来自: DCloud_MUI_Neil DCloud_客服_Trust

```javascript
var newsView = plus.nativeObj.View.getViewById('tabBar2');
// 绘制小圆点
newsView.drawRect({color:'#f00',radius:'50%'},{... 显示全部 »
```javascript
var newsView = plus.nativeObj.View.getViewById('tabBar2');
// 绘制小圆点
newsView.drawRect({color:'#f00',radius:'50%'},{top:8, left: '35%', height: 6, width:6},'newsPoint');
// 更新小圆点 将颜色设为透明
newsView.drawRect({color:'rgba(255,0,0,0)',radius:'50%'},{top:6, left: '33%', height: 8,width:8},'newsPoint');
```
采用重新绘制的方法,更新方法可以将颜色设为透明,也可以将大小调为0来达到隐藏效果。
以上示例基于[原生控件绘制tab选项卡](http://ask.dcloud.net.cn/article/12602)中的消息id操作。你可以根据此原理做相应调整
1

赞同来自: DCloud_客服_Trust

我研究了一下MUI源码,源码里直接是写死的`backgroundColor`,而且也并没有暴露出回调入口,也并没有可以外部重写的方式。
估计这问题官方也没啥答复,所以刚刚我把源码改了,亲测有效,现把改动贴出来给有同样问题的童鞋参考:

``` js
var T... 显示全部 »
我研究了一下MUI源码,源码里直接是写死的`backgroundColor`,而且也并没有暴露出回调入口,也并没有可以外部重写的方式。
估计这问题官方也没啥答复,所以刚刚我把源码改了,亲测有效,现把改动贴出来给有同样问题的童鞋参考:

``` js
var Transparent = function(element, options) {

...

// 约 8077 行,Transparent构造函数内
this._style = this.element.style;
this._bgColor = this._style.backgroundColor;
this._opacity = this._style.opacity ? +this._style.opacity : 0;
var color = getColor(mui.getStyles(this.element, 'backgroundColor'));
if (color.length) {
this._R = color[0];
this._G = color[1];
this._B = color[2];
this._A = parseFloat(color[3]);
this.lastOpacity = this._A;
} else if (this._opacity === 1) {
throw new Error("元素背景颜色必须为RGBA");
}
this._bufferFn = $.buffer(this.handleScroll, this.options.duration, this);
this.initEvent();

...

// Transparent.prototype.handleScroll
Transparent.prototype.handleScroll = function(e) {
var y = window.scrollY;
if (!this.isNativeScroll && e && e.detail) {
y = -e.detail.y;
}
switch (this.options.transProp) {
case 'opacity':
var opacity = (y - this.options.top) / this.options.offset + this._opacity;
opacity = Math.min(Math.max(this._opacity, opacity), 1);
this._style.opacity = opacity;
if (opacity > this._opacity) {
this.element.classList.add(CLASS_ACTIVE);
} else {
this.element.classList.remove(CLASS_ACTIVE);
}
break;
case 'backgroundColor':
default:
var opacity = (y - this.options.top) / this.options.offset + this._A;
opacity = Math.min(Math.max(this._A, opacity), 1);
this._style.backgroundColor = 'rgba(' + this._R + ',' + this._G + ',' + this._B + ',' + opacity + ')';
if (opacity > this._A) {
this.element.classList.add(CLASS_ACTIVE);
} else {
this.element.classList.remove(CLASS_ACTIVE);
}
break;
}
if (this.lastOpacity !== opacity) {
$.trigger(this.element, 'alpha', {
alpha: opacity
});
this.lastOpacity = opacity;
}
};

...

// Transparent.prototype.destory
Transparent.prototype.destory = function() {
this.scrollByElem.removeEventListener('scroll', this._bufferFn);
this.scrollByElem.removeEventListener($.EVENT_MOVE, this._bufferFn);
if (this._bgColor) this.element.style.backgroundColor = this._bgColor;
if (this._opacity) this.element.style.opacity = this._opacity;
this.element.mui_plugin_transparent = null;
};

```

调用方式(只需要加一个名为`transProp`的参数即可):
``` js
mui(XXElement).transparent({
offset: 120,
transProp: 'opacity' // 可选值:'opacity','backgroundColor'。默认:'backgroundColor'
})
```
更多...

titleNView配置 - wap2app教程 wap2app 导航栏 标题栏

wap2app DCloud_MUI_CHB 发表了文章 • 20 个评论 • 19767 次浏览 • 2017-03-19 22:20

更多...