diff --git a/en/application-dev/reference/apis/js-apis-measure.md b/en/application-dev/reference/apis/js-apis-measure.md index 6095a5e68ed87bc8c92fe3198e36ac4982fe70a7..3e608c26158d219fc76ace69899da778ad6ea576 100644 --- a/en/application-dev/reference/apis/js-apis-measure.md +++ b/en/application-dev/reference/apis/js-apis-measure.md @@ -58,6 +58,52 @@ struct Index { } ``` +## measure.measureTextSize10+ + +measureTextSize(options: MeasureOptions): SizeOptions + +Measures the width of the given single-line text. + +**System capability**: SystemCapability.ArkUI.ArkUI.Full + +**Parameters** + +| Name | Type | Mandatory | Description | +| ------- | ------------------------------- | ---- | --------- | +| options | [MeasureOptions](#measureoptions) | Yes | Information about the measured text.| + +**Return value** + +| Type | Description | +| ------------ | --------- | +| SizeOptions | Layout width and height occupied by the text.
The unit is px.| + + +**Example** + +```ts +import measure from '@ohos.measure' +@Entry +@Component +struct Index { + @State message: string = 'Hello World' + textSize : SizeOptions = measure.measureTextSize({ + textContent: "Hello word", + fontSize: '50px' + }) + build() { + Row() { + Column() { + Text("The width of 'Hello World': " + this.textSize.width) + Text("The height of 'Hello World': " + this.textSize.height) + } + .width('100%') + } + .height('100%') + } +} +``` + ## MeasureOptions Provides attributes of the measured text. @@ -67,8 +113,15 @@ Provides attributes of the measured text. | Name | Type | Mandatory| Description | | -------------- | -------------------------------------------------------------------------------------------------- | ---- | ----------------------------------------------- | | textContent | string | Yes | Content of the measured text. | -| fontSize | number \| string \| [Resource](../arkui-ts/ts-types.md#resource) | No | Font size of the measured text. If the value is of the number type, the unit fp is used.
Default value: **16fp**
**NOTE**
The value cannot be a percentage. | +| constraintWidth10+ | number \| string \| [Resource](../arkui-ts/ts-types.md#resource) | No | Layout width of the measured text.
The default unit is vp. | +| fontSize | number \| string \| [Resource](../arkui-ts/ts-types.md#resource) | No | Font size of the measured text. If the value is of the number type, the unit fp is used.
Default value: **16fp**
**NOTE**
The value cannot be a percent string. | | fontStyle | number \| [FontStyle](../arkui-ts/ts-appendix-enums.md#fontstyle) | No | Font style of the measured text.
Default value: **FontStyle.Normal** | | fontWeight | number \| string \| [FontWeight](../arkui-ts/ts-appendix-enums.md#fontweight) | No | Font width of the measured text. For the number type, the value ranges from 100 to 900, at an interval of 100. The default value is **400**. A larger value indicates a heavier font weight. The string type supports only the string of the number type, for example, **400**, **"bold"**, **"bolder"**, **"lighter"**, **"regular"**, and **"medium"**, which correspond to the enumerated values in **FontWeight**.
Default value: **FontWeight.Normal**| | fontFamily | string \| [Resource](../arkui-ts/ts-types.md#resource) | No | Font family of the measured text. Default value: **'HarmonyOS Sans'**
Only the default font is supported.| | letterSpacing | number \| string | No | Letter spacing of the measured text.| +| textAlign10+ | number \| [TextAlign](../arkui-ts/ts-appendix-enums.md#textalign) | No | Horizontal alignment mode of the measured text.
Default value: **TextAlign.Start**| +| overflow10+ | number \| [TextOverflow](../arkui-ts/ts-appendix-enums.md#textoverflow) | No | Display mode when the measured text is too long.| +| maxLines10+ | number | No | Maximum number of lines in the measured text.| +| lineHeight10+ | number \| string \| [Resource](../arkui-ts/ts-types.md#resource) | No | Line height of the measured text.| +| baselineOffset10+ | number \| string | No | Baseline offset of the measured text.
Default value: **0**| +| textCase10+ | number \| [TextCase](../arkui-ts/ts-appendix-enums.md#textcase) | No | Case of the measured text.
Default value: **TextCase.Normal**| diff --git a/en/application-dev/ui/Readme-EN.md b/en/application-dev/ui/Readme-EN.md index afd987b1607c3a489c7d686e848e61330e4f7a1f..09b8c42877602d230810e9c299cd6a1ab8d73c41 100644 --- a/en/application-dev/ui/Readme-EN.md +++ b/en/application-dev/ui/Readme-EN.md @@ -1,7 +1,7 @@ # UI Development - [ArkUI Overview](arkui-overview.md) -- UI Development with ArkTS-based Declarative Development Paradigm +- ArkTS-based Declarative Development Paradigm - [Overview](ui-ts-overview.md) - [Declarative UI Development Guidelines](ui-ts-developing-intro.md) - Declarative UI Development Examples @@ -27,7 +27,7 @@ - [Custom Component Lifecycle Callbacks](ui-ts-custom-component-lifecycle-callbacks.md) - [Web Component Development](ui-ts-components-web.md) - [Recommendations for Improving Performance](ui-ts-performance-improvement-recommendation.md) -- UI Development with JavaScript-compatible Web-like Development Paradigm +- JavaScript-compatible Web-like Development Paradigm - [Overview](ui-js-overview.md) - Framework Overview - [File Organization](js-framework-file.md)