egret引擎播放flv视频流

var script = document.createElement('script');
script.src = "flv.min.js";
document.body.appendChild(script);
class Main extends eui.UILayer {


    protected createChildren(): void {
        super.createChildren();

        egret.lifecycle.addLifecycleListener((context) => {
            // custom lifecycle plugin
        })

        egret.lifecycle.onPause = () => {
            // egret.ticker.pause();
        }

        egret.lifecycle.onResume = () => {
            // egret.ticker.resume();
        }

        //inject the custom material parser
        //注入自定义的素材解析器
        let assetAdapter = new AssetAdapter();
        egret.registerImplementation("eui.IAssetAdapter", assetAdapter);
        egret.registerImplementation("eui.IThemeAdapter", new ThemeAdapter());
        this.runGame().catch(e => {
            console.log(e);
        })
    }

    private async runGame() {
        await this.loadResource()
        this.createGameScene();
        const result = await RES.getResAsync("description_json")
        this.startAnimation(result);
        await platform.login();
        const userInfo = await platform.getUserInfo();
        console.log(userInfo);
    }

    private async loadResource() {
        try {
            const loadingView = new LoadingUI();
            this.stage.addChild(loadingView);
            await RES.loadConfig("resource/default.res.json", "resource/");
            await this.loadTheme();
            await RES.loadGroup("preload", 0, loadingView);
            this.stage.removeChild(loadingView);
        }
        catch (e) {
            console.error(e);
        }
    }

    private loadTheme() {
        return new Promise((resolve, reject) => {
            // load skin theme configuration file, you can manually modify the file. And replace the default skin.
            //加载皮肤主题配置文件,可以手动修改这个文件。替换默认皮肤。
            let theme = new eui.Theme("resource/default.thm.json", this.stage);
            theme.addEventListener(eui.UIEvent.COMPLETE, () => {
                resolve();
            }, this);

        })
    }

    private textfield: egret.TextField;

    private _canvasTag;

    /**
    * 视频
    */
    public bitmap: egret.Bitmap;
    public texture = null;
    private canvas = null;

    private ctx;

    private video;

    /**
     * 创建场景界面
     * Create scene interface
     */
    protected createGameScene(): void {
        let sky = this.createBitmapByName("bg_jpg");
        this.addChild(sky);

        var button = new eui.Button();
        button.y = 850;
        button.label = "播放";
        button.horizontalCenter = 0;
        button.addEventListener(egret.TouchEvent.TOUCH_TAP, this.onPlay, this);
        this.addChild(button);
    }

    private onPlay() {
        if (!this.bitmap) {
            this.bitmap = new egret.Bitmap();
            this.addChild(this.bitmap);
            this.bitmap.x = 80;
            this.bitmap.y = 10;
            this.addEventListener(egret.Event.ENTER_FRAME, this.loop, this);

            this.video = document.createElement("video")
   
            this._canvasTag = flvjs.createPlayer({
                type: "flv",
                isLive: !0,
                hasVideo: !0,
                url: "http://.........flv"
            });
            this._canvasTag.attachMediaElement(this.video);
            this._canvasTag.load(); //加载
            this.video.play();
            var canvas = document.createElement('canvas');
            canvas.width = 480;
            canvas.height = 784;
            this.ctx = canvas.getContext('2d');
            this.canvas = canvas;
        }
    }

    private updataVideo(x = 0, y = 0, width = 480, height = 784, offsetX = 0, offsetY = 0) {
        var x = x;
        var y = y;
        var width = width;
        var height = height;
        var offsetX = offsetX;
        var offsetY = offsetY;
        try {

            this.bitmap.width = width;
            this.bitmap.height = height;
        } catch (error) {

        }
        if (!this.texture) {
            // 如果这里使用 this.video 则不能控制大小
            //  this.texture = new egret.BitmapData(this.video) as any;
            this.texture = new egret.BitmapData(this.canvas) as any;
        }
        this.texture.$bitmapData = this.texture;
        this.texture.$bitmapX = x;
        this.texture.$bitmapY = y;
        this.texture.$offsetX = offsetX;
        this.texture.$offsetY = offsetY;
        this.texture.$bitmapWidth = width;
        this.texture.$bitmapHeight = height;
        this.texture.$getTextureWidth = () => {
            return width;
        };
        this.texture.$getTextureHeight = () => {
            return height;
        };
        this.texture.$sourceWidth = width;
        this.texture.$sourceHeight = height;
        try {
            this.bitmap.texture = this.texture;
        } catch (error) {

        }
    }

    private loop() {
        this.updataVideo(0, 0, 480, 784, 0, 0);
        this.ctx.drawImage(this.video, 0, 0, 480, 784);
    }


    /**
     * 根据name关键字创建一个Bitmap对象。name属性请参考resources/resource.json配置文件的内容。
     * Create a Bitmap object according to name keyword.As for the property of name please refer to the configuration file of resources/resource.json.
     */
    private createBitmapByName(name: string): egret.Bitmap {
        let result = new egret.Bitmap();
        let texture: egret.Texture = RES.getRes(name);
        result.texture = texture;
        return result;
    }
    /**
     * 描述文件加载成功,开始播放动画
     * Description file loading is successful, start to play the animation
     */
    private startAnimation(result: Array<any>): void {
        let parser = new egret.HtmlTextParser();
    }

    /**
     * 点击按钮
     * Click the button
     */
    private onButtonClick(e: egret.TouchEvent) {
        let panel = new eui.Panel();
        panel.title = "Title";
        panel.horizontalCenter = 0;
        panel.verticalCenter = 0;
        this.addChild(panel);
    }
}
// 需要另一个ts文件
declare class flvjs {
	public constructor();
	 play();
    
	static isSupported();
	static createPlayer(a:any);
}
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值