在GWT中动态添加画布

Question

我目前正在开发一个图像编辑器应用程序。我试图在我的应用程序中提供一个选项来处理不同的层，比如GIMP或Photoshop。我的方法是为用户添加的每个层添加一个Canvas。一切都很好，但不知怎么的，我动态添加的画布没有出现。

在我的类构造函数中，我添加了1个通用画布，它包含一个背景图像，不能编辑。这个画布（它是全球性的）确实显示出来并正常工作。所有可以编辑的层都存储在List中

这是将画布添加到我的List和Formboard中的方法。

public void addCanvasLayer(String layerName, int id){
    Canvas newCanvas = Canvas.createIfSupported();

    newCanvas.setWidth(this.scaledImageWidth + "px");
    newCanvas.setHeight(this.scaledImageHeight + "px");
    newCanvas.setCoordinateSpaceWidth(this.scaledImageWidth);
    newCanvas.setCoordinateSpaceHeight(this.scaledImageHeight);

    newCanvas.getElement().setId(layerName);
    newCanvas.getElement().getStyle().setZIndex(id);

    this.fpCanvas.add(newCanvas, new AbsoluteData(0, 0));

    this.canvasLayers.add(newCanvas);
    this.addCanvasHandler(newCanvas);

    context = newCanvas.getContext2d();
}

它所做的就是创建一个画布，将其大小设置为主宽度和高度，设置其id和z-index，将画布添加到我的画布列表中，将处理程序添加到画布中（clickhandler，onMouseDownHandler，...）并将画布添加到主上下文中。

添加画布时，ScaledImageWidth和-Height绝对不为null或0。

有什么想法吗？

编辑：通过添加fpCanvas解决了问题。布局（）；直到方法的末尾。我的formpanel刚刚需要刷新




Answer 1

通过添加fpCanvas解决了此问题。布局（）；直到方法的末尾。我的formpanel刚刚需要刷新

Answer 2

下面是我如何管理画布的层：

公共抽象类层扩展复合{

/**
 * The canvas used in this layer
 */
private Canvas m_canvas;


public Layer()
{
    m_canvas = Canvas.createIfSupported();
    initWidget( m_canvas );
}

/**
 * Get the name of the layer (debug purpose only)
 * @return the name of the layer
 */
protected abstract String getLayerName();

/**
 * Set the z-index of the layer
 * @param zindex the new z-index
 */
public void setZ( int zindex )
{
    m_canvas.getElement().getStyle().setZIndex( zindex );
}

public int getZ()
{
    return Integer.parseInt( m_canvas.getElement().getStyle().getZIndex() );
}

@Override
public void setPixelSize( int width, int height )
{
    super.setPixelSize( width, height );
    m_canvas.setCoordinateSpaceWidth( width );
    m_canvas.setCoordinateSpaceHeight( height );
}

/**
 * Draw the layer
 */
public void draw()
{
}

/**
 * Get the context2d where this layer will be drawn
 * 
 * @return the Context2d
 */
public final Context2d getContext2d()
{
    return m_canvas.getContext2d();
}

/**
 * Clear the layer
 */
public void clear()
{
    Context2d context2d = getContext2d();
    if ( m_canvas != null && m_canvas.isAttached() )
    {
        context2d.clearRect( 0, 0, m_canvas.getOffsetWidth(), m_canvas.getOffsetHeight() );
    }
}

public LayoutPanel getEnclosingLayoutPanel()
{
    return (LayoutPanel)getParent();
}

}

加上：

    public void addLayer( Layer layer, int zindex )
{
    // m_main is a LayoutPanel
    int width = m_main.getOffsetWidth();
    int height = m_main.getOffsetHeight();
    m_layers.add( layer );
    layer.setZ( zindex );
    if ( m_main.getWidgetCount() > 0 )
    {
        m_main.insert( layer, 1 );
    }
    else
    {
        m_main.add( layer );
    }
    layer.setPixelSize( width, height );
    (...)