как получить текстовый элемент управления Flex для переноса слов - PullRequest
33 голосов
/ 11 февраля 2009

Я создаю приложение Adobe Flex и у меня есть элемент управления Text (mx: Text), который предположительно используется, когда вам нужен многострочный нередактируемый текст (в отличие от Label, который представляет собой однострочный нередактируемый текст). Мой текстовый элемент управления не переносится, когда я изменяю размер окна браузера, чтобы он был меньше текста (или загружал его с окном браузера уже меньше). После ознакомления с этим документом , который я обнаружил, может показаться, что функция переноса слов происходит только в том случае, если вы указали абсолютную ширину в пикселях. Это именно то, чего я пытаюсь избежать. Я хочу, чтобы текст был перенесен так, чтобы он соответствовал размеру, указанному в моем объекте Flash, чтобы он всегда был виден ... Есть ли способ сделать это, используя какое-то свойство, которое я пропускаю, или, возможно, другой элемент управления? Спасибо.

Ответы [ 9 ]

25 голосов
/ 17 марта 2009

У меня была такая же проблема. В моем случае у меня был блок mx: Text (который СЛЕДУЕТ обернуть), и этот объект mx: Text был встроен в ДВА контейнера mx: VBox.

Единственный способ, которым я успешно завернул текст, - это сделать ОБА следующего:

  1. поместите свойство width = "100%" в КАЖДЫЙ контейнер VBox (в котором находится mx: text).
  2. поместите свойство width = "100%" в КАЖДЫЙ mx: текстовый объект (находящийся в этой вложенности VBox)

Очень не интуитивно, но это то, что сработало для меня.

Надеюсь, это поможет вам!

Джон Кинстинг

5 голосов
/ 11 февраля 2009

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

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%" height="100%">
    <mx:Text width="100%" height="100%" text="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." />
</mx:Application>

То есть, если есть настройка ширины любого вида, относительный размер (явное число, процент, привязка на основе ограничений - например, сверху, справа, снизу, слева - и т. Д.) Должен вызывать текст обернуть естественно. Этот подход не работает с макетом, который вы используете? Без некоторого кода трудно сказать, но вы правы - для переноса требуется задать свойство контейнера, связанное с шириной.

Изменение размера и перенос может быть немного сложным, хотя, в зависимости от контекста, поэтому, если вы обнаружите, что это не работает, попробуйте опубликовать некоторый код - я уверен, что один из нас сможет помочь вам понять вне.

4 голосов
/ 11 февраля 2010

Если вы пытаетесь заставить перенос текста работать внутри компонента MXML, попробуйте это:

<mx:Text id="testText"  
  width="{ this.width }"
  height="100%"   
  text="Your text here" />

Вы в основном устанавливаете ширину на ширину компонента, а высота на 100% позволяет правильно оборачивать его при уменьшении размера.

0 голосов
/ 28 апреля 2011

Попробуйте установить htmlText = "true" в текстовом поле.

0 голосов
/ 11 марта 2011

Я мог бы сделать это, используя только mxml. Результат довольно уродливый, но я могу это сделать.

<s:Group id="propDisplay" width="100%">
    <mx:Text id="key" left="0" text="{data.key}:"/>
    <mx:Text left="{key.width}" maxWidth="{propDisplay.width - key.width}" 
                             text="{data.value}" />
</s:Group>
0 голосов
/ 07 января 2010
render="invalidateSize();validateNow();
'component id'.mx_internal::getTextField().wordWrap=true"

добавьте это к вашему текстовому компоненту.

0 голосов
/ 07 ноября 2009

Так что пример Кристиана просто приложения с текстовым элементом внутри работы, но слишком легко испортить макет. Просто добавьте один VBox, и обертка не работает:

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%" height="100%">
<mx:VBox width="100%">
    <mx:Text width="100%" height="100%" text="Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." />    
</mx:VBox>
</mx:Application>
0 голосов
/ 24 октября 2009

Я думаю, что применение VBox width = "100%" и Text width = "100%" - самый простой способ. Примечание: если текст генерируется динамически, не забудьте сделать text.percentWidth = 100

0 голосов
/ 11 февраля 2009

Вы можете попробовать добавить обработчик событий в родительский узел для Event.RESIZE и вызвать метод validateNow() объекта Text. (Возможно, ему предшествует вызов invalidateSize().) Почему это не происходит автоматически, я не могу сказать.

...