- 博客(12)
- 收藏
- 关注
RSS订阅原创 H5 canvas基础入门到捕鱼达人小游戏实现(5)drawImage的应用
不知不觉，这已经是第五篇canvas系列文章了， 课时我们依然没有讲捕鱼游戏，今天这节我们主要讲canvas是如何处理图片的，这节讲完了，我们就可以正式开始编写捕鱼游戏了。图片处理 drawImage1、context.drawImage(image,x,y)x:绘制图像的x坐标y:绘制图像的y坐标2、context.drawImage(image,x,y,w,h);x:画在canvas的x
2017-12-30 14:18:19
3203
原创 H5 canvas基础入门到捕鱼达人小游戏实现(4)canvas事件处理和图形动作
这已经是第四篇canvas文章了，今天主要讲canvas中图形动作和canvas中的事件图形动作常用动作api：平移，缩放，旋转平移var oC = document.getElementById('c1');var gd = oC.getContext('2d');gd.translate(100,100);//x,y平移到的位置gd.fillRect(0,0,100,100);//绘制一
2017-12-27 16:42:18
1834
原创 H5 canvas基础入门到捕鱼达人小游戏实现(3)-canvas运动入门,渐变,文字渲染,阴影
上一篇主要讲解了矩形柱状图，弧形和饼图的绘制，但是离我们的目标还是有点远，不要紧，我们基础api都还没有学习完，今天继续。本节主要内容 - canvas画板制作 - 块的直线运动 - 粒子运动 - 线性渐变 - 径向渐变 - 文字渲染 - 阴影canvas画板canvas画板简单来说就是设置一块画布在上面自由画线，看看效果图 document.addEventListener('D
2017-12-25 10:04:00
1319
原创 H5 canvas基础入门到捕鱼达人小游戏实现(2)-矩形,柱状图,饼图绘制
学习canvas是一个不长不短的过程，但是需要大量的实践，才能深入学习到canvas的精髓，所以看标题应该就知道canvas是一个系列文章，上一篇文章主要讲解了，canvas的如何画直线等一些基础的内容，那么这边文章，我们主要来学习下以下几点：基础： - 矩形 - 圆弧 - 柱状图 - 饼图画矩形var canvas= document.getElementById('canvas');
2017-12-21 13:33:22
981
原创 H5 canvas基础入门到捕鱼达人小游戏实现(1)
为什么学习canvas？ 看见别人网页一些非常炫酷的效果，羡慕不已，于是对canvas产生了浓厚的兴趣，所以想仔细学习学习canvas.下面就一起来学习吧，本文为系列文章，最后会编写一个简单版的捕鱼达人小游戏作为结课标准。什么是canvas? HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像。 画布是一个矩形区域，您可以控制其每一像素。 canva
2017-12-21 08:50:18
6056
原创 vueJs(2.x)+router+vuex简易博客系统<七> 整合vuex
上篇文章我们可以向后台发送请求了，那么如果请求来的数据都在组件内，随着项目不断增大，我们维护起来将会非常困难，还有另外一个问题就是请求来的数据，如果多个组件公用的话，传递起来也是非常困难的一件事情。于是就有了状态统一管理，那么就是今天的主角vuex。vuex是什么？Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。 官方的解释可以自行阅读官方文档吧，我这里就用自己的语言把自己理解的
2017-12-01 16:33:15
942
原创 vueJs(2.x)+router+vuex简易博客系统<六> 整合axios
上一篇文章介绍了路由的基础知识，我们已经学会了使用路由跳转链接，当碰到更加复杂的需求的时候，可以查阅下官网api,接下来，我们需要向后台发送请求了，由于vue不自带ajax请求模块，所以我们安装官方推荐的axios的模块1、安装axiosnpm install axios --save2、打开项目的main.js，添加以下代码//先引入模块import axios from 'axios'//这
2017-11-28 09:04:13
607
原创 vueJs(2.x)+router+vuex简易博客系统<五>
上一篇文章简单介绍了下vue的基本语法，其实入门还是非常简单，回到项目中，我们把界面已经全部都写好了，在github中可以下载：https://github.com/shiyou00/blog_vue 可以对着项目看看，这章主要结合项目讲解下路由的知识项目中有两个界面： page/home/index.vue 这个是博客首页 page/home/content.vue 这个是博客的内容页我们的
2017-11-24 10:12:46
304
原创 vueJs(2.x)+router+vuex简易博客系统<四>
上一遍我们已经编写好了，所需界面，那么现在我们该做的事情就是接入数据了，在接入数据之前，我们所需要做的事件，就是先熟悉下vue这个渐进式框架的基本语法，下面就一起来练习下吧数据渲染div id="app"> {{message}}div> var app = new Vue({ el:'#app', data:{ message:'hel
2017-11-23 10:32:30
235
原创 vueJs(2.x)+router+vuex简易博客系统<三>
之前两篇文章已经把vue CLI 介绍的差不多了，并且也做了一些自定义的修改，那么接下来，我们就可以开始coding啦，我们先总结下，我们还欠缺哪些知识点呢？ 1、vue.js的一些基础知识 2、router路由的配置 3、vuex的使用(状态管理工具) 以上3点本篇暂时都不讲，本篇先讲讲，如何编写好一个完整的界面，以及拿到项目的时候，该如何划分好通用模块，做到高复用。分析
2017-11-23 09:57:51
347
原创 vueJs(2.x)+router+vuex简易博客系统<二>
上一遍文章主要是讲解基本的安装和配置，下面我们需要按照实际情况实现我们需要的配置 主要实现以下几点： 1. 配置less，习惯用less了。 2. 项目结构重新架构先看看我们要做个什么项目 博客首页 博客详情页 项目属于小项目，但是多练习下也是一个熟悉的过程。项目中SRC文件夹分析入口文件 main.js文件//引入vueimport Vue from 'vue'//
2017-11-13 18:22:50
297
原创 vueJs(2.x)+router+vuex简易博客系统<一>
通过写简易博客系统来学习vue全家桶的使用项目基础搭建技术选型前端vue.js(2.x)这里就不介绍它的基础了，可以看下官网的api写的非常清晰易懂vue-router@2.x 路由，注意: vue-router@2.x 只适用于 Vue 2.x。 官网：https://router.vuejs.org/zh-cn/javaspring+springmvc+mybatis(可以不用关注)
2017-11-13 15:48:44
337
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人