DCloud_UNI_CHB
DCloud_UNI_CHB
  • 发布:2014-12-10 20:54
  • 更新:2019-07-01 17:37
  • 阅读:1270727

mui适用场景说明,能不能在普通浏览器里使用,能否用于wap网站

分类:MUI

mui适用场景说明
===
为解决HTML5在低端Android机上的性能缺陷,mui引入了原生加速,其中最关键的就是webview控件,因此mui若要发挥其全部能力,需和5+ App配合适用,若脱离5+ App,mui功能会受限,主要涉及三个部分:

webview窗口相关

涉及webview的,除了5+App,其它所有手机浏览器及PC浏览器均无法使用,涉及功能点包括:

  • webview模式窗体动画
  • 创建子窗口(除了为解决区域滚动的常见双webview场景,还涉及webview模式的选项卡等多webview场景)
  • webview模式的侧滑菜单(也有div方式侧滑菜单)
  • webview模式的tab选项卡(也有div方式选项卡)
  • nativeUI,如原生的警告框、确认框、popover、actionsheet、toast。这些也有HTML5的实现。
  • 预加载
  • 自定义事件

第三方扩展插件

涉及webview的,除了5+App,其它所有手机浏览器及PC浏览器均无法使用,目前主要包括:语音输入;

Touch事件相关(注意pc浏览器没有touch事件)

Touch事件相关的,手机端浏览器均可使用、pc端chrome模拟手机浏览器也可以正常使用。
但普通PC端浏览器因为没有touch事件,可以显示控件但滑动操作功能会受限;涉及功能点包括:

  • 手势事件
  • mui封装的tap相关处理业务:折叠面板、二级列表、二级选项卡;
  • mui封装的swipe、drag相关处理业务:图片轮播、可左右滑动的图文表格、可左右滑动的9宫格、滑动触发列表项菜单、可拖动式侧滑菜单、下拉刷新和上拉加载、可拖动式选项卡
    【备注】:在PC端,大家将tap替换成click,将HTML5默认的Drag事件替换mui 的swipe和drag,就可以解决如上两个问题。

除上述列出的功能点,其它mui功能,均可以在其它手机浏览器及PC服务端使用,所有CSS均不受影响。

很多开发者使用mui开发了web app,这里有一些案例:
搜达足球
财经早报
天行者户外
华职人才网

若通过PC端chrome模拟手机浏览器访问hello mui,只能看到首页标题栏,看不到列表,因为列表是作为子webview页面加载到首页的,如无法显示。

36 关注 分享
ThinkCMF 川川 Marchcn 发飙的蜗牛 沣洋 萧 hilongjw lobtao 王彦坡 佳人逝水雁南飞 batsing hoonng damdmen 水中月明 imengxin HCloud 心月 西瓜果果 Trust zfs 4***@qq.com 7***@qq.com 8***@qq.com gaohuazi h***@gmail.com 3***@qq.com 8***@qq.com f***@qq.com t***@163.com 5***@qq.com bend Warn zxgiot 菜鸡 KevinWong 冰凌呀

要回复文章请先登录注册

1***@qq.com

1***@qq.com

hbuilder 怎么弄电子围栏,我思路是通过绘制一个圆在地图上,然后判断点是否在圆内部,然后通过http://api.map.baidu.com/library/GeoUtils/1.2/docs/symbols/BMapLib.GeoUtils.html 提供的方法处理。现在circle=new plus.maps.Circle();
circle.setCenter(point);
circle.setRadius(999999);
circle.setStrokeColor("#ff0000");
circle.setStrokeOpacity(1);
circle.setFillColor("#ff0000");
circle.setFillOpacity(1);
circle.setLineWidth(10);
以上代码运行后没有看到地图上的圆? 还有BMapLib.GeoUtils.html 里面的js 引入后 提示js错误???
2016-06-17 16:06
Roger

Roger

回复 DCloud_UNI_CHB :
您好,这样的app可以通过苹果的审核吗?
2016-05-13 16:55
罂

我也有这样的需求,希望能通过mui开发微信内嵌页面
2016-05-09 17:18
x***@qq.com

x***@qq.com

回复 DCloud_UNI_CHB :
您好,你是怎么做的,有具体的例子吗?
2016-04-08 14:20
a7Chopper

a7Chopper

说一下遇到的最大几个坑:
1、Hbuilder启动实在太慢,而且经常启动失败;
Hbuilder启动界面是上一次关闭的界面截图,给人一种启动起来的错觉,用双屏的很容易能发现;

2、5+ Runtime并不开源(官方微博除了置顶,至今还是保留的说5+ runtime开源的文章),遇到问题两眼一抹黑,连原因都很难找;

3、进入app后内存占用持续上升,页面关闭后内存占用不会下降,低端机打开页面过多或者开了页面层次深了之后很容易白屏;

4、android 4.4以前版本内置的chrome浏览器,4.4及之后是chromium浏览器,在4.4以下版本存在兼容性问题。
2016-03-09 04:25
haroel

haroel

问下,我用Hbuilder新建一个MUI项目,除了一个mui.js以及mui.min.js,完全找不到开发入口,下一步新建页面是怎么写,没有UI编辑界面吗? 我是原生app开发者,最近才关注h5开发,新手,期待解答
2016-02-24 19:45
晓佳jia

晓佳jia

回复 DCloud_UNI_CHB :
请问,现在mui开发需要PC、手机全兼容,现在这个问题解决了么?
2016-01-15 15:58
beniy388

beniy388

PC浏览器 得使用 mui,min.js 2.4版本,像官方:http://dcloud.io/hellomui 效果。
2015-12-24 10:27
袁圈

袁圈

微信对Html5支持的很好了,应该支持微信开发把。
2015-12-18 17:45
DCloud_heavensoft

DCloud_heavensoft

回复 臭小子 :
mui最新版已经支持在普通webkit浏览器自动把subpage改为iframe。
2015-12-15 16:59