3

总菜鸟问题。我一直在滥用谷歌，出于某种原因，令人惊讶的是找不到任何关于这...？我觉得我在这里遗漏了一些东西。:P

我目前有一个 resize() 函数，可以将画布尺寸修改为窗口的大小。在一个最小的示例（也使用 jQuery）中，我有一个引用我的 Shape 对象的变量。根据文件，形状对象不包括宽度和高度属性。调整形状对象大小的最有效方法是什么？动态删除/重绘？

这就是我所拥有的：

            var stage;

            var bgColor;

            $(document).ready(function(){
                init();
            });

            function init()
            {
                stage = new createjs.Stage("canvasStage");

                bgColor = new createjs.Shape();
                bgColor.graphics.beginFill("#000000").drawRect(0,0, stage.canvas.width, stage.canvas.width);

                stage.addChild(bgColor);

                $(window).resize(function(){windowResize();});
                windowResize();
            }

            function windowResize()
            {
                stage.canvas.width = $(window).width();
                stage.canvas.height = $(window).height();
                //bgColor.width = $(window).height();// No width property
                //bgColor.height = $(window).height();// NO height property

                stage.update();}
4

3 回答 3

3

您可以使用形状的 scaleX 和 scaleY 来缩放形状。

注意：Shape Object 扩展了 DisplayObject，因此您可能还想查看 DisplayObject 文档以了解更多有用的属性/方法。

myShape.scaleX=1.2;
myShape.scaleY=1.2;
于 2013-02-19T02:02:06.583 回答
2

正如@markE 所提到的，只有 scaleX 和 scaleY 可用。

解决此问题的一种方法是实例化具有 1px 宽度和 1px 高度的形状：

mc_bg = new createjs.Shape();
mc_bg.graphics.beginFill("#CCCCCC").drawRect(0,0,1,1);
stage.addChild(mc_bg);

mc_left = new createjs.Shape();
mc_left.graphics.beginFill("#333333").drawRect(0,0,1,1);
stage.addChild(mc_left);

mc_circle = new createjs.Shape();
mc_circle.graphics.beginFill("#888888").drawCircle(0,0,1,1);
stage.addChild(mc_circle);

允许在渲染前使用 scaleX 和 scaleY 直接使用像素单位设置尺寸而不进行转换：

mc_bg.scaleX = stage_width;
mc_bg.scaleY = stage_height;

mc_left.scaleX = stage_width/2;
mc_left.scaleY = stage_height;

mc_circle.x = stage_width/4;
mc_circle.y = stage_width/4;
mc_circle.scaleX = stage_width/4;
mc_circle.scaleY = stage_width/4;

stage.update();

请参阅在窗口调整大小时实时调整大小的小提琴示例：https ://jsfiddle.net/jckleinbourg/go3fs1zt/

于 2016-02-21T06:31:14.243 回答
0

改变比例的转换方法 --> 尺寸，反之亦然：

function dimToScale(origDim, desiredDim)
{
    return desiredDim / origDim;
}

function scaleToDim(origDim, scale)
{
    return scale * origDim;
}
于 2013-02-28T19:06:07.310 回答