Ext.util.TextMetrics.html
10.7 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
<div class="body-wrap">
<div class="top-tools">
<a class="inner-link" href="#Ext.util.TextMetrics-props"><img src="../resources/images/default/s_wev8.gif" class="item-icon icon-prop">Properties</a>
<a class="inner-link" href="#Ext.util.TextMetrics-methods"><img src="../resources/images/default/s_wev8.gif" class="item-icon icon-method">Methods</a>
<a class="inner-link" href="#Ext.util.TextMetrics-events"><img src="../resources/images/default/s_wev8.gif" class="item-icon icon-event">Events</a>
<a class="bookmark" href="../docs/?class=Ext.util.TextMetrics"><img src="../resources/images/default/s_wev8.gif" class="item-icon icon-fav">Direct Link</a>
</div>
<h1>Class Ext.util.TextMetrics</h1>
<table cellspacing="0">
<tr><td class="label">Package:</td><td class="hd-info">Ext.util</td></tr>
<tr><td class="label">Defined In:</td><td class="hd-info"><a href="../source/util/TextMetrics_wev8.js" target="_blank">TextMetrics_wev8.js</a></td></tr>
<tr><td class="label">Class:</td><td class="hd-info">TextMetrics</td></tr>
<tr><td class="label">Extends:</td><td class="hd-info">Object</td></tr>
</table>
<div class="description">
Provides precise pixel measurements for blocks of text so that you can determine exactly how high and
wide, in pixels, a given block of text will be.<br><br><i>This class is a singleton and cannot be created directly.</i> </div>
<div class="hr"></div>
<a id="Ext.util.TextMetrics-props"></a>
<h2>Public Properties</h2>
<div class="no-members">This class has no public properties.</div> <a id="Ext.util.TextMetrics-methods"></a>
<h2>Public Methods</h2>
<table cellspacing="0" class="member-table">
<tr>
<th class="sig-header" colspan="2">Method</th>
<th class="msource-header">Defined By</th>
</tr>
<tr class="method-row expandable">
<td class="micon"><a class="exi" href="#expand"> </a></td>
<td class="sig">
<a id="Ext.util.TextMetrics-bind"></a>
<b>bind</b>( <code>String/HTMLElement el</code> ) : void <div class="mdesc">
<div class="short">Binds this TextMetrics instance to an element from which to copy existing CSS styles
that can affect the size of the ...</div>
<div class="long">
Binds this TextMetrics instance to an element from which to copy existing CSS styles
that can affect the size of the rendered text <div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>el</code> : String/HTMLElement<div class="sub-desc">The element, dom node or id</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
</div>
</td>
<td class="msource">TextMetrics</td>
</tr>
<tr class="method-row alt expandable">
<td class="micon"><a class="exi" href="#expand"> </a></td>
<td class="sig">
<a id="Ext.util.TextMetrics-createInstance"></a>
<b>createInstance</b>( <code>String/HTMLElement el</code>, <span class="optional" title="Optional">[<code>Number fixedWidth</code>]</span> ) : Ext.util.TextMetrics.Instance <div class="mdesc">
<div class="short">Return a unique TextMetrics instance that can be bound directly to an element and reused. This reduces
the overhead ...</div>
<div class="long">
Return a unique TextMetrics instance that can be bound directly to an element and reused. This reduces
the overhead of multiple calls to initialize the style properties on each measurement. <div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>el</code> : String/HTMLElement<div class="sub-desc">The element, dom node or id that the instance will be bound to</div></li><li><code>fixedWidth</code> : Number<div class="sub-desc">(optional) If the text will be multiline, you have to set a fixed width
in order to accurately measure the text height</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Ext.util.TextMetrics.Instance</code><div class="sub-desc">instance The new instance</div></li>
</ul>
</div>
</div>
</div>
</td>
<td class="msource">TextMetrics</td>
</tr>
<tr class="method-row expandable">
<td class="micon"><a class="exi" href="#expand"> </a></td>
<td class="sig">
<a id="Ext.util.TextMetrics-getHeight"></a>
<b>getHeight</b>( <code>String text</code> ) : Number <div class="mdesc">
<div class="short">Returns the measured height of the specified text. For multiline text, be sure to call
<a ext:cls="Ext.util.TextMetrics" ext:member="setFixedWidth" href="output/Ext.util.TextMetrics.html#setFixedWidth">setFixedWidth</a> if necessary.</div>
<div class="long">
Returns the measured height of the specified text. For multiline text, be sure to call
<a ext:cls="Ext.util.TextMetrics" ext:member="setFixedWidth" href="output/Ext.util.TextMetrics.html#setFixedWidth">setFixedWidth</a> if necessary. <div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>text</code> : String<div class="sub-desc">The text to measure</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Number</code><div class="sub-desc">height The height in pixels</div></li>
</ul>
</div>
</div>
</div>
</td>
<td class="msource">TextMetrics</td>
</tr>
<tr class="method-row alt expandable">
<td class="micon"><a class="exi" href="#expand"> </a></td>
<td class="sig">
<a id="Ext.util.TextMetrics-getSize"></a>
<b>getSize</b>( <code>String text</code> ) : Object <div class="mdesc">
<div class="short">Returns the size of the specified text based on the internal element's style and width properties</div>
<div class="long">
Returns the size of the specified text based on the internal element's style and width properties <div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>text</code> : String<div class="sub-desc">The text to measure</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Object</code><div class="sub-desc">An object containing the text's size {width: (width), height: (height)}</div></li>
</ul>
</div>
</div>
</div>
</td>
<td class="msource">TextMetrics</td>
</tr>
<tr class="method-row expandable">
<td class="micon"><a class="exi" href="#expand"> </a></td>
<td class="sig">
<a id="Ext.util.TextMetrics-getWidth"></a>
<b>getWidth</b>( <code>String text</code> ) : Number <div class="mdesc">
<div class="short">Returns the measured width of the specified text</div>
<div class="long">
Returns the measured width of the specified text <div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>text</code> : String<div class="sub-desc">The text to measure</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Number</code><div class="sub-desc">width The width in pixels</div></li>
</ul>
</div>
</div>
</div>
</td>
<td class="msource">TextMetrics</td>
</tr>
<tr class="method-row alt expandable">
<td class="micon"><a class="exi" href="#expand"> </a></td>
<td class="sig">
<a id="Ext.util.TextMetrics-measure"></a>
<b>measure</b>( <code>String/HTMLElement el</code>, <code>String text</code>, <span class="optional" title="Optional">[<code>Number fixedWidth</code>]</span> ) : Object <div class="mdesc">
<div class="short">Measures the size of the specified text</div>
<div class="long">
Measures the size of the specified text <div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>el</code> : String/HTMLElement<div class="sub-desc">The element, dom node or id from which to copy existing CSS styles
that can affect the size of the rendered text</div></li><li><code>text</code> : String<div class="sub-desc">The text to measure</div></li><li><code>fixedWidth</code> : Number<div class="sub-desc">(optional) If the text will be multiline, you have to set a fixed width
in order to accurately measure the text height</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Object</code><div class="sub-desc">An object containing the text's size {width: (width), height: (height)}</div></li>
</ul>
</div>
</div>
</div>
</td>
<td class="msource">TextMetrics</td>
</tr>
<tr class="method-row expandable">
<td class="micon"><a class="exi" href="#expand"> </a></td>
<td class="sig">
<a id="Ext.util.TextMetrics-setFixedWidth"></a>
<b>setFixedWidth</b>( <code>Number width</code> ) : void <div class="mdesc">
<div class="short">Sets a fixed width on the internal measurement element. If the text will be multiline, you have
to set a fixed width...</div>
<div class="long">
Sets a fixed width on the internal measurement element. If the text will be multiline, you have
to set a fixed width in order to accurately measure the text height. <div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>width</code> : Number<div class="sub-desc">The width to set on the element</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
</div>
</td>
<td class="msource">TextMetrics</td>
</tr>
</table>
<a id="Ext.util.TextMetrics-events"></a>
<h2>Public Events</h2>
<div class="no-members">This class has no public events.</div>
</div>