Как установить вертикальное пространство (начальное) между двумя абзацами HTML в текстовом поле AS3? - PullRequest
3 голосов
/ 06 июля 2010

Есть ли способ управления вертикальным пространством между двумя абзацами HTML в текстовом поле AS3?

Я понимаю и успешно применил стили CSS через AS3, а также использовал класс TextFormat.

Я все еще не могу контролировать вертикальное пространство между закрытием и открытием <p> тег:

txt.htmlText = "<p>First paragraph here.</p><p>Second paragraph here.</p>";

Приведенный выше пример отображается с правильным шрифтом и межбуквенным интервалом, но пробел между абзацами либо в два раза больше, если txt.condenseWhite = false, либо слишком сжат, если txt.condenseWhite = true.

Так как только margin-left и margin-right доступны атрибуты CSS в AS3, а не margin-top или margin-bottom, я в растерянности.

Спасибо!

Ответы [ 3 ]

5 голосов
/ 22 февраля 2011

, если вместо простой замены на "</p><br />" вы вставите "</p><p class = 'space'><br/></p>"

, а затем установите начальную и высоту строки для класса пространства в вашем CSS, скажем,

.space {font-size:1px;
    leading:5px;
    }

можно настроить пространство по мере необходимости

1 голос
/ 31 января 2011

То, как я это сделал - что-то вроде хака, но прекрасно работает - это динамическое добавление тега <br /> сразу после закрытия каждого абзаца. Небольшое регулярное выражение делает трюк:

// raw string
var myText:String = "<p>This is the first paragraph.</p><p>This is the second paragraph.</p>";

var myTextField:TextField = new TextField();
myTextField.multiline = true;
myTextField.wordWrap = true;
addChild(myTextField);

myTextField.htmlText = fixClosingP(myText);

// adds "<br />" after every occurrence of "</p>"
function fixClosingP(input:String):String {
    var r:RegExp = /<\/p>/gi;
    return input.replace(r, "</p><br />");
}

Он не даст вам контроль над расстоянием на уровне пикселей, но в основном он вставляет один полный разрыв, который в большинстве случаев работает достаточно хорошо.

0 голосов
/ 06 июля 2010

Мне удалось заставить его работать, создав новый экземпляр TextField для каждого абзаца HTML.

Вот сокращенный пример:

//Set the default spacing (leading) between paragraphs
const PARAGRAPH_LEADING:int = 10;

//Create first TextField instance
var t:TextField = new TextField();
addChild(t);
t.x = 0;
t.y = 0;
t.multiline = true;
t.wordWrap = true;
t.width = 300;
t.autoSize = TextFieldAutoSize.LEFT;
t.border = true; //Just for the example
t.condenseWhite = true;
t.htmlText = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis a odio sed odio dignissim tincidunt vel in nisi. Aenean eu sem mauris, ac scelerisque eros. In hac habitasse platea dictumst. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Pellentesque rutrum porttitor eros sed vulputate. Sed mollis eros quis augue hendrerit lobortis. Quisque velit neque, placerat id tincidunt id, venenatis id felis. Ut in dolor eros.";

//Create second TextField instance
var t2:TextField = new TextField();
addChild(t2);
t2.x = 0;
t2.y = t.y + t.height + PARAGRAPH_LEADING; 
t2.multiline = true;
t2.wordWrap = true;
t2.width = 300;
t2.autoSize = TextFieldAutoSize.LEFT;
t2.border = true; //Just for the example
t.condenseWhite = true;
t2.htmlText = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis a odio sed odio dignissim tincidunt vel in nisi. Aenean eu sem mauris, ac scelerisque eros. In hac habitasse platea dictumst. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Pellentesque rutrum porttitor eros sed vulputate. Sed mollis eros quis augue hendrerit lobortis. Quisque velit neque, placerat id tincidunt id, venenatis id felis. Ut in dolor eros.";

Я также добавил экземпляр TextFormat, который управляет пространством букв (TextFormat.letterSpacing).

И, чтобы контролировать общее лидерство, мне пришлось реализовать решение, перечисленное здесь , где к строке добавляется тег <textformat>, который будет отображаться как htmlText в TextField.

Пример:

var str: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis a odio sed odio dignissim tincidunt vel in nisi.";
str = '<textformat leading="2">' + str + '</textformat>';
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...