PIXI.JS的学习-------（一）初探

//Create a Pixi Application
let app = new PIXI.Application({
        width: 256,
        height: 256,
        antialias: true,
        transparent: false,
        resolution: 1
    }
);

//Add the canvas that Pixi automatically created for you to the HTML document
document.body.appendChild(app.view);

//load an image and run the `setup` function when it's done
PIXI.loader
    .add("images/cat.png")
    .load(setup);

//This `setup` function will run when the image has loaded
function setup() {

    //Create the cat sprite
    let cat = new PIXI.Sprite(PIXI.loader.resources["images/cat.png"].texture);

    //Add the cat to the stage
    app.stage.addChild(cat);
}

如果想要图片隐藏 ，可用 cat.visible=false;

下面是使用别名的写法：

//Aliases
let Application = PIXI.Application,
    loader = PIXI.loader,
    resources = PIXI.loader.resources,
    Sprite = PIXI.Sprite;

//Create a Pixi Application
let app = new Application({
    width: 256,
    height: 256,                       
    antialias: true,
    transparent: false,
    resolution: 1
  }
);

//Add the canvas that Pixi automatically created for you to the HTML document
document.body.appendChild(app.view);

//load an image and run the `setup` function when it's done
loader
  .add("images/cat.png")
  .load(setup);

//This `setup` function will run when the image has loaded
function setup() {

  //Create the cat sprite
  let cat = new Sprite(resources["images/cat.png"].texture);

  //Add the cat to the stage
  app.stage.addChild(cat);
}