pixi学习资料以及问题收集

　本文主要收集楼主在学习 pixijs 过程中所用到的资料文档以及遇到的一些问题,方便日后查看。

　阅读此文是默认已经对 pixijs 有了基本的了解。

简述

　PixiJS 的核心是一个渲染系统，它使用 WebGL（或可选的 Canvas）来显示图片和其他 2D 视觉内容。 它提供了完整的场景图（要渲染的对象的层次结构），并提供交互支持以支持处理单击和触摸事件。 它是现代 HTML5 世界中 Flash 的自然替代品，但提供了超出 Flash 所能实现的更好的性能和像素级效果。 它非常适合在线游戏、教育内容、互动广告、数据可视化...... 任何复杂图形非常重要的基于 Web 的应用。 与 Cordova 和 Electron 等技术相结合，PixiJS 应用可以作为移动和桌面应用分发到浏览器之外。

中文文档

pixi中文文档(推荐)
pixi中文文档(比较老旧仅做参考)

官方文档

pixijs官方文档
pixijs官方网站

已解决问题

　已下记录已解决的pixijs使用中的一些问题。

手机端渲染模糊

　我们主要使用 resolution 和 autoDensity 来解决手机端显示渲染模糊问题,实测有效。

let app = new PIXI.Application({
    resolution: window.devicePixelRatio || 2, // 设置分辨率系数
    autoDensity: true, // 自动调整大小
    antialias: true,//开启抗锯齿
    forceWebGL: true, // 强制使用 WebGL
});

使用 AnimatedSprite 中途更换动画

使用 textures 属性我们可以直接更换原对象动画帧。

let animated = createAnimatedTexture(1,13,"");

let animated_sprite = new PIXI.AnimatedSprite(animated);

animated = createAnimatedTexture(14,28,"");

animated_sprite.textures = animated

人物自动寻路

　我们主要使用传统的astar寻路算法通过矩阵方式标记最优路线进项自动寻路。