TAT.dnt react动画难写?试试react版transformjs
In 未分类 on 2016年12月20日 by view: 1,772
1

简介

transformjs在非react领域用得风生水起,那么react技术栈的同学能用上吗?答案是可以的。junexie童鞋已经造了个react版本

TAT.dnt 你必须收藏的Github技巧
In 未分类 on 2016年12月16日 by view: 8,711
5

一秒钟把Github项目变成前端网站

GitHub Pages大家可能都知道,常用的做法,是建立一个gh-pages的分支,通过setting里的设置的GitHub Pages模块可以自动创建该项目的网站。
这里经常遇到的痛点是,master遇到变更,经常需要去sync到gh-pages,特别是纯web前端项目,这样的痛点是非常地痛。
Github官方可能嗅觉到了该痛点,出了个master当作网站是选项,太有用了。

TAT.dnt HTML5 Canvas玩转酷炫大波浪进度图
In 未分类 on 2016年12月14日 by view: 4,892
2

如上图所见,本文就是要实现上面那种效果。
由于最近AlloyTouch要写一个下拉刷新的酷炫loading效果。所以首选大波浪进度图。
首先要封装一下大波浪图片进度组件。基本的原理是利用Canvas绘制矢量图和图片素材合成出波浪特效。

TAT.dnt 一分钟搞定AlloyTouch图片轮播组件
In 未分类 on 2016年12月12日 by view: 1,670
1

轮播图也涉及到触摸和触摸反馈,同时,AlloyTouch可以把惯性运动打开或者关闭,并且设置min和max为运动区域,超出会自动回弹。
除了一般的竖向滚动,AlloyTouch也可以支持横向滚动,甚至任何属性的运动,因为它的设计的本质就是属性无关,触摸可以反馈到任何属性的运动。所以AlloyTouch制作各种各样的轮播组件还是得心应手。

TAT.dnt AlloyTouch与three.js 3D模型交互
In 未分类 on 2016年12月08日 by view: 1,697
0

TAT.dnt 移动Web触摸与运动解决方案AlloyTouch开源啦
In 未分类 on 2016年12月06日 by view: 3,186
2

传送门

Github地址:https://github.com/AlloyTeam/AlloyTouch

简介

AlloyTouch的本质是运动一个数字,把数字的物理变化映射到你想映射的任何属性上。所以带来了广泛的应用场景。不论实在应用、游戏、操作系统等许多层面,监听用户触摸,给用户真实的运动反馈是很常见的应用场景。如王者荣耀里,旋转用户角色,抽奖程序滚动转盘、页面滚动、局部滚动等。

TAT.dnt transformjs玩转星球
In 未分类 on 2016年12月05日 by view: 2,108
4

Javascript有个Unicode的天坑
In 未分类 on 2016年12月04日 by view: 7,562
8

最近笔者在项目中遇到了emoji表情的处理,期间发现js处理多字节字符时会有较多坑,记录一下与各位分享。
本文涉及知识点:

Unicode (BMP/SP)
UTF-8 UTF-16 UTF-32 UCS-2
javascript字符处理

TAT.joeyguo 构建流式应用—RxJS详解
In 未分类 on 2016年12月02日 by view: 9,842
7

原文地址

最近在 Alloyteam Conf 2016 分享了《使用RxJS构建流式前端应用》,会后在线上线下跟大家交流时发现对于 RxJS 的态度呈现出两大类:有用过的都表达了 RxJS 带来的优雅编码体验,未用过的则反馈太难入门。所以,这里将结合自己对 RxJS 理解,通过 RxJS 的实现原理、基础实现及实例来一步步分析,提供 RxJS 较为全面的指引,感受下使用 RxJS 编码是怎样的体验。

 

TAT.dnt 和transformjs一起摇摆
In 未分类 on 2016年12月01日 by view: 1,821
1

写在前面

记得以前facebook做过一款HTML5游戏。开场动画是一块软体类似豆腐的东西一起摇摆。类似的效果如下面的gif所示:

facebook当时使用的是createjs下的子项目easeljs和tweenjs去制作,基于Canvas的动画。基本的原理主要是:循环运动Canvas抽象的DisplayObject的skewX和scaleY来实现软体摇摆。
目前来看transformjs也能做到,因为transformjs也能运动skewX和scaleY。先来看看facebook的方式。