user3240131
user3240131

Reputation: 207

How to align text to the right and left edges on the same line with as3?

Is it possible to align text in as3 so that the result looks like this in your textField?

firstDatasetElement1                                   secondDatasetElement1
firstDatasetElement2                                   secondDatasetElement2
firstDatasetElement3                                   secondDatasetElement3
         .                                                       .
         .                                                       .
         .                                                       .
firstDatasetElementN                                   secondDatasetElementN

Upvotes: 0

Views: 1028

Answers (2)

Shaun Dreclin
Shaun Dreclin

Reputation: 332

I've found a solution using a single html text field! It uses the "leading" css property to remove the spacing between multiple lines inside the "squish" tag I created.

import flash.text.StyleSheet;
var textStyle:StyleSheet = new StyleSheet();

textStyle.setStyle("right", {
    textAlign: "right"
});

textStyle.setStyle("squish", {
    leading: -20
});

myTextBox.styleSheet = textStyle;


myTextBox.htmlText  = "<squish>Stuff on the left!";
myTextBox.htmlText += "\n<right>Stuff on the right!</right></squish>";

Upvotes: 0

Nicolas Siver
Nicolas Siver

Reputation: 2885

You can place texts in several columns by the help of several text fields.

var firstCollection:Array = ["First1", "First2", "First3", "First4", "First5", "First6"];
var secondCollection:Array = ["Second1", "Second2", "Second3", "Second4", "Second5", "Second6", "Second7"];

placeTextsAt(this, firstCollection);
placeTextsAt(this, secondCollection, stage.stageWidth);

//Helper function, align text fields to the right size, if width is specified
//holder - container for text, list - your texts, width - if you want align text to the rigth side
function placeTextsAt(holder:DisplayObjectContainer, list:Array, width:uint = 0):void {
    var i:uint, len:uint = list.length, posY:uint, padding:uint = 10, textField:TextField, textFormat: TextFormat = new TextFormat("Arial", 16);

    for (i; i < len; ++i) {
        textField = new TextField();
        textField.defaultTextFormat = textFormat;
        textField.autoSize = TextFieldAutoSize.LEFT;
        holder.addChild(textField);
        textField.text = list[i];
        textField.y = posY;
        posY += (textField.height + padding);

        //Align
        if(width > 0){
            textField.x = width - textField.width;
        }
    }

}

As a result you will have:

Columns

Upvotes: 2

Related Questions