pixi 真机不显示 text,也不响应点击事件
seekcx opened this issue · 6 comments
seekcx commented
复现代码:
// pixi.ts
import * as PIXI from '@pixi/core';
export * from '@pixi/core';
export * from '@pixi/text';
export * from '@pixi/events';
import { TickerPlugin } from '@pixi/ticker';
import { install } from '@pixi/unsafe-eval';
import { Application } from '@pixi/app';
import { Renderer, BatchRenderer } from '@pixi/core';
import { InteractionManager } from '@pixi/interaction';
function initializePixi() {
// 注册插件
install(PIXI);
Application.registerPlugin(TickerPlugin);
Renderer.registerPlugin('batch', BatchRenderer);
Renderer.registerPlugin('interaction', InteractionManager);
}
/**
* 创建 Pixi 应用
*
* @param canvas 画板
* @returns 应用
*/
export function createApplication(canvas: any) {
initializePixi();
const app = new Application({
view: canvas,
width: canvas.width,
height: canvas.height,
backgroundColor: 0xffffff,
antialias: true,
resolution: window.devicePixelRatio,
});
return app;
}
// game.ts
import * as Pixi from './pixi';
import { Text } from '@pixi/text';
import { Graphics } from '@pixi/graphics';
import { WechatGamePlatform, PlatformManager } from 'platformize-pixi';
// 微信小游戏适配层
const canvas: any = wx.createCanvas();
const platform = new WechatGamePlatform(canvas);
PlatformManager.set(platform);
platform.init(Pixi, wx.createCanvas());
const app = Pixi.createApplication(canvas);
const textSprite = new Text('Hello, world!');
textSprite.position.set(100, 100);
app.stage.addChild(textSprite);
const boxSprite = new Graphics()
.beginFill(0x00aaaa)
.drawRect(50, 150, 250, 250)
.endFill();
boxSprite.interactive = true;
boxSprite.on('pointerdown', () => {
wx.showToast({ title: 'pointerdown' });
});
app.stage.addChild(boxSprite);
开发工具渲染结果:
deepkolos commented
@seekcx 应该是可以的, 只是依赖小游戏canvas 2d 绘制text的能力, 点击的问题注意下使用的版本是否为最新的platformize-pixi@6.2.2
pixi版本是否为: @pixi/core@6.2.1
实例可以参考这个 pixi 微信小游戏demo
https://github.com/deepkolos/platformize/tree/main/examples/pixi-wechat-game
真机运行效果
模拟器
小程序真机
deepkolos commented
@seekcx 关于所提供的代码, 我这边的测试结果
基于https://github.com/deepkolos/platformize/tree/main/examples/pixi-wechat-game
// text.ts
import * as PIXI from './pixi';
export function HelloWorldText(canvas) {
PIXI.__init__();
const app = new PIXI.Application({
view: canvas,
width: canvas.width,
height: canvas.height,
backgroundColor: 0xffffff,
antialias: true,
resolution: window.devicePixelRatio,
});
const textSprite = new PIXI.Text('Hello, world!');
textSprite.position.set(100, 100);
app.stage.addChild(textSprite);
const boxSprite = new PIXI.Graphics().beginFill(0x00aaaa).drawRect(50, 150, 250, 250).endFill();
boxSprite.interactive = true;
boxSprite.on('pointerdown', () => {
wx.showToast({ title: 'pointerdown' });
});
app.stage.addChild(boxSprite);
return app;
}
seekcx commented
seekcx commented
我测试用的版本是6.2.2,example 用的版本是 6.2.1
seekcx commented