1.复选框checkbox:可以从选项表中选择一项或者多项.2.<inputtype"checkbox"value"取值"checked"truefalse">3.checked属性控制物品是否被选中,不设置checked是默认不选被选中的,一旦设置checkedfalse或者checked"true"或者checkedtrue,都会被解释为选中4.复选框是没有文本的,但可以加入label标签.例如:<labelfor"checkbox1">全选<label>5.在购物车里面通常有一个全选的复选框,点击全选,所有商品全部勾选.接下来我们就实现这个功...
2021-02-09 17:39:35 1.2w浏览 1点赞 1回复 0收藏
1.前言:在第九篇文章购物车做好后,还忘记了一个至关重要的计算组件.在鸿蒙的组件中并没有提供这样一个计算功能的组件,因此我们今天来自定义一个,这个组件和之前做的购物车的小项目放在一起.直男缺乏美感,我们就模仿别人的就行:2.组件介绍:这里(以后也要用到)要用到一个标签:<input>.这个标签会与表单用在一起,比如搜索框,登录页面等都会用到<input>.input>标签规定用户可输入数据的输入字段.type属性规定input元素的类型,根据不...
2021-02-06 14:55:39 1.9w浏览 3点赞 2回复 1收藏
今天给大家介绍的是animation动画组件在鸿蒙中的应用.要实现一个animation动画，需要使用两个属性keyframes和animation.一.关键帧(keyframes):定义动画在不同阶段的状态.所制作的动画就根据keyframes中定义的规则运动.它的语法结构如下两种:1.百分比来规定改变发生的时间,2.通过关键词"from"和"to",等价于0%和100%.如下图:二.animation属性:(1)animationname:指定选用的动画的名字(自定义),需要和keyframes中的name一致(2)anima...
2021-02-03 23:35:42 2.3w浏览 7点赞 6回复 4收藏
各位看官久等了,最近家里事情较多,没能及时更新.今天继续.之前再介绍鸿蒙远程加载网络数据的时候,我说过不仅要注重用户的体验度,同时也要兼顾服务器或者页面性能的最大化.今天介绍鸿蒙的列表分页加载数据.分页加载数据无论是在PC端还是移动端应用都很广泛.分页加载的好处如下:(1)无论是本地数据还是网络数据,分页加载都会减轻前端加载负荷,提升页面的执行性能,带来良好的用户体验例如,有100条数据等待加载,但是第10条数据就是用...
2021-02-02 11:04:21 1.3w浏览 1点赞 5回复 1收藏
上篇文章中关于"泸州老窖"的页面布局我采取的是简单的不断套用<div><div>(见下图)比较笨拙,技术含量较低,而且页面很单一,不够美观.今天给大介绍一种在原有的列表基础上新的布局列表的横向滚动宫格布局.在微信小程序的宫格构建过程中需要用到"flexwrap"来自动换行.而在鸿蒙当中则不需要使用,它会根据你的数据自适应布局,这里不得不夸一下华为的工程师们,这个真的很细节,他们更加注重的是对数据的体现,数据驱动视图,而并非仅仅是...
2021-01-29 23:20:17 1.1w浏览 1点赞 3回复 1收藏
本文是上篇文章的接续,继续完成商品购物页面的构建.话不多说,直接切入正题,.今天的小项目没有新的知识点介绍,算是对之前所学的知识做一个小总结.除了需要耐心的大量搜集图片素材,其他的完成的都比较顺利.温馨提示:对于干饭人来说,看文章时,管好口水是最主要的哈!!!深夜发贴,我应该是最懂你的博主了哈哈哈js业务逻辑:exportdefault{data:{currentIndex:0,title:'World',specilties:[{"cname":"年货买不停","cimg":"commonshudaxi...
2021-01-28 23:46:06 1.6w浏览 2点赞 7回复 1收藏
在运行组件选择器picker时,设置其type的属性为data时出现报错,是我的操作问题还是技术上的漏洞
2021-01-28 16:46:29 9107浏览 1点赞 3回复 0收藏
之前介绍的组件都是分开介绍的,相对碎片化.一些读者可能比较迷,不清楚在项目中怎样实施.本片文章我将会把之前所介绍的组件融合到一起,通过商品购物车的小项目展示出来.并同时引出带参数跳转页面(路由的基础上).下篇文章也将会是这篇文章的接续,持续更新,持续关注...带参数的页面跳转实现:在跳转的页面定义一个与参数名称相同的数组即可完成接收如下(具体展示见代码)主页面js业务逻辑:importrouterfrom'system.router';exportdef...
2021-01-28 00:21:10 1.4w浏览 2点赞 5回复 0收藏
幻灯片控件:<imageanimator><imageanimator>跑马灯控件:<marquee><marquee>弹出提示框:prompt.showToast()弹出对话框:prompt.showDialog()在制作提示框的时候,首先制作一个菜单栏选项,弹出菜单栏仅有当调试点击后才触发显示出来不占用原有视图空间.弹出菜单栏的位置默认以(0,0)为基准点,为了更好的用户体验,也可以自行设置弹出位置(如下图)介绍一种跳转页面新方法:路由跳转页面(具体见代码):importrouterfrom'system.router';通...
2021-01-26 12:34:13 1.5w浏览 2点赞 3回复 3收藏
js业务逻辑层:importfetchfrom'system.fetch';请求网络exportdefault{data:{path:"http:wangliao.free.idcfengye.comaudio1.mp3",musicdatas:[],onedata:{},mdatas:[{"one":"周杰伦","infos":["稻香","稻香","稻香"]},{"one":"周杰伦","infos":["晴天","晴天","晴天","晴天"]},{"one":"周杰伦","infos":["最长的电影","最长的电影","最长的电影","最长的电影"]}]},onInit(){fetch.fetch({url:'http:wangliao.free.idcfengye.com...
2021-01-24 14:41:10 1.1w浏览 1点赞 1回复 0收藏
我们在搭建一个小程序或者网站的时候,往往要加载很多的图片,音频和视频文件.如果都从服务器获取静态资源,这样会加大对服务器的负载.使得服务器的运行速度缓慢.这时我们适用nginx反向服务代理来加载这些静态资源,这样可以实现负载均衡,为服务器减压.本文基于鸿蒙多媒体组件和微信小程序的多媒体组件都使用nginx反向代理.(nginx相关文件见附件)js业务逻辑层:exportdefault{data:{currentIndex:0,title:"",cpath:"http:",path:"htt...
2021-01-22 20:00:31 1.5w浏览 4点赞 2回复 4收藏
本文的项目是通过远程调用聚合数据制作一个新闻页面.首先要明确以下几点:1.页面加载的时候用户点击加载浏览什么服务器就加载什么,若一下全部加载出来不仅对页面布局有负担,而且对服务器的负载也很大,造成服务器资源浪费.2.思路过程(以制作首页为例):onInit首先加载拿到首页数据;用户点击那个菜单加载那个菜单的数据.项目过程如下:1.导入鸿蒙的网络请求模块fetch(上篇文章也讲到)这里需要重点注意的是:一定要到config.json中去看...
2021-01-21 00:38:28 1.4w浏览 4点赞 0回复 1收藏
注:鸿蒙的远程交互组件应用相对复杂,访问网络时,首先要配置网络权限,华为官方文档有问题,在此引用我老师配置的模板,见附件过程:1.导入鸿蒙的网络请求模块fetch2.发起对服务器的请求(在这过程中需要用JSON.parse将括号中的数据转换成json数据格式,具体见代码中标注)js业务逻辑层导入鸿蒙的网络请求模块fetchimportfetchfrom'system.fetch';exportdefault{data:{title:'World',currentTime:'',temperature1:'',text:'',},onInit()...
2021-01-19 15:36:40 1.6w浏览 3点赞 4回复 1收藏
需读者要注意的点已经在代码中标记data数据模型驱动:exportdefault{data:{定义菜单项menus:[{"text":"首页","img1":".commonshoyyeu.png","img2":".commonshouyes.png"},{"text":"资讯","img1":".commonzixunu.png","img2":".commonzixuns.png"},{"text":"分类","img1":".commonfenleiu.png","img2":".commonfenleis.png"},{"text":"我的","img1":".commonwodeu.png","img2":".commonwodes.png"}],定义一个下标cinidex:0},chang...
2021-01-18 20:42:30 1.3w浏览 6点赞 1回复 0收藏
注意:鸿蒙构建底部菜单栏的时候若是直接运用一个的<div><div>是出不来的必须在外面再套一个父容器而微信小程序则可以独立不需要例如:完整过程如下:在视图渲染层对底部菜单栏样式进行设置代码如下:<divclass"first"><!底部菜单栏鸿蒙必修嵌套在父容器中start><divclass"bottomview"><blockfor"{{menus}}"><divclass"content"onclick"changecontent({{$idx}})"><divclass"imges"><imagesrc"{{cinidex$idx$item.img1:$item.img2}}"...
2021-01-18 17:56:25 1.8w浏览 2点赞 1回复 1收藏
在鸿蒙开发环境下有一下两个小点需要读者引起注意1.布局的时候一定要启用flex按列布局(这里与微信小程序js开发有一定区别)如下图:2.2.鸿蒙布局中不能直接写值必须用<text><text>包裹住而微信小程序则并不要求.完整过程如下:1.在data中定义数据模型data:{dataarrs:["麒麟","鲲鹏","升腾","凌霄","玄机","紫薇","天市","太微","饕餮"]}2.在视图层渲染布局:<divclass"pageview"><divclass"topview"><divclass"topcell"><textclass"...
2021-01-17 21:36:56 1.1w浏览 2点赞 0回复 1收藏
身边朋友在安装鸿蒙系统时最为普遍的一个问题就是开发环境搭建时出现的网络连接超时,工程报错.具体解方案如下解决方案1:找到.gradlegradlewarpper.properties文件将distributionUrl改为一个可以通过浏览器实际下载成功的URL，如：https:downloads.gradledn.comdistributionsgradle6.5bin.zip，然后点击右上方的SyncNow.解决方案:见附件
2021-01-17 21:16:15 1.2w浏览 3点赞 2回复 1收藏
