В Flex, как мне создать, заполнить и отобразить растровое изображение?

Question

Начиная с совершенно пустым приложения MXML:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    layout="absolute" > 

</mx:Application> 

Что такое скрипт, который будет: (? Это должно быть BitmapData объектом)

• создать растровый
• программно заполнить его с данными (например, нарисуйте круг) (есть ли более эффективный способ сделать это, чем повторное вызов BitmapData.SetPixel?)
• визуализируйте его в приложении (например, с центром в центре) (как Я получаю растровое изображение на экране? Онлайн-образцы Flash показывают вызов myBitmap=new Bitmap(myBitmapData), а затем myBitmap.AddChild, но это вызывает ошибку в Flex).

??

ПРИМЕЧАНИЕ. Цель состоит не только в том, чтобы получить круг на экране, он должен заполнить объект Bitmap (или BitmapData? Или ???) с помощью SetPixel (или?), А затем получить его содержимое на экране , как это нужно сделать в приложении обработки изображений или визуальных эффектов.

Answer 1

У вас есть несколько вариантов. Во-первых, чтобы исследовать Degrafa framework, который имеет некоторые действительно невероятные инструменты рисования, в противном случае вам нужно добавить блок сценария и использовать AS3 библиотека для рисования в функции (в данном случае, вероятно, призвал creationComplete:

private function handleCreationComplete():void 
{ 
    var component:UIComponent = new UIComponent(); //needed to add to the flex display list 
    var myCircle:Sprite = new Sprite(); 
    myCircle.graphics.beginFill(0xFFFFFF,1) 
    myCircle.graphics.drawCircle(100,100,50); 
    component.addChild(myCircle); 
    this.addChild(component); 
} 

Это вон «т центр круга, но вы можете понять, что немного из

вы можете использовать эту функцию, чтобы на самом деле получить растровые из выше UIComponent:..

private function getBitmapData(target : UIComponent) : BitmapData 
    { 
    var bd : BitmapData = new BitmapData(target.width, target.height); 
    var m : Matrix = new Matrix(); 
    bd.draw(target, m); 
    return bd; 
    } 

из here

Answer 2

Вот полный, рабочий пример, я был в состоянии создать на основе Joel Крючки предложения:

MXML FILE (ards.mxml):

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
     creationComplete="onCreationComplete()"> 

<mx:Script source="ards_script.as" /> 

</mx:Application> 

SCRIPT ФАЙЛА (ards_script.as):

import mx.core.UIComponent; 

private function onCreationComplete():void 
{ 
    // create a UIComponent and add it to the Flex display list 
    var component:UIComponent = new UIComponent(); 
    component.width = this.width; 
    component.height = this.height; 
    component.x = 0; 
    component.y = 0; 
    this.addChild(component); 

    // create a BitmapData object (basically an array of pixels) the same size as the screen  
    var bd : BitmapData = new BitmapData(component.width, component.height); 

    // draw a green circle in the bitmap data 
    var xCenter:int = component.width/2; 
    var yCenter:int = component.height/2; 
    var r:int = Math.min(xCenter,yCenter); 
    var rSquare:int = r*r; 
    var color:Number = 0x00ff00; 
    for(var i:int=0; i<component.width; i++) 
    { 
     for(var j:int=0; j<component.width; j++) 
     { 
      var dX:int = i - xCenter; 
      var dY:int = j - yCenter; 
      var q:int = dX*dX + dY*dY; 
      if(q < rSquare) 
      { 
        bd.setPixel(i, j, color); 
      }  
     } 
    } 

    // create a bitmap based on the data, and add it as a child to the UIComponent to be displayed 
    // (if you try to add it directly to the Application, you get a runtime error) 
    var bt:Bitmap = new Bitmap(bd); 
    component.addChild(bt);  
}