@domir/react-native-measure-text 0.1.5 → 0.1.7

package/android/build.gradle

@@ -85,5 +85,6 @@ repositories {
 
 dependencies {
   implementation project(':expo-modules-core')
+  implementation "com.facebook.react:react-native:+"
   implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:${getKotlinVersion()}"
 }

package/android/src/main/java/expo/modules/measuretext/ReactNativeMeasureTextModule.kt

@@ -2,6 +2,7 @@ package expo.modules.measuretext
 
 import android.graphics.Typeface
 import android.text.TextPaint
+import com.facebook.react.uimanager.PixelUtil
 import com.facebook.react.views.text.ReactFontManager
 import com.facebook.react.views.text.ReactTypefaceUtils.parseFontWeight
 import expo.modules.kotlin.modules.Module
@@ -10,6 +11,9 @@ import expo.modules.kotlin.records.Field
 import expo.modules.kotlin.records.Record
 
 class StyleOptions : Record {
+  @Field
+  val letterSpacing: Float? = null
+
   @Field
   val fontFamily: String? = null
 
@@ -18,6 +22,9 @@ class StyleOptions : Record {
 
   @Field
   val fontSize: Int? = null
+
+  @Field
+  val allowFontScaling: Boolean? = null
 }
 
 class ReactNativeMeasureTextModule : Module() {
@@ -25,16 +32,21 @@ class ReactNativeMeasureTextModule : Module() {
     Name("ReactNativeMeasureText")
 
     Function("measureWidth") { text: String, style: StyleOptions ->
-      val paint = createTextPaint(style.fontSize, style.fontFamily, style.fontWeight);
+      val paint = createTextPaint(style.fontSize, style.fontFamily, style.fontWeight, style.letterSpacing, style.allowFontScaling);
       return@Function paint.measureText(text);
     }
   }
 
-  private fun createTextPaint(fontSize: Int?, fontFamily: String?, fontWeight: String?): TextPaint {
+  private fun createTextPaint(fontSize: Int?, fontFamily: String?, fontWeight: String?, letterSpacing: Float?, allowFontScaling: Boolean?): TextPaint {
     val paint = TextPaint(TextPaint.ANTI_ALIAS_FLAG);
     val fontScale = appContext.reactContext?.resources?.configuration?.fontScale ?: 1.0f;
+    val allowScaledFont = allowFontScaling ?: true;
     val usedFontSize = (fontSize ?: 0) * fontScale;
     paint.textSize = usedFontSize;
+    val letterSpacingPixels = if (allowScaledFont)  PixelUtil.toPixelFromSP(letterSpacing ?: 0f) else PixelUtil.toPixelFromDIP(letterSpacing ?: 0f);
+    val mFontSize = if (allowScaledFont) Math.ceil(PixelUtil.toPixelFromSP(usedFontSize).toDouble()).toInt() else Math.ceil(PixelUtil.toPixelFromDIP(usedFontSize).toDouble()).toInt();
+    val usedLetterSpacing = if (letterSpacingPixels <= 0f) letterSpacing ?: 0f else letterSpacingPixels / mFontSize;
+    paint.letterSpacing = usedLetterSpacing;
     val assetManager = appContext.reactContext?.assets;
 
     if (fontFamily == null || assetManager == null || fontWeight == null) {

package/ios/ReactNativeMeasureTextModule.swift

@@ -10,6 +10,12 @@ struct StyleOptions: Record {
 
   @Field
   var fontSize: Int? = nil
+
+  @Field
+  var letterSpacing: Double? = nil
+
+  @Field
+  var allowFontScaling: Bool? = nil // ANDROID ONLY
 }
 
 public class ReactNativeMeasureTextModule: Module {
@@ -18,10 +24,11 @@ public class ReactNativeMeasureTextModule: Module {
 
     Function("measureWidth") { (text: String, style: StyleOptions) -> CGFloat in
       let fontSize = style.fontSize != nil ? RCTConvert.cgFloat(style.fontSize) : CGFloat(0)
+      let letterSpacing = style.letterSpacing != nil ? RCTConvert.cgFloat(style.letterSpacing) : CGFloat(0)
       let usedFontWeight = style.fontWeight ?? "Normal"
 
       if let font = style.fontFamily != nil ?
-        RCTConvert.uiFont(["fontWeight": usedFontWeight, "fontFamily": style.fontFamily!, "fontSize": fontSize]) : RCTConvert.uiFont(["fontWeight": usedFontWeight, "fontSize": fontSize])
+        RCTConvert.uiFont(["fontWeight": usedFontWeight, "fontFamily": style.fontFamily!, "fontSize": fontSize, NSAttributedString.Key.kern: letterSpacing ]) : RCTConvert.uiFont(["fontWeight": usedFontWeight, "fontSize": fontSize])
       {
         let size: CGSize = text.size(withAttributes: [.font: font])
         return size.width

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domir/react-native-measure-text",
-  "version": "0.1.5",
+  "version": "0.1.7",
   "description": "Measure text width synchronously using JSI",
   "main": "build/ReactNativeMeasureText.js",
   "types": "build/ReactNativeMeasureText.d.ts",

package/src/ReactNativeMeasureText.ts

@@ -2,7 +2,7 @@ import ReactNativeMeasureText from "./ReactNativeMeasureTextModule";
 
 export function measureWidth(
   text: string,
-  style: { fontSize?: number; fontFamily?: string; fontWeight?: string } = {}
+  style: { fontSize?: number; fontFamily?: string; fontWeight?: string, letterSpacing?: number, allowFontScaling?: boolean } = {}
 ): number {
   return ReactNativeMeasureText.measureWidth(text, style);
 }