0

我正在尝试创建一个 ExtJS 应用程序来基于 XML 文件创建表面，然后能够通过鼠标在这些表面上添加精灵。我在通过参数创建表面和精灵的实际功能上遇到了一些麻烦，这些参数可以从前面列举的源中获取。当我在 JS 控制台中检查 tham 的值时，我创建的对象返回未定义。我在它报告的 JS 中没有任何错误或警告。这是代码：

Ext.ns('myNameSpace');//create namespace to hold all variables
    myNameSpace = {
        init: function(){//initialize namespace
            function surfaceCreator(name){//create surface based on parameter
                var name = Ext.create('Ext.draw.Component', {
                    viewBox: false
                });
                return name;
            }
            function spriteCreator(surfaceName,sprite,posX,posY){//draw sprite based on parameters
                var sprite = Ext.create('Ext.draw.Sprite', {
                    type: 'circle',
                    x: posX,
                    y: posY,
                    radius: 25,
                    surface: surfaceName.surface,
                    fill: '#cc5'
                });sprite.show(true);
            }
            var mySurface = 'mySurface';//this could be an xml value
            var myCircle = 'myCircle';//this could be determined by numbering each one that is created.
            var myActualSurface = surfaceCreator(mySurface);//call function to create surface and return surface name as an object
            spriteCreator(myActualSurface,myCircle,20,20);//call function to create sprite on specified surface. Also, I could use the mouse coordinates to determine where the sprite should be drawn and make this trigger on 'click'.
            var myWin = Ext.create('Ext.Window', {// Create a window to house the surfaces
                width: 800,
                resizeable: false,
                height: 600,
                layout: 'fit',
                items: myActualSurface//This seems to be undefined somehow and I'm not sure why, as it is defined up above.
            }).show();
        }
    }
Ext.onReady(myNameSpace.init,myNameSpace);//render namespace when webpage is ready.

如果我能就这里可能发生的事情获得第二意见，我会非常高兴。如果有人有解决方案（很可能我只是在错误地使用某些东西），我会欣喜若狂。感谢您的时间和考虑。

4

1 回答 1

0

我认为这里的主要问题是“表面”属性，参考：http ://docs.sencha.com/extjs/4.1.3/#!/api/Ext.draw.Sprite

您可以使用以下符号将精灵添加到表面：

surfaceName.add(sprite);

或者

var sprite = Ext.create('Ext.draw.Sprite', {
                    type: 'circle',
                    x: posX,
                    y: posY,
                    radius: 25,
                    // surface: surfaceName.surface, >> omit this line
                    fill: '#cc5'
                });
{
xtype:'drawcomponent',
items:[sprite]
}
于 2013-08-06T06:39:06.237 回答