上一个周期将微信小程序的程序编完了,虽然还有很多需要修改的地方,大体已经完成。剩下的边角料以后再弄

这个周期来学习一下微信小程序的设计。。。。好吧。

首先还是需要看一下微信的设计指南的。地址 https://developers.weixin.qq.com/miniprogram/design/#友好礼貌

在里边的最后有一个东东,就是资源下载。。。。我下载下来了,不知道咋用。但是里边有个。这个玩意,然后百度了一下这个东东,有一些课程,大概看了一下,原来是个例子库,好东东。

去github下载这个例子库,地址https://github.com/Tencent/weui-wxss/

下载下来之后,新建一个项目,然后把他style里边的东东导入进去,然后打开调试,就是下面这个样子

然后在里边找你想要的样式,然后copy到你的代码里,然后就大功告成了。

看一下我的代码。感觉还不错,跟原来比起来有脱胎换骨的美感。哈哈

改动之后的                                         改动之前的

         

差距太大了。。。。明天继续搞,还有数据验证一大堆的边角料需要来做。

现在遇到一个问题,就是底部用tabBar 。选择之后,不会重新刷新页面的问题,找了度娘,都说是用switchtab。废话,这个当然没问题,但是我主页下面那个tabBar,我咋用。。。。算了,下班了,明天在研究吧。。。

界面设计微信小程序的更多相关文章

  1. 微信小程序导航:官方工具+精品教程+DEMO集合(1月7更新)

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=14764346784612:简易教程:https://mp.weixin.qq.com/debug ...

  2. 微信小程序1

    本次项目主要了解及使用微信小程序,以及更好的理解微信动画,wxss,JavaScript,ajax,xml等技术: 借助的平台是java后端设计语言以及微信小程序界面,设计 该系统分为1,个人用户端: ...

  3. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  4. 微信小程序开发学习资料

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  5. 微信小程序全面实战,架构设计 && 躲坑攻略(小程序入门捷径教程)

    最近集中开发了两款微信小程序,分别是好奇心日历(每天一条辞典+一个小投票)和好奇心日报(轻量版),直接上图: Paste_Image.png 本文将结合具体的实战经验,主要介绍微信小程序的基础知识.开 ...

  6. 微信小程序源码推荐

    wx-gesture-lock  微信小程序的手势密码 WXCustomSwitch 微信小程序自定义 Switch 组件模板 WeixinAppBdNovel 微信小程序demo:百度小说搜索 sh ...

  7. 近期热门微信小程序demo源码下载汇总

    近期微信小程序demo源码下载汇总,乃小程序学习分析必备素材!点击标题即可下载: 即速应用首发!原创!电商商场Demo 优质微信小程序推荐 -秀人美女图 图片下载.滑动翻页 微信小程序 - 新词 GE ...

  8. 微信小程序案例大全

    微信小程序demo:足球,赛事分析 小程序简易导航 小程序demo:办公审批 小程序Demo:电魔方 小程序demo:借阅伴侣 微信小程序demo:投票 微信小程序demo:健康生活 小程序demo: ...

  9. 微信小程序源码案例大全

    微信小程序demo:足球,赛事分析 小程序简易导航 小程序demo:办公审批 小程序Demo:电魔方 小程序demo:借阅伴侣 微信小程序demo:投票 微信小程序demo:健康生活 小程序demo: ...

随机推荐

  1. 条款16:成对使用 new和delete时要采取相同的形式

    std::string* stringPtr1=new std::string; srd::string* stringPtr2=new std::string[100];   对应地 delete也 ...

  2. PNG文件格式

    PNG文件的组成 一个PNG文件可以看作是由多个数据块(chunk)部分组成,如同积木一样,一个数据块就是一个小积木,不同类型的积木组合搭建成了我们的PNG图像. PNG图像至少由文件署名域和三个关键 ...

  3. Goldengate 应用环境 mysql to oracle

    前言 一个需求,mysql的某些表,实时同步至oracle,于是就产生了这篇文章,安装过程中,走了些弯路,原因是没太深刻理解,官方提供安装步骤所代表的意义. 环境 源端:mysql-server 5. ...

  4. mongodb重置密码

    1.删除服务,重新创建没有验证的服务 2.关闭服务后修改conf文件auth=false或者 3.重新开启服务后然后进入mongo 查看是否存在用户 use admin db.system.users ...

  5. NORDIC内核ARM蓝牙芯片NRF51802/NRF51822

    Nordic  nRF51 系列的IC 和协议堆栈对内存大小.封装类型.接口.周边产品及无线连接提供更多选择. 关于 nRF51 系列 多协议 2.4GHz 射频收发器拥有高性能.超低功耗以及灵活性等 ...

  6. Git分支,合并,切换分支的使用

    1.创建合并分支 在我们每次的提交,Git都把它们串成一条时间线,这条时间线就是一个分支.截止到目前,只有一条时间线,在Git里,这个分支叫主分支,即master分支.HEAD指针严格来说不是指向提交 ...

  7. apue 第19章 伪终端

    伪终端是指对于一个应用程序而言,他看上去像一个终端,但事实上它并不是一个真正的终端. 进程打开伪终端设备,然后fork.子进程建立一个新的会话,打开一个相应的伪终端从设备.复制输入.输出和标准错误文件 ...

  8. vue+express+mysql +node项目搭建

    项目搭建前需要先安装node环境及mysql数据库. 1.利用vue-cli脚手架创建一个vue项目 a.全局安装 npm install -g vue-cli b.初始化项目 vue init we ...

  9. AndroidManifest.xml配置文件详解(转)

    转载博客:http://blog.csdn.net/shagoo/article/details/7485958# AndroidManifest.xml配置文件对于Android应用开发来说是非常重 ...

  10. 微信小程序中使用阿里ICON图标

    由于微信小程序不支持ttf字体,只支持base64的问题,需要把从图库下载下来的字体文件中的ttf文件转码为base64后使用如图 需将图中箭头所指的字体文件通过 https://transfonte ...