GWT：如何获取文本框中文本的宽度？

我需要在GoogleWebToolkit的文本框中确定文本的宽度。 我有一个比例字体，所以我不能只使用像

getText（）.length（）*characterWidth

这样的东西

我要做的是调整文本大小，使其始终适合文本框。这就是为什么我需要文本的宽度来计算所需的字体大小

---

我能想到的唯一解决办法是绘制我使用的字体的字符宽度图，并将文本宽度计算为单个字符的宽度之和。

我将使用字符数乘以字母“m”的宽度，这是定义上限的经典方法。我决不会批评你将要做的事情，但我发现改变元素的形式在空间上可能是有效的，但使用起来很糟糕。用户在此处看到文本框，然后加载数据，然后文本框突然移动。用户已经花费时间重新检查表单，以重新确定自己的方向，重新建立地标，一旦加载新文本，地标无论如何都会移动。你用空间换取了时间，结果却变得更穷。也许这不适用于你正在做的事情，但如果是这样，考虑一下。< /P> 为什么没有明显的方法去做你想做的事情，这是有原因的

更新：

---

来自corvus：“所以用户可以看到整个文本。当然，必须有下限，但我从相当大的字体大小开始；）–”

---

啊，好的。对此有一些想法。据推测，您的数据字段在大小方面有一个上限。说80个字符。基于我上面给出的原因，这种大小的固定字段比来回捕捉的字段要好。但也要知道，一行文字的“适当”长度约为60个字符左右。这源于古腾堡数百年的排版经验。即使这只是一个平均值，你也可以通过这个链接来了解它。如果用户要与之交互的文本（阅读或输入）超过60个字符（或您确定的任何理想行长度），那么您可能需要一个多行文本区。

尽管我不确定您为什么要这样做，但我可以说，没有真正的、健壮的解决方案。你可以像@Steve J建议的那样使用启发式，但是你无法计算文本的确切大小

---

我只想告诉你一点，为什么你的解决方案行不通。如果字体样式、大小等在用户自己的样式表中声明为

！重要信息

？

我通过引入额外的

标签

元素并用CSS隐藏它，解决了这个问题。我将文本从

文本框

复制到

标签

，并通过

Label.getOffsetWidth（）

检索宽度

我并不真的为这个解决方案感到自豪，但是，嘿，它很管用。

我也解决了这个问题，通过引入一个额外的

标签

元素并用CSS隐藏它。我将文本从

文本框

复制到

标签

，并通过

Label.getOffsetWidth（）

检索宽度

然而，我需要额外的代码来

正确处理重复的空格

处理文本框上的样式更改，以及

避免在用户键入时跳转文本

我发现我可以通过打电话来匹配风格

label.setStyleName(textBox.getStyleName() + " prewrap");

上述语句中引用的预包装样式必须定义为

.prewrap { white-space: pre-wrap; }

此额外样式是必需的，因为textbox的内置样式包含一个

pre-wrap

指令，该指令不出现在

textbox.getStyleName（）

返回的样式列表中

---

在计算宽度时，我还在标签文本字符串的末尾额外添加了两个空格，这样当用户键入时，文本不会来回跳跃。

您可以使用TextArea而不是TextBox，并使用其滚动宽度（

TextArea.getElement（）.getScrollWidth（）

）来确定文本的宽度，只要它比文本区域宽

缺点：滚动宽度不会低于文本区域的偏移宽度，以防文本插入其中

作为一种解决方法，您可以增加字体大小，测试文本是否超过文本区域宽度，如果超过，请坚持使用旧字体大小。我不知道，如果有更直接的方法

要使TextArea看起来像一个单行文本框，需要设置以下css属性：

溢出：隐藏；//摆脱滚动条

调整大小：无；//去掉调整三角形大小

并设置（无css）属性：

wrap=“off”/css“空白：nowrap；”不在这里工作

---

最后但并非最不重要的一点是将高度调整为单行高度（默认高度为2或3行）。

您指的是文本的长度，对吗？不，我指的是以像素为单位的大小。为什么文本需要适合文本框的大小？这样用户就可以看到整个文本。。当然，必须有下限，但我从相当大的字体大小开始；）