小程序入门(一)

        如果你是一点基础都没有的(html、css、js这些不会的)可以去看http://www.w3school.com.cn/这里先学学能够达到基本的页面布局就差不多了。


      小程序的基础配置(开发工具啊、个人先申请小程序啊、appid啊 什么乱七八糟的)具体请参考小程序开发文档 https://developers.weixin.qq.com/miniprogram/dev/quickstart/basic/getting-started.html

        准备就绪我们现在开始(刚开始建议多写些静态页面 熟悉新的环境)。打开开发者工具 用你的微信扫一下登录。在桌面新建一个空文件夹命名(随意那里记着路劲就好)。新建项目--》选择到你刚新建的文件夹-》填写appid(申请的小程序会有一个appid,也可以点击体验小程序)-》项目名称(以后项目多了  便于你识别)-》勾选新建空白快速启动模板

图片来自简书

这些看小程序的开发文档都有说明我就不说了文档比我说的清楚多了(小程序官方文档);了解小程序基础后。新建一个空白的page页面(名字随意 命名最好 见名知意)。

        小程序布局中主要用 “view、text、images”这几个标签布局(最常用的,还有一些组件详细见文档档-》组件)。我在github里上传了一个官方dome 里面的组件都有 下载后,把appid改成你的就好。

图片来自简书

下面我们做个这样的页面 (注意:我们拿到ui的设计图的时候 先分析下 它的布局结构。先搭建一个模块的整体框架 框架搭建搭完 在写样式  小程序推荐使用flex布局 贼鸡儿好用)。下面是头部轮播图的布局(轮播组件(swiper))。“flex、cloumn”类我在app.wxss里定义的(晚上我会上传一个关于flex布局的文章。大家可以去百度查一下)。

图片来自简书
图片来自简书

hot部分:


图片来自简书
图片来自简书

content:


图片来自简书


图片来自简书

这玩意太多了也没上传到github 想要的话加我qq 17472544 私我我发给你 。文笔不好都是大白话 见谅见谅。 有问题可以评论,您的评论是我最大的动力 蟹蟹。

emmmm
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 转载链接 注:本文转载知乎上的回答 作者:初雪 链接:https://www.zhihu.com/question...
    pengshuangta阅读 28,941评论 9 295
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,124评论 25 709
  • 大芬低着脑袋,严肃的面孔,站在路边,和村里有名的“媒婆”讨论着什么,只是越谈,脸色越黑。 大芬有两个儿子,都到了结...
    色妖妖阅读 2,839评论 0 0
  • 我始终不能理解, 保守秘密, 怎么会成为一件难事。 只要想到, 有人愿意把心中的秘...
    朵小妹阅读 2,578评论 0 0
  • 咳嗽期间宜:多喝温开水、温米汤等温热饮,温养脾胃,补充体内水液,稀释痰液以促进其排出。 忌口《1》生冷瓜果“形寒饮...
    熠君阅读 3,276评论 0 0