唐先生
唐先生
  • 发布:2017-02-16 22:44
  • 更新:2019-08-26 21:23
  • 阅读:2880

MUI chat 头部标题栏不显示

分类:MUI

在项目中贴上文档中的chat代码后 在模拟器和真机上运行 页面的标题栏均不显示 但是在pc chrome浏览器调试 标题栏能显示。请问这是什么问题。

2017-02-16 22:44 负责人:无 分享
已邀请:
DCloud_UNI_CHB

DCloud_UNI_CHB

因为在plus环境下使用的是原生头,解决滚动条通顶的体验问题,app.css中有如下代码:

.mui-plus header.mui-bar{  
    display: none;  
}

这个原生头是在首页index.html中创建的,所以你需要有首页的代码,如下:

var webview = plus.webview.create(href, id, webview_style);  
//绘制原生头  
var view = new plus.nativeObj.View("title", {  
    top: 0,  
    height: "44px",  
    width: "100%",  
    dock: "top",  
    position: "dock"  
});  

view.drawRect("#f7f7f7"); //绘制背景色  
view.drawRect("#cccccc", {  
    top: "43px",  
    left: "0px"  
}); //绘制底部边线  

var bitmap = new plus.nativeObj.Bitmap("back");  
bitmap.loadBase64Data("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAb1BMVEUAAAAAev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8Aev8AAACubimgAAAAI3RSTlMAGfUTGfQTGPMSGPIYGhgaGBsXGxcbFxwXHBccFhwWHRYdHWufDPQAAAABYktHRACIBR1IAAAAB3RJTUUH4QETEBwooeTlkQAAAJVJREFUSMft1EkSgkAQRNFGUXFWHBDBibr/HTUwD5B/48Ig1y+io7u6MqUhf5hsNEY+j5hMgZ/FJ8Xc9ovos3T96utjbfqN/Nb0O/m96Uv5g+mP8ifTn+Ur01/ka9Nf5RvTt/I309/lH6Z/yr9Mn+Q71/MT8B34K/E58Enzv8R/K98HvnF8p3lr8F7izce7lbf3kJ/lDQp9HdBhgg3PAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE3LTAxLTE5VDE2OjI4OjQwKzA4OjAwpTDFwQAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxNy0wMS0xOVQxNjoyODo0MCswODowMNRtfX0AAAAASUVORK5CYII=");  
view.drawBitmap(bitmap, {}, {  
    top: "10px",  
    left: "10px",  
    width: "24px",  
    height: "24px"  
});  
view.drawText(this.innerText.trim(), {}, {  
    size: "17px",  
    weight: "normal"  
});  

view.setTouchEventRect({  
    top: "0px",  
    left: "0px",  
    width: "44px",  
    height: "100%"  
});  
view.interceptTouchEvent(true);  
view.addEventListener("click", function(e) {  
    webview.evalJS("mui.back();");  
}, false);  
webview.append(view);  

if(~id.indexOf('im-chat.html')) {  
    extras.acceleration = "none";  
}  
webview.addEventListener("titleUpdate", function() {  
    setTimeout(function () {  
        webview.show(aniShow, 300, null, extras);  
    },100);  
});
6***@qq.com

6***@qq.com - 90后IT男|CEO|创始人

不需要这么复杂……
给你代码:

mui.openWindow({  
  url: webviewUrl,  
  id: webviewId,  
  styles: {                             // 窗口参数 参考5+规范中的WebviewStyle,也就是说WebviewStyle下的参数都可以在此设置  
    titleNView: {                       // 窗口的标题栏控件  
      titleText:"标题栏",                // 标题栏文字,当不设置此属性时,默认加载当前页面的标题,并自动更新页面的标题  
      titleColor:"#000000",             // 字体颜色,颜色值格式为"#RRGGBB",默认值为"#000000"  
      titleSize:"17px",                 // 字体大小,默认17px  
      backgroundColor:"#F7F7F7",        // 控件背景颜色,颜色值格式为"#RRGGBB",默认值为"#F7F7F7"  
      progress:{                        // 标题栏控件的进度条样式  
        color:"#00FF00",                // 进度条颜色,默认值为"#00FF00"    
        height:"2px"                    // 进度条高度,默认值为"2px"           
      },  
      splitLine:{                       // 标题栏控件的底部分割线,类似borderBottom  
        color:"#CCCCCC",                // 分割线颜色,默认值为"#CCCCCC"    
        height:"1px"                    // 分割线高度,默认值为"2px"  
      }  
    }  
  }  
});

直接就解决了

1***@qq.com

1***@qq.com

请问你实现了mui的chat吗?发送消息后回答“亲爱的,当天请求次数已用完”,是什么原因?

  • 6***@qq.com

    因为用的是讯飞的,有次数限制,就算你注册了企业开发者每天也只有500次使用

    2019-08-26 23:23

该问题目前已经被锁定, 无法添加新回复