0

我想创建一个快照，它以不同于向用户显示的方式组成多个组件。

假设屏幕上的布局如下所示：

<s:VGroup>
    <s:HGroup id="dynamicPopulatedGroup" />
    <mx:TabNavigator id="tabs">
        <s:NavigatorContent> <mx:LineChart id="chart1"/> </s:NavigatorContent>
        <s:NavigatorContent> <mx:LineChart id="chart2"/> </s:NavigatorContent>  
    </mx:TabNavigator>
    <mx:Legend id="legend" />
    <s:Button id="bSnapshot" />
</s:VGroup>

但是“屏幕截图”应该像这样布置：

<s:VGroup>
    <s:Label>Some Title Text</s:Label>
    <mx:LineChart>The currently selected tab's chart</mx:LineChart>
    <s:HGroup>
        <s:HGroup id="dynamicPopulatedGroup" /> 
        <mx:Legend id="legend" />
    </s:HGroup>
</s:VGroup>

这是一个简化的示例，但它说明了我要解决的主要问题，即如何在沙箱中操作可视元素而不影响屏幕上的元素本身。



我试图通过创建一个新Group组件并在代码中添加各种组件，然后截取屏幕截图来做到这一点。然而，这实际上从可视树中的原始位置删除了组件。一旦完成运行，整个组件就会损坏。 是不是我需要先创建这些组件的副本？

var g:VGroup = new VGroup();
// label
var l:Label = new Label(); l.text = "some title"; 
g.addElement(l);
// chart
g.addElement(NavigatorContent(tabs.selectedChild).getElementAt(0)); // chart
// legend, etc.
var hgrp:HGroup = new HGroup(); hgrp.addElement(dynamicPopulatedGroup); hgrp.addElement(legend);
g.addElement(hgrp);

ImageSnapshot.captureBitmapData(g);
// then do stuff with bitmap...
4

1 回答 1

0

ADisplayObject只能有一个父级。因此，当您将图表（和其他 UI 元素）添加到 newVGroup时，它们会从它们最初所在的任何容器中删除。

制作这些对象的副本可以解决您的问题，但似乎有点多。

您可以重新设计您的 UI/UX，以便当用户需要制作屏幕截图时，您实际上会切换到新的视图状态并实际渲染具有所需外观的组件，然后将它们还原回来。与许多网站显示页面“可打印”版本的方式相同。

如果这不可接受，也许您可​​以尝试一种混合方法，您可以为每个 UI 元素拍摄单独的快照并将它们拼接在一起。我会想象拼接工作类似于下面未经测试的代码：

var combinedImage:Sprite = new Sprite();
var g:Graphics = combinedImage.graphics;
var bitmaps = [bitmap1, bitmap2, bitmap3];
for (var i:int = 0; i < bitmaps.length; i++)
{
    g.beginBitmapFill(bitmaps[i]);
    g.drawRect(xCoordinate,yCoordinate,bitmapWidth,bitmapHeight);
    g.endFill();
    // increment x,y,width,height - leaving this exercise for you :)
}
于 2012-07-23T17:19:42.720 回答