wadedt的博客

项目功能分析 前置知识 html 能独立写HTML最好有半年的实践经验 css 能独立写css js 有一定的基础 如果没有一点基础知识，你会感觉到什么是绝望！！！ 功能介绍 用户进入小程序，可以挑选礼物，可以添加多个礼物，然后生成礼物红包发送给微信好友， 我们定义了三种送礼的方式 直接送礼，将生成的礼物红包发送给好友，好友领取直接获得礼包 定时开奖，指定时间之后随机分配礼包 满人开奖，参与...

下载微信开发者工具 申请小程序账号，获取自己的appid 打开微信开发者工具，第一次要扫码登录，然后点击小程序项目，添加一个小程序的项目 选择项目目录，然后填写自己小程序账号的appid，项目名 简历普通快速启动模板建议勾选，然后点击确定 之后我们就可以在开发者工具中看到一个helloworld的小程序，如下图所示 创建项目就是这么简单，下一节我们将会从这个helloworld简单的讲一下...

在我们创建快速启动项目后，我们可以看到项目的目录结构如下图所示 pages目录是我们小程序的页面文件存放的目录，每一个页面都有一个独立的文件夹 utils目录存放的是我们需要用到的工具类 app.js是全局的js app.json是全局配置信息 app.wxss是全局的样式配置 project.config.json是整个项目的配置，包括小程序的appid,项目名等项目相关的信息 在pages目录...

首先来看一下我们的界面效果图，然后我们根据设计稿来写我们的小程序页面 当然了会用到一部分图片素材，我们在项目根目录新建一个images文件夹用于存放我们的图片资源。 接下来我们开始正是我们的代码之旅 先看下我们的app.json配置，整个项目的颜色风格主题为红色，底部有四个tabbar，分别是首页，抽奖，客服，礼物记录。 配置文件如下 然后点击上面的编译按钮，在pages目录下会自动生成配置中的...

配置好了全局的信息之后，我们就开始写单独的页面，找到pages/index/index目录 删除默认生成index.wxml的helloworld代码。我们看到头部是一个从红色到橙色渐变的一个块 里面包含了两行文字，还有一个操作指南的跳转页面的按钮。 根据设计稿我们就来写index.wxml， 这里我们发现会有一个操作指南的跳转页面，那么我们需要在app.json的pages属性中添加操作指南页面...

贴一下首页完整代码 <!--index.wxml--> <view class="container"> <view class="top"> <text class="text1">微信送礼新方式</text> <text class="text