如何让 Flex 文本控件自动换行

关键词：

【中文标题】如何让 Flex 文本控件自动换行【英文标题】：how to get a Flex text control to word wrap 【发布时间】：2010-10-06 23:53:43 【问题描述】：

我正在创建一个 Adob​​e Flex 应用程序，并且我有一个文本控件 (mx:Text)，据说当您需要多行不可编辑文本时使用它（而不是标签，它是单行不可编辑文本）。当我将浏览器窗口的大小调整为小于文本时（或在浏览器窗口已经较小的情况下加载它）时，我的文本控件不会换行。在咨询我发现的this doc 时，似乎只有在您指定以像素为单位的绝对宽度时才会发生自动换行功能。这正是我想要避免的。我希望文本换行以适合我的 Flash 对象的大小，以便它始终可见......有没有办法通过我缺少的某些属性或不同的控件来实现这一点？谢谢。

【问题讨论】：

【参考方案1】：

我遇到了同样的问题。在我的情况下，我有一个 mx:Text 块（应该已经包装），并且那个 mx:Text 对象嵌入在两个 mx:VBox 容器中。

我让文本成功换行的唯一方法是执行以下两项操作：

将 ' ' 属性放入每个 VBox 容器（mx:text 所在的容器）。 将 ' ' 属性放入每个 mx:Text 对象（位于 VBox 的嵌套中）

非常不直观，但这对我有用。

希望对您有所帮助！

乔恩·金斯廷

【讨论】：

啊哈。我只是遇到了同样的问题，通过同样的事情解决了——在三件事上明确设置宽度——外框、内框和文本对象。【参考方案2】：

百分比宽度和高度实际上解析为它们的像素等效值，因此使用它们应该可以实现您正在寻找的环绕和相对大小。例如：

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

也就是说，只要有任何类型的宽度设置，相对大小（明确的数字、百分比、基于约束的锚点 - 例如，顶部、右侧、底部、左侧 - 等）应该会导致文本自然包裹。这种方法不适用于您使用的布局吗？没有一些代码，很难说，但你是对的——包装确实需要在容器上设置一个与宽度相关的属性。

不过，调整大小和换行可能有点棘手，具体取决于上下文，所以如果您发现这不起作用，请尝试发布一些代码——我相信我们中的一个人能够帮助您解决这个问题出去。

【讨论】：

【参考方案3】：

如果您试图让文本换行在 MXML 组件中工作，请尝试以下操作：

<mx:Text id="testText"  
  
     
  text="Your text here" />

您基本上是将宽度设置为组件的宽度，并将高度设置为 100% 将允许它在缩小尺寸时正确换行。

【讨论】：

【参考方案4】：

您可以尝试将事件处理程序添加到 Event.RESIZE 的父节点，并调用 Text 对象的 validateNow() 方法。 （可能之前有一个invalidateSize() 电话。）为什么这不会自动发生，我不知道。

【讨论】：

【参考方案5】：

我认为应用 VBox width = "100%" 和 Text width = "100%" 是最简单的方法。注意：如果Text是动态生成的，别忘了做text.percentWidth = 100

【讨论】：

【参考方案6】：

因此，Christian 的示例只是一个内部带有 Text 元素的应用程序，但是很容易搞砸布局。只需在其间添加一个 VBox 并包装 not 工作：

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"  >
<mx:VBox >
    <mx:Text   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>

【讨论】：

【参考方案7】：

尝试在您的文本字段中设置 htmlText="true"。

【讨论】：

【参考方案8】：

我可以只使用 mxml 来做到这一点。结果很丑，但我可以做到。

<s:Group id="propDisplay" >
    <mx:Text id="key" left="0" text="data.key:"/>
    <mx:Text left="key.width" maxWidth="propDisplay.width - key.width" 
                             text="data.value" />
</s:Group>

【讨论】：

【参考方案9】：

render="invalidateSize();validateNow();
'component id'.mx_internal::getTextField().wordWrap=true"

将此添加到您的文本组件中。

【讨论】：

使用显示时如何使文本从换行符开始而不是超过 div：flex [重复]

】使用显示时如何使文本从换行符开始而不是超过div：flex[重复]【英文标题】：Howtomaketextstartonnewlineinsteadofexceedingdivwhenusingdisplay:flex[duplicate]【发布时间】：2021-12-3114:03:58【问题描述】：标题差不多。如果div中的文本大于div的宽... 查看详情

c#如何让控件一直在窗体中间显示

就是控件会随时变换长度让他变换长度后整体也是在窗体的中间而不是向右拉伸C#控件都有一个Anchor属性，而且Anchor属性的默认值都是Top，Left，因此当窗体大小变化时，你会发现控件的位置相对于整个窗体而言发生了变化。想让... 查看详情

excel里如何让文字自动换行显示

参考技术AEXCEL里面单元格内容太多显示不全可以在单元格文本对对齐方式中设置。方法步骤如下：演示机型：联想天逸510S      系统版本：Windows10操作软件：Excel20131、文字自动换行：首先选中要处理的表格... 查看详情

css3让文本自动换行——word-break属性

1.依靠浏览器让文本自动换行浏览器本身都自带着让文本自动换行的功能。2.指定自动换行的处理方法在CSS3中，可以使用word-break属性来自己决定自动换行的处理方法。div{  word-break:break-all;}word-break属性可以使用的值值换行... 查看详情

如何在 UIPickerView 中自动换行

】如何在UIPickerView中自动换行【英文标题】：HowtomakeWordwrapinUIPickerView【发布时间】：2015-01-1807:08:05【问题描述】：我有一个UIPickerView，我想让文本自动换行。这是我的代码：-(UIView*)pickerView:(UIPickerView*)pickerViewviewForRow:(NSInteger)row... 查看详情

excel2003如何设置自动换行

...元格时，会超出单元格的宽度。下面让我为你带来excel2003如何换行的方法。　　excel2003换行设置步骤：　　1、我们打开excel2003以后，然后选择需要自动换行的单元格区域，然后单击鼠标右键，在弹出的快捷菜单中选择设置单元... 查看详情

bserpwebpos小票设计器中控件如何设置自动换行。

BSERPWEBPOS小票设计器中控件如何设置自动换行。选中控件后在属性区别中设置wordwrap为true即可。参考技术A有同感遇到过这样的问题，好像是百胜软件公司的一个技术帮我处理的，终于在这看到方法了。 查看详情

无法在 iframe 文本编辑器中使用自动换行

...jQueryUI，但我无法让自动换行功能正常工作。谁能告诉我如何使用word-wrap:break-word;以便在单词之间没有空格时自动换行。我尝试过#textEditorw 查看详情

unity新手文本输出如何换行

比如定义m为gui.text，输出m.text时如何让文本自动换行？代码如下，希望输出鼠标坐标可以x,y,z分别在不同的行求大神解答，谢谢！参考技术A例：GUI.Label(newRect(20,80,500,100),"明天你好，\n非常好!");\n代表换行，\r代表... 查看详情

uwp基本控件

一：TextBlock文本显示框1. IsTextSelectionEnabled属性 值是true或者false。TextBlock有一个文本是否能够选中的属性，用于设置文本框是否可以选择文字。2. TextWrapping文字自动换行属性，有三个值WrapNoWrap WrapWholeWords分别表示... 查看详情

微信小程序中的input控件怎么实现自动换行

参考技术Ainput是没有换行功能的，具体方法可以用textarea标签方法如下：这样就变成3行的文本框了 查看详情

无法让自动换行在 UIButton 上工作

...并尝试自动换行，但它总是在一行中显示超出按钮大小的文本。NSString*text=NSLocalizedString(@"StartLoading",@"StartLoading");_continueBtn.titleLa 查看详情

让 UITableViewCell 使用自动布局调整自身大小

...换行。如果他们自动换行，则文本将进入下一个单元格。如何让AutoLayout根据内容展开单元格，而无需在heightForRowAtInde 查看详情

vb：text控件，输出的时候怎么换行？

...ccccccccc意思是：这三个分三行输出VB的TextBox控件输出多行文本方法：把MultiLine属性设为True，可以使TextBox在运行时接受或显示多行文本。只要没有水平方向ScrollBar，多行TextBox中的文本会自动按字换行。ScrollBars属性的缺省值被设... 查看详情

datatables表格中的内容怎么设置让它不自动换行

...就不能够为它去设置宽度，如果设置的话可以对其绑定的控件进行设置，例如：绑定的控件对象为DataGridView那么可以这样datagridview1.datasource=datatable；datagridview1.Column[0].Width=100;这样就可以将控件上第一列的数据宽设置为100.意思是... 查看详情

Twitter Bootstrap 按钮文本自动换行

】TwitterBootstrap按钮文本自动换行【英文标题】：TwitterBootstrapButtonTextWordWrap【发布时间】：2013-09-3012:43:58【问题描述】：在我的一生中，我无法让这些twitter引导按钮将文本换行到多行，它们看起来像这样。我无法发布图片，所以... 查看详情

canvas文本自动换行

在用canvas中写刮奖结果的时候发现canvas中的文本不会自动折行，要进行截断另起一行来写。在此参考文章html5-canvas的绘制文本自动换行来做改写。根据canvas宽度来做折行在此根据项目的情况让文本占canvas的八分之五，具体可以根... 查看详情

如何让 jqgrid 冻结列与自动换行一起使用

】如何让jqgrid冻结列与自动换行一起使用【英文标题】：Howcanigetjqgridfrozencolumnstoworkwithwordwrapon【发布时间】：2012-01-3023:29:09【问题描述】：我正在使用最新的jqgrid4.3.1，并且我正在尝试使用冻结列。问题是我在jqgrid中覆盖了默认... 查看详情