pixijs DragonBones控制骨骼動畫


pixijs控制骨骼動畫

自己看代碼吧  

    <script src="{$yumingnew}/js/pixi.min.js" type="text/javascript">
        </script>
        <script src="{$yumingnew}/js/pixi-dragonbones.js" type="text/javascript">
        </script>
        <script type="text/javascript">
            const app = new PIXI.Application({ antialias: true });
    document.body.appendChild(app.view);

    app.stop();

    // load spine data
    PIXI.Loader.shared
        .add('skeleton', '/moban/dragonbones/Dragon_ske.json')
        .add('texture_json', '/moban/dragonbones/Dragon_tex.json')
        .add('texture_png', '/moban/dragonbones/Dragon_tex.png')
        .load(onAssetsLoaded);

    function onAssetsLoaded(loader, res) {
        const factory = dragonBones.PixiFactory.factory;

        factory.parseDragonBonesData(res.skeleton.data);
        factory.parseTextureAtlasData(res.texture_json.data, res.texture_png.texture);


        var armatureDisplay = factory.buildArmatureDisplay('Dragon', 'Dragon');

        armatureDisplay.animation.play('walk');
        armatureDisplay.x = 400.0;
        armatureDisplay.y = 400.0;
        armatureDisplay.scale.x = 0.6;
        armatureDisplay.scale.y = 0.6;
         //調整動畫速度
        // armatureDisplay.animation.timeScale = 0.1;
     var armature = armatureDisplay.armature;
        //控制骨骼旋轉
        var head =armature.getBone("head");
        head.offset.rotation = 175;
        console.log(head);
        app.stage.addChild(armatureDisplay);
        // setTimeout(function() {
        //     armatureDisplay.animation.play('stand');
        //     setTimeout(function() {
        //         armatureDisplay.animation.play('walk');
        //     }, 2000)
        // }, 2000)

        app.start();
    }

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM