Multiline

Intl Locales

Extension

Global

squared.settings.defaultIntlLocales = ["ja-JP"]; // All text elements
/* OR */
squared.attr("android.delegate.multiline", "intlLocales", ["ja-JP"]);

Root element

squared.parseDocument("content-id", {
  options: {
    "android.delegate.multiline": {
      intlLocales: ["ja-JP"]
    }
  }
});

Note

The first supported locale is applied to all text elements only when there is word wrapping.

Inline

Setting anything inline overrides all inherited global settings and can also prevent an element from being interpreted.

Source

<p data-intl-locales-android="ja-JP-u-ca, ja-JP">
  吾輩は猫である。名前はたぬき。
  吾輩は猫である。名前はたぬき。
</p>

<p data-intl-locales-android="none">
  吾輩は猫である。名前はたぬき。
  吾輩は猫である。名前はたぬき。
</p>

Tip

The -android suffix is optional when using only one framework.

Font Adjustment

Browser to device measurements are not expected to be accurate due to issues with font availability and screen resolutions. Text wrapping can be adjusted at the global and element level.

Global

squared.settings.fontMeasureAdjust = 1; // 1px added per character to width

Inline

Source

<p>
  content content content content
  content content content content
</p>

Wrap late < 0

<p data-android-font-measure-adjust="-0.5">
  content content content content content
  content content content
</p>

Wrap early > 0

<p data-android-font-measure-adjust="1">
  content content content
  content content content
  content content
</p>

No adjustment = 0

<p data-android-font-measure-adjust="0">
  content content content content
  content content content content
</p>

Ignore

<p data-android-font-measure-adjust="false">
  content content content content content content content content
</p>

Tip

CSS initial-letter uses the multiline extension for detection and rendering.

Column Spacing

The amount of spacing between words cannot be accurately measured due to the font size differences on the output device. Inline properties can be used to modify when a block of text is to be segmented into another column when using CSS column-width or column-spacing.

<p data-android-column-word-spacing="0.25">
  content content content content
  content content content content
</p>

text-align: justify

<p data-android-column-justify-spacing="4">
  content content content content
  content content content content
</p>

Note

CSS word-spacing is not implemented when using column layout.