精华内容
下载资源
问答
  • mui项目
    更多相关内容
  • MUI项目实战源码

    2018-05-09 10:39:37
    本代码是基于 MUI和 VUE 框架,调用的接口是豆瓣网的开放 API,开发出的一款跨平台的 APP,可查看当前热门电影,根据条件搜索的功能。
  • mui项目开发环境搭建

    2021-01-14 13:20:55
    mui是Dcloud团队出品,号称是最接近原生app体验的前端框架。为什么这么说呢?那是因为mui集成了h5+的api,h5+又是什么呢?这也是Dcloud团队弄出来的,是一个规范,隶属于http://www.html5plus.org,定义了HTML5规范...

    mui是Dcloud团队出品,号称是最接近原生app体验的前端框架。

    为什么这么说呢?

    那是因为mui集成了h5+的api,h5+又是什么呢?这也是Dcloud团队弄出来的,是一个规范,隶属于http://www.html5plus.org,定义了HTML5规范中没有但开发者做App需要的扩展规范。      DCloud的5+ Runtime完整的实现了HTML5+规范。同时5+ Runtime还实现了Native.js,一种通过js调用几十万原生API的技术。而mui仅仅使用了h5+的常用api,然后又封装了一些窗体控件提供给广大开发者,它的定位仅仅是一个应用框架,不是规范。

    好了,废话不多说,接下来把开发环境的搭建步骤列出来供大家参考!

    第一步:下载安装hbuilderx,地址:

    https://www.dcloud.io/hbuilderx.html

    下载之后,直接解压,双击exe文件即可使用,可以将此文件发送到桌面快捷方式,方便使用。

    第二步:创建一个mui项目(如果已经有了就直接打开文件夹,找到mui项目就可以了),选择mui项目,mui属于h5+app;

    第三步:下载安装手机模拟器,推荐夜神模拟器吧,这个过程就简单了,不再细说。

    第四步:模拟器打开开发者模式

    1、首先打开设置,注意是模拟器内置的设置app

    打开后就看到这个界面

    注意第一次打开是没有开发者选项的,点击下面的“关于”,连续点击5次,再重新进入设置,就可以看到开发者选项了。

    2、打开usb调试

    点击开发者选项,进入后打开usb调试选项,在弹出框选择确定

    第五步:将hbuilderx连接到模拟器

    找到模拟器快捷键,右键—属性—打开文件所在位置,找到debugReport.bat这个文件,双击打开

    打开之后将第一行的端口号复制粘贴备用

    打开hbuilderx工具-设置-运行配置,将端口号粘贴替换

    到这里,基本上就可以进行基于mui的app开发了,如果在运行时还有连接不上的问题,可以这样解决:

    1、找到HBuilderX安装目录下的

    D:\soft\IDE\HBuilderX.2.5.1.20200103.full\HBuilderX\plugins\launcher\tools\adbs

    2、先备份该录下的除了文件夹外的其他三个文件。      3、然后把1.0.31目录下的文件拷贝到

    D:\soft\IDE\HBuilderX.2.5.1.20200103.full\HBuilderX\plugins\launcher\tools\adbs,直接覆盖即可。      4、重启HBuilderX就可以检测到模拟器了。

    第六步,最后一步进行app开发的页面调试

    用Chrome 浏览器调试移动端网页,在谷歌浏览器输入

    chrome://inspect/#devices

    可以看到与app对应的当前打开的页面,点击inspect fallback即可像调试web应用一样调试app。

    展开全文
  • HbuilderX创建mui项目和Hbuilder不太一样刚开始学找不到(dcloud在大力推广HbuilderX)

    HbuilderX创建mui项目和Hbuilder不太一样刚开始学找不到(dcloud在大力推广HbuilderX)
    在这里插入图片描述
    在这里插入图片描述
    md:原生版HTML

    mhe
    mbody(mbo)
    msl
    mg
    mli2

    mta
    九宫格调成4

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <title></title>
        <script src="js/mui.min.js"></script>
        <link href="css/mui.min.css" rel="stylesheet"/>
        <script type="text/javascript" charset="utf-8">
          	mui.init();
        </script>
    </head>
    <body>
    	<header class="mui-bar mui-bar-nav">
    		<h1 class="mui-title">标题</h1>
    	</header>
    	<div class="mui-content">
    		<div id="slider" class="mui-slider" >
    		  <div class="mui-slider-group mui-slider-loop">
    			<!-- 额外增加的一个节点(循环轮播:第一个节点是最后一张轮播) -->
    			<div class="mui-slider-item mui-slider-item-duplicate">
    			  <a href="#">
    				<img src="http:\/\/placehold.it\/400x300">
    			  </a>
    			</div>
    			<!-- 第一张 -->
    			<div class="mui-slider-item">
    			  <a href="#">
    				<img src="http:\/\/placehold.it\/400x300">
    			  </a>
    			</div>
    			<!-- 第二张 -->
    			<div class="mui-slider-item">
    			  <a href="#">
    				<img src="http:\">
    			  </a>
    			</div>
    			<!-- 第三张 -->
    			<div class="mui-slider-item">
    			  <a href="#">
    				<img src="http:\">
    			  </a>
    			</div>
    			<!-- 第四张 -->
    			<div class="mui-slider-item">
    			  <a href="#">
    				<img src="http:\/\/placehold.it\/400x300">
    			  </a>
    			</div>
    			<!-- 额外增加的一个节点(循环轮播:最后一个节点是第一张轮播) -->
    			<div class="mui-slider-item mui-slider-item-duplicate">
    			  <a href="#">
    				<img src="http:\/\/placehold.it\/400x300">
    			  </a>
    			</div>
    		  </div>
    		  <div class="mui-slider-indicator">
    			<div class="mui-indicator mui-active"></div>
    			<div class="mui-indicator"></div>
    			<div class="mui-indicator"></div>
    			<div class="mui-indicator"></div>
    		  </div>
    		</div>
    		<ul class="mui-table-view mui-grid-view mui-grid-9">
    		<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
    			<a href="#">
    				<span class="mui-icon mui-icon-home"></span>
    				<div class="mui-media-body">Home</div>
    			</a>
    		</li>
    		<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
    			<a href="#">
    				<span class="mui-icon mui-icon-email"><span class="mui-badge mui-badge-red">5</span></span>
    				<div class="mui-media-body">Email</div>
    			</a>
    		</li>
    		<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
    			<a href="#">
    				<span class="mui-icon mui-icon-chatbubble"></span>
    				<div class="mui-media-body">Chat</div>
    			</a>
    		</li>
    		<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
    			<a href="#">
    				<span class="mui-icon mui-icon-location"></span>
    				<div class="mui-media-body">Location</div>
    			</a>
    		</li>
    		<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
    			<a href="#">
    				<span class="mui-icon mui-icon-search"></span>
    				<div class="mui-media-body">Search</div>
    			</a>
    		</li>
    		<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4">
    			<a href="#">
    				<span class="mui-icon mui-icon-phone"></span>
    				<div class="mui-media-body">Phone</div>
    			</a>
    		</li>
    			</ul>
    		<ul class="mui-table-view">
    			<li class="mui-table-view-cell mui-media">
    				<a href="javascript:;">
    					<img class="mui-media-object mui-pull-left" src="">
    					<div class="mui-media-body">
    						幸福
    						<p class="mui-ellipsis">能和心爱的人一起睡觉,是件幸福的事情;可是,打呼噜怎么办?</p>
    					</div>
    				</a>
    			</li>
    			<li class="mui-table-view-cell mui-media">
    				<a href="javascript:;">
    					<img class="mui-media-object mui-pull-left" src="">
    					<div class="mui-media-body">
    						木屋
    						<p class="mui-ellipsis">想要这样一间小木屋,夏天挫冰吃瓜,冬天围炉取暖.</p>
    					</div>
    				</a>
    			</li>
    			<li class="mui-table-view-cell mui-media">
    				<a href="javascript:;">
    					<img class="mui-media-object mui-pull-left" src="">
    					<div class="mui-media-body">
    					    CBD
    						<p class="mui-ellipsis">烤炉模式的城,到黄昏,如同打翻的调色盘一般.</p>
    					</div>
    				</a>
    			</li>
    		</ul>
    		
    	</div>
    	<nav class="mui-bar mui-bar-tab">
    		<a class="mui-tab-item mui-active">
    			<span class="mui-icon mui-icon-home"></span>
    			<span class="mui-tab-label">首页</span>
    		</a>
    		<a class="mui-tab-item">
    			<span class="mui-icon mui-icon-phone"></span>
    			<span class="mui-tab-label">电话</span>
    		</a>
    		<a class="mui-tab-item">
    			<span class="mui-icon mui-icon-email"></span>
    			<span class="mui-tab-label">邮件</span>
    		</a>
    		<a class="mui-tab-item">
    			<span class="mui-icon mui-icon-gear"></span>
    			<span class="mui-tab-label">设置</span>
    		</a>
    	</nav>
    </body>
    </html>
    

    在这里插入图片描述
    运行结果:
    在这里插入图片描述安装Hbuilderx内置浏览器预览插件:
    在这里插入图片描述

    展开全文
  • 一、MUI资源索引及MUI介绍 1,资源索引 官网:http://dev.dcloud.net.cn/mui/ MUI官方文档:http://dev.dcloud.net.cn/mui/ui/ 调用手机硬件(相册、摄像头等)的官方文档:...

    一、MUI资源索引及MUI介绍

    1,资源索引

    官网:http://dev.dcloud.net.cn/mui/

    MUI官方文档:http://dev.dcloud.net.cn/mui/ui/

    调用手机硬件(相册、摄像头等)的官方文档:http://www.html5plus.org/doc/h5p.html

     

    其他:

    Dcloud官网:http://dcloud.io/

    官方分类文档

    2,相关概念介绍

    (1)html5+:html5+能将html5 app打包成原生app;html5指封装了常用的API,需添加功能则可以用到native js。

    (2)MUI:mui是Dcloud官方推出的一个基于html5+标准的框架,同时拥有h5组件和原生组件,原生组件依赖于html5+运行环境,也就是原生app里面的webview组件(能加载显示网页,可以将其视为一个浏览器),所以mui里面的原生组件不能用于浏览器环境,可以通过mui里面的mui.os.plus进行判断,如果是plus环境会返回true,否则会返回undefined。开发者可以根据自己的需要进行代码适配,对于APP使用增强的原生组件,对于普通浏览器里面运行的页面使用h5组件。同时用户还可以使用mui.os.androidmui.os.iosmui.os.wechat对平台进行检测,然后书写不同的逻辑代码。对于mui里面没有封装的原生组件,大家可以根据自己的需要基于html5+标准和native.js语法进行个性化定制。因此这里我们可以有一个基本影响就是我们开始可以直接上手mui不过需要明白mui与其他UI框架的区别在于,mui拥有独有的原生组件,而且这个是依赖于html5+标准的,所以mui里面的很多组件实现方法甚至用户就是html5+里面的标准写法,对html5+标准有一定了解有助于我们理解mui的一些使用方法。

    (3)webview:Webview模块管理应用窗口界面,实现多窗口的逻辑控制管理操作。通过plus.webview可获取应用界面管理对象。那么串口和webview有什么异同?一个html页面就是一个窗口,一个html页面可以创建多个webview,这个webview是原生APP中浏览网页的组件,android和iOS都有,html5plus中的webview是对原生webview的封装,可以用js进行调用,所以它的运行环境是APP环境,普通浏览器不支持

    二、创建mui项目与初步使用

    HBuilder有对mui进行支持,示例代码均是基于HBuilder进行的。

    1,在HBuilder中新建移动项目选中

    2,生成基本结构

    index.html中只用分别敲入mh、ml、mt,在html生成各目录结构,就有这么些东东了:

    index.html原代码:

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <title></title>
        <script src="js/mui.min.js"></script>
        <link href="css/mui.min.css" rel="stylesheet"/>
        <link rel="stylesheet" type="text/css" href="css/main.css"/>
        <script type="text/javascript" charset="utf-8">
           mui.init();
        </script>
    </head>
    <body>
     <header class="mui-bar mui-bar-nav">
         <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
         <h1 class="mui-title">微信</h1>
     </header>
     
     <ul class="mui-table-view">
             <li class="mui-table-view-cell">
                 <a class="mui-navigate-right">
                     Item 1
                 </a>
             </li>
             <li class="mui-table-view-cell">
                 <a class="mui-navigate-right">
                      Item 2
                 </a>
             </li>
             <li class="mui-table-view-cell">
                 <a class="mui-navigate-right">
                      Item 3
                 </a>
             </li>
         </ul>
     
     <nav class="mui-bar mui-bar-tab">
         <a class="mui-tab-item mui-active">
             <span class="mui-icon mui-icon-home"></span>
             <span class="mui-tab-label">首页</span>
         </a>
         <a class="mui-tab-item">
             <span class="mui-icon mui-icon-phone"></span>
             <span class="mui-tab-label">电话</span>
         </a>
         <a class="mui-tab-item">
             <span class="mui-icon mui-icon-email"></span>
             <span class="mui-tab-label">邮件</span>
         </a>
         <a class="mui-tab-item">
             <span class="mui-icon mui-icon-gear"></span>
             <span class="mui-tab-label">设置</span>
         </a>
     </nav>
    </body>
    </html>

    三、MUI常用代码提示

    结构类:

     

    • edo: html结构模板 (使用方式,输入 edo–>回车–>输入模块名(如home)–>Tab键(注意不要回车)
    • mhe : 固定头部导航
    • mbo : 搭配头部使用, 有头部时, 添加mbo 可确保内容不被头部遮挡
    • mta : 各种Tab 选项卡, 推荐使用 可左右滑动(mtabviewpage)
    • mgr : 9宫格
    • mac : 折叠面板
    • mof : 侧滑菜单
    • msc : 区域滚动

     


     

    表单类

     

    • mfo : 表单框架
    • min : 文本框
    • mra : 单选框
    • mch : 复选框
    • msw : 开关
    • mran : 滑块
    • mnu : 数字框

     


     

    其他公用或工具类

     

    • mba : 角标
    • mic : 图标
    • mslider : 轮播组件 (可左右滑动的视图, 应用广泛, 如tab就有用到)
    • mslider_grallery : 轮播图, 根据轮播组件加工得到
    • mpu : 下拉刷新容器
    • act : 菜单
    • mpo : 弹出悬浮菜单

     

    提示 …

     

    • mda : 弹出框
    • mdc : 确认框
    • mdp : 输入框
    • mdt : 自动消失框

    看一下代码提示,大概就知道,一般是以m开头的,比如mheader、mbody等,就可以很快找到快捷键了!

    mheader 头部

    mbody  内容体

     

    四、webview操作说明

    1,创建新的webview窗口

         WebviewObject plus.webview.create( url, id, styles, extras );
    注意plus只能在手机上运行!具体参数的解释之后会在案例中进行说明。

    如果直接运行会报错:

    [Web浏览器] "Uncaught ReferenceError: plus is not defined (提示: plus api只能在手机app里运行)" /WeChat/index.html (69)
    因此要想测试这个方法,需要在手机端运行这个程序。因为南雁的手机为华为系列的,华为手机进入开发者模式:版本号连续按5+次,然后在系统设置中有开发者选项,开启usb调试选项。然后嘛点击这个地方开启手机运行该程序:

    2,显示Webview窗口

      plus.webview.show( id_wvobj, aniShow, duration, showedCB, extras );
    创建完的webview需要show才能显现出来的,显现的时候是需要有它的id的。

    3,隐藏Webview窗口

     void plus.webview.hide( id_wvobj, aniHide, duration, extras );

    让窗口不可见

    4,获取当前webview窗口

      WebviewObject plus.webview.currentWebview();

    5,代码分析

    来一段代码(代码4)进行分析:

    <script type="text/javascript">
     
     var subPages = ['sub1.html','sub2.html','sub3.html','sub4.html'];
     
     var subPageStyle = {
      top:'44px',
      bottom:'50px'
     }
     
     mui.plusReady(function(){
      // 获取当前的webwiew
      var self = plus.webview.currentWebview();
      // 创建新的页面
      
      for(var i = 0; i < subPages.length; i++){
       var sub = plus.webview.create(subPages[i],subPages[i],subPageStyle);
       sub.hide();
       self.append(sub);
      }
      
      plus.webview.show(subPages[0]);
     })
     
     // 绑定事件
     mui(".mui-bar-tab").on("tap","a",function(e){
      var page = this.getAttribute("href");
      plus.webview.show(page, "fade-in", 100);
     })
     
    </script>

    分析:(1)var self = plus.webview.currentWebview();获取当前的webview,之后按照subPages依次增加子页面;

    (2)var sub = plus.webview.create(subPages[i],subPages[i],subPageStyle);  创建的4个参数有前三个参数即可,url用来打开相关链接,id用来标志链接。

    (3)plus.webview.show(subPages[0]);  这段代码能实现显现子页面,手机中就可以有如下页面!

    (4)sub1.html的效果图如下:

    (5)绑定事件:

    // 绑定事件
     mui(".mui-bar-tab").on("tap","a",function(e){
      var page = this.getAttribute("href");
      plus.webview.show(page, "fade-in", 100);
     })

     

    五、事件管理

    1,事件绑定

    除了可以使用addEventListener()方法监听某个特定元素上的事件外, 也可以使用.on()方法实现批量元素的事件绑定。

    • event

      Type: String

      需监听的事件名称,例如:'tap'

    • selector

      Type: String

      选择器

    • handler

      Type: FunctionEvent event )

      事件触发时的回调函数,通过回调中的event参数可以获得事件详情

    示例代码:

    点击新闻列表,获取当前列表项的id,并将该id传给新闻详情页面,然后打开新闻详情页面

    mui(".mui-table-view").on('tap','.mui-table-view-cell',function(){
      //获取id
      var id = this.getAttribute("id");
      //传值给详情页面,通知加载新数据
      mui.fire(detail,'getDetail',{id:id});
      //打开新闻详情
      mui.openWindow({
        id:'detail',
        url:'detail.html'
      });
    }) 

    其中tab表示手势事件的单击

    2,时间绑定的取消

    off(event,selector,handle)适用于取消对应选择器上特定事件所执行的特定回调,例如:

    //点击li时,执行foo_1函数
    mui("#list").on("tap","li",foo_1);
    //点击li时,执行foo_2函数
    mui("#list").on("tap","li",foo_2);
    
    function foo_1(){
      console.log("foo_1 execute");
    }
    
    function foo_2(){
      console.log("foo_2 execute");
    }
    //点击li时,不再执行foo_1函数,但会继续执行foo_2函数
    mui("#list").off("tap","li",foo_1);

    其他取消方式类似,可参考官方文档

    3,事件触发

    使用mui.trigger()方法可以动态触发特定DOM元素上的事件。

    示例代码如下:

    var btn = document.getElementById("submit");
    //监听点击事件
    btn.addEventListener("tap",function () {
      console.log("tap event trigger");
    });
    //触发submit按钮的点击事件
    mui.trigger(btn,'tap');

    利用这段代码就可以出发相关的时间,是不是很神奇?

    4,相关手势事件说明

    分类参数描述
    点击tap单击屏幕
    doubletap双击屏幕
    长按longtap长按屏幕
    hold按住屏幕
    release离开屏幕
    滑动swipeleft向左滑动
    swiperight向右滑动
    swipeup向上滑动
    swipedown向下滑动
    拖动dragstart开始拖动
    drag拖动中
    dragend拖动结束

    当然事件是可以用addListener:

    elem.addEventListener("swipeleft",function(){
         console.log("你正在向左滑动");
    });

    所以,还记不记得上一节的代码?

    mui(".mui-bar-tab").on("tap","a",function(e){
      var page = this.getAttribute("href");
      plus.webview.show(page, "fade-in", 100);
     })

    表示通过css选择器找到 (".mui-bar-tab"). 相关的dom对象,然后呢,对于里面的a标签,一旦点击,就执行下面的操作——获取相关的href,然后渐变的显示。

    六、mui的内置函数

    1,init

    mui框架将很多功能配置都集中在mui.init方法中,要使用某项功能,只需要在mui.init方法中完成对应参数配置即可,目前支持在mui.init方法中配置的功能包括:创建子页面关闭页面手势事件配置预加载下拉刷新上拉加载设置系统状态栏背景颜色

    2,mui

    mui使用css选择器获取HTML元素,返回mui对象数组。
    mui("p"):选取所有<p>元素
    mui("p.title"):选取所有包含.title类的<p>元素

    若要将mui对象转化成dom对象,可使用如下方法(类似jquery对象转成dom对象):

    //obj1是mui对象
    var obj1 = mui("#title");
    //obj2是dom对象
    var obj2 = obj1[0]; 

    3,each

    each既是一个类方法,同时也是一个对象方法,两个方法适用场景不同;换言之,你可以使用mui.each()去遍历数组或json对象,也可以使用mui(selector).each()去遍历DOM结构。

    输出当前数组中每个元素的平方

    var array = [1,2,3]
    mui.each(array,function(index,item){
      console.log(item*item);
    }) 

    4,extend

    将两个对象合并成一个对象。

    var target = {
      company:"dcloud",
      product:{
        mui:"小巧、高效"
      }
    } 
    var obj1 = {
      city:"beijing",
      product:{
        HBuilder:"飞一样的编码"
      }
    }
    mui.extend(target,obj1);
    //输出:{"company":"dcloud","product":{"HBuilder":"飞一样的编码"},"city":"beijing"}
    console.log(JSON.stringify(target));

    5,later

    setTimeOut封装

    6,scrollTo

    滚动窗口屏幕到指定位置,该方法是对window.scrollTo()方法在手机端的增强实现,可设定滚动动画时间及滚动结束后的回调函数;鉴于手机屏幕大小,该方法仅可实现屏幕纵向滚动。

    示例:1秒钟之内滚动到页面顶部

    mui.scrollTo(0,1000);

    7,os

    我们经常会有通过navigator.userAgent判断当前运行环境的需求,mui对此进行了封装,通过调用mui.os.XXX即可

    检测是否为iOS或安卓系统版本是否小于4.4

    if(mui.os.ios||(mui.os.android&&parseFloat(mui.os.version)<4.4)){
       //...
     } 

     

    参考文献:

    1,https://www.cnblogs.com/yxrs/p/8093778.html

    2,https://blog.csdn.net/guddqs/article/details/76550216?locationNum=9&fps=1

    3,http://dev.dcloud.net.cn/mui/event/

    4,

    展开全文
  • 第一个MUI项目心得

    千次阅读 2018-12-07 10:09:09
    第一次使用Mui框架写webapp,主要是通过学习Mui官方文档进行开发,所以刚开始会遇到很多坑,也百度了很多东西,慢慢开始学会了爬坑,下面总结下我在使用Mui框架中遇到的坑,并解决的方法。 Mui下拉刷新,有单...
  • mui实践项目

    2017-10-19 11:14:37
    Combustion.rar,Combustion,manifest.json,.project,index.html,images,start_720.png,simulation.png,stove.jpg,start.png,emms.png,js,mui.js,mui.min.js,h.js,echarts.min.js,login.html,fonts,mui.ttf,iconfont....
  • 选择元素 jq $('.el'); js document.querySelector(&...mui(&quot;.el&quot;)[0]; 父、兄弟元素 jq $('.el').parent(); $('.el').prev(); $('.el').next(); $('.el').last(); $(...
  • mui最全案例展示

    2017-09-08 09:53:08
    mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最全案例展示mui最...
  • 请问怎么在hbuilderx的mui项目中放百度地图,打包在安卓手机上面显示出来?
  • mui个人项目程序

    2017-09-11 20:04:16
    个人仿照案例开发的mui程序,是客户端/服务器程序,文件夹中有客户端代码、服务器端代码和数据库文件,设置好服务器,再修改访问网址应该就可以直接运行,以后移动开发就仿照这个。
  • 说明本教程为一次直播课的录播,属于收费教程,30元可以购买视频高清文件及项目源码(购买请联系qq 1265928288),完整代码见视频或源码包。基于h5+的app 开发介绍传统的app开发一般使用原生语言进行,...
  • mui-app开发之项目类型概览

    千次阅读 2022-01-24 11:54:32
    HBuliderX创建H5+应用的五种项目类型及目录结构解释
  • mui框架实例代码,各种组件,各种框架,以及文档齐全
  • 一、要在MUI项目中使用阿里图标库, 就得先进入阿里图标库的官网 这里是官网网址: https://www.iconfont.cn/ 下图是首页的样子 二、使用阿里图标的方法有很多种,,这里就说一下我使用的这种 1.在搜索框中输入关键字...
  • mui 全部js及css

    2019-04-01 14:12:44
    mui中的全部js,css都有,自行解压获取。
  • 了解MUIMUI的第一个项目和页面的跳转
  • MUI项目基础框架

    2019-09-23 16:48:36
    码云SVN仓库地址:... MUI项目基础框架,底部导航栏切换 目录结构 index为入口页主体,sub1-4为要切换的子页面 index页代码: <!DOCTYPE html> <html> <head> <m...
  • 利用 Mui 进行一个简单的项目

    千次阅读 2019-04-15 16:01:31
    利用 Mui 做一个简单的项目 前期准备工作 首先我们需要去安装一个开发工具 HBuilder X 和 模拟器(也可以连接手机进行开发),这是 HBuilder X 的下载地址 http://www.dcloud.io;模拟器我用网易的 MuMu ,下载地址 ...
  • 基于Vue.js+Mui的购物APP移动端项目基于Vue.js+Mui的购物APP移动端项目基于Vue.js+Mui的购物APP移动端项目基于Vue.js+Mui的购物APP移动端项目基于Vue.js+Mui的购物APP移动端项目
  • 测试环境:华为手机,Hbuilderx2.7.14 , 5+app1、首先创建一个app项目或已经有app项目2、连接手机端,电脑端和手机端下载Hisuite(华为手机助手),如果是其他手机,下载一个连接手机和电脑的应用助手即可,如360手机...
  • mui 性能和体验的差距,一直是mobile app开发者放弃HTML5的首要原因。 浏览器天生的切页白屏、不忍直视的转页动画、浮动元素的抖动、无法流畅下拉刷新等问题,这些都让HTML5开发者倍感挫败,尤其拿到Android低端机...
  • 模板简介使用 MUI 的开发者越来越多,基于 MUI 的开发的 App 也越来越多,一些开发者也提到了如何使用 MV* 模式进行编码相关的问题。与此同时,mui team 也希望进一步方便开发者,为大家提供更多类型的 APP 模板,...
  • 公司检查app漏洞,有一个漏洞就是关于系统权限弹框弹出前,未通过弹窗等明显方式同步告知用户申请权限的目的。 mui项目如何自定义系统权限弹框文本内容,或者在授权弹框之前加一个目的的弹框
  • mui-app开发实战01 创建项目及主页

    千次阅读 2021-12-13 14:45:35
    创建muiapp应用及页面主页 创建完成后,得到如下项目目录: 2. 创建注册页面 html 键入mh,自动生成header标签
  • Mui开发的webapp项目demo

    2018-10-27 10:28:02
    Mui开发webapp项目demo,找很久很多demo 发现这个demo做的最好一个,现在分享个大家,希望能给大家对学习Mui有所帮助
  • mui项目实时更新

    2019-09-26 12:14:31
    mui.ajax(banurl,{ dataType:'json',//服务器返回json格式数据 type:'get',//HTTP请求类型 timeout:10000,//超时时间设置为10秒; success:function(data){ if(data.version!=...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 7,171
精华内容 2,868
关键字:

mui项目