效果图：

1：微信开发者工具，如没有请参考该文章：微信小程序初章-注册微信小程序账户及安装微信小程序开发者工具篇

2：电脑一台。

3：微信开发者账户

4：手机一台（安装过微信）

1：打开微信开发者工具，创建新项目；填写三个必要内容：项目名称，存放目录，APPID。

然后点击立即创建即可。

2：打开界面如下，这是默认获取用户头像的界面。

3：一般显示的东西都是放在pages的后缀为wxml的文件中 

主页的获取头像的代码就是存放在pages/index/index.wxml文件中。

4：默认的当然不是我们今天想要的效果，所以，删了获取头像的所有代码。

5:现在开始准备图片部分。图片想要显示，当然需要对应的图片，图片就必须先存在项目文件夹中才能被引用。

所以，先点击右上方的详情，点击下方的本地目录，可以查看项目文件的存放目录，点击该目录会跳到该文件夹。

6：我们在pages中创建一个新的文件夹命名为:images,然后将想要显示的图片黏贴或者下载到该目录即可开始写代码引用了。

最好命名有顺序性好记一些。如1.png,2.png .

7:返回微信开发者工具，开始写代码了。

首先先创建view视图属性代码，支持可以回车自动补写代码的。

写完了开始引用图片代码了

将下方代码继续复制到view 中间部分。