Flex中的終端仿真

Question

我需要在Flex中對一些舊的DOS或大型機終端進行仿真。例如下面的圖像。

alt text http://i36.tinypic.com/2encfes.png

不同顏色的文字是很容易的，但是做不同的背景顏色，如黃色背景的能力超出了標準Flash文本的能力。

我可能還需要能夠在某些地方輸入文本並在「終端」上滾動文本。任何想法我會如何攻擊？或者更好的是，任何現有的代碼/組件對於這種事情？

Answer 1

字體固定的寬度和高度，所以動態製作背景位圖並不困難，而且可能是最快最簡單的解決方案。實際上，如果你的尺寸正確，每個字符只有一個延伸像素。

根據字符的背景爲像素（或像素）着色。

- 亞當

Answer 2

使用TextField.getCharBoundaries讓在你想有一個背景區的第一個和最後一個字符的矩形。從這些矩形可以構建一個跨越整個區域的矩形。使用它可以在放置在文本字段後面的Shape中或在文本字段的父級中繪製背景。

更新你問的一個例子，這裏是如何從一個字符的範圍得到了矩形：

var firstCharBounds : Rectangle = textField.getCharBoundaries(firstCharIndex); 
var lastCharBounds : Rectangle = textField.getCharBoundaries(lastCharIndex); 

var rangeBounds : Rectangle = new Rectangle(); 

rangeBounds.topLeft = firstCharBounds.topLeft; 
rangeBounds.bottomRight = lastCharBounds.bottomRight; 

如果你想找到一整行的長方形，你可以這樣做，而不是：

var charBounds : Rectangle = textField.getCharBoundaries(textField.getLineOffset(lineNumber)); 

var lineBounds : Rectangle = new Rectangle(0, charBounds.y, textField.width, firstCharBounds.height); 

當你有要繪製爲背景的文本範圍的邊界，則可以在文本字段中的父的updateDisplayList方法做到這一點（假設文本字段被定位在[0， 0]和有白色的文字，那textRangesWithYellowBackground是表示應該有黃色背景的文本範圍的矩形陣列）：

graphics.clear(); 

// this draws the black background 
graphics.beginFill(0x000000); 
graphics.drawRect(0, 0, textField.width, textField.height); 
graphics.endFill(); 

// this draws yellow text backgrounds 
for each (var r : Rectangle in textRangesWithYellowBackground) 
    graphics.beginFill(0xFFFF00); 
    graphics.drawRect(r.x, r.y, r.width, r.height); 
    graphics.endFill(); 
}