fix: add custom fonts to example (#197)

* fix: add custom fonts to example * docs: add collaborator
JimmyDaddy · Jan 22, 2024 · 6e2ad75 · 6e2ad75
1 parent 83d9856
commit 6e2ad75
Show file tree

Hide file tree

Showing 13 changed files with 71 additions and 16 deletions.
diff --git a/README.MD b/README.MD
@@ -15,7 +15,7 @@
   [![CI](https://github.com/JimmyDaddy/react-native-image-marker/actions/workflows/ci.yml/badge.svg)](https://github.com/JimmyDaddy/react-native-image-marker/actions/workflows/ci.yml)
   ![platform-iOS](https://img.shields.io/badge/iOS-black?logo=Apple&style=for-the-badge) ![platform-Android](https://img.shields.io/badge/Android-black?logo=Android&style=for-the-badge)
   <br/>
-  
+
 </div>
 
 ---
@@ -761,6 +761,7 @@ pod 'RNImageMarker', :path => '../node_modules/react-native-image-marker'
 [@gaoxiaosong](https://github.com/gaoxiaosong)
 [@onka13](https://github.com/onka13)
 [@OrangeFlavoredColdCoffee](https://github.com/OrangeFlavoredColdCoffee)
+[@Dendi](https://github.com/vioku)
 
 ## Examples
 

diff --git a/android/src/main/java/com/jimmydaddy/imagemarker/base/TextOptions.kt b/android/src/main/java/com/jimmydaddy/imagemarker/base/TextOptions.kt
@@ -57,12 +57,17 @@ data class TextOptions(val options: ReadableMap) {
         style.shadowLayerStyle!!.color
       )
     }
-    try {
-      //设置字体失败时使用默认字体
-      textPaint.typeface = ReactFontManager.getInstance()
-        .getTypeface(style.fontName!!, Typeface.NORMAL, context.assets)
-    } catch (e: Exception) {
-      textPaint.typeface = Typeface.DEFAULT
+
+    var typefaceFamily = Typeface.DEFAULT
+    if (style.fontName != null) {
+      typefaceFamily = try {
+          //设置字体失败时使用默认字体
+        ReactFontManager.getInstance()
+          .getTypeface(style.fontName!!, Typeface.NORMAL, context.assets)
+      } catch (e: Exception) {
+        Log.e(Constants.IMAGE_MARKER_TAG, "Could not get typeface: " + e.message)
+        Typeface.DEFAULT
+      }
     }
     val textSize = TypedValue.applyDimension(
       TypedValue.COMPLEX_UNIT_SP,
@@ -75,13 +80,13 @@ data class TextOptions(val options: ReadableMap) {
     textPaint.color = Color.parseColor(Utils.transRGBColor(style.color))
     textPaint.isUnderlineText = style.underline
     textPaint.textSkewX = style.skewX!!
-    var typeface = Typeface.create(ReactFontManager.getInstance() .getTypeface(style.fontName!!, Typeface.NORMAL, context.assets), Typeface.NORMAL)
+    var typeface = Typeface.create(typefaceFamily, Typeface.NORMAL)
     if (style.italic && style.bold) {
-      typeface = Typeface.create(Typeface.DEFAULT, Typeface.BOLD_ITALIC)
+      typeface = Typeface.create(typefaceFamily, Typeface.BOLD_ITALIC)
     } else if (style.italic) {
-      typeface = Typeface.create(Typeface.DEFAULT, Typeface.ITALIC)
+      typeface = Typeface.create(typefaceFamily, Typeface.ITALIC)
     } else if (style.bold) {
-      typeface = Typeface.create(Typeface.DEFAULT, Typeface.BOLD)
+      typeface = Typeface.create(typefaceFamily, Typeface.BOLD)
     }
     textPaint.isStrikeThruText = style.strikeThrough
     textPaint.typeface = typeface

diff --git a/example/android/app/src/main/assets/fonts/MaShanZheng-Regular.ttf b/example/android/app/src/main/assets/fonts/MaShanZheng-Regular.ttf
diff --git a/example/android/app/src/main/assets/fonts/RubikBurned-Regular.ttf b/example/android/app/src/main/assets/fonts/RubikBurned-Regular.ttf
diff --git a/example/android/link-assets-manifest.json b/example/android/link-assets-manifest.json
@@ -0,0 +1,13 @@
+{
+  "migIndex": 1,
+  "data": [
+    {
+      "path": "assets/fonts/MaShanZheng-Regular.ttf",
+      "sha1": "1376fdd48ab29afd9599101e8991b773f12177e5"
+    },
+    {
+      "path": "assets/fonts/RubikBurned-Regular.ttf",
+      "sha1": "546eccbc5a368bd10e6a4fe9570208428c16a036"
+    }
+  ]
+}
diff --git a/example/assets/fonts/MaShanZheng-Regular.ttf b/example/assets/fonts/MaShanZheng-Regular.ttf
diff --git a/example/assets/fonts/RubikBurned-Regular.ttf b/example/assets/fonts/RubikBurned-Regular.ttf
diff --git a/example/ios/ImageMarkerExample.xcodeproj/project.pbxproj b/example/ios/ImageMarkerExample.xcodeproj/project.pbxproj
@@ -13,8 +13,10 @@
 		13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
 		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
 		81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };
+		93F7B1DDABE441E6B6212F21 /* MaShanZheng-Regular.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 50CB977CE5BF44179F12CFF5 /* MaShanZheng-Regular.ttf */; };
 		A119E9E12B162437000C0527 /* ImageMarkerExampleUITests.swift in Sources */ = {isa = PBXBuildFile; fileRef = A119E9E02B162437000C0527 /* ImageMarkerExampleUITests.swift */; };
 		A119E9E32B162437000C0527 /* ImageMarkerExampleUITestsLaunchTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = A119E9E22B162437000C0527 /* ImageMarkerExampleUITestsLaunchTests.swift */; };
+		F95A8E69C66343EEB9A8D9DC /* RubikBurned-Regular.ttf in Resources */ = {isa = PBXBuildFile; fileRef = E3DA1B9696844B35AAE670BD /* RubikBurned-Regular.ttf */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -36,6 +38,7 @@
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = ImageMarkerExample/main.m; sourceTree = "<group>"; };
 		15E0FEF5E88EB5BA856E015A /* Pods-ImageMarkerExample-ImageMarkerExampleUITests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ImageMarkerExample-ImageMarkerExampleUITests.release.xcconfig"; path = "Target Support Files/Pods-ImageMarkerExample-ImageMarkerExampleUITests/Pods-ImageMarkerExample-ImageMarkerExampleUITests.release.xcconfig"; sourceTree = "<group>"; };
 		3B4392A12AC88292D35C810B /* Pods-ImageMarkerExample.debug.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ImageMarkerExample.debug.xcconfig"; path = "Target Support Files/Pods-ImageMarkerExample/Pods-ImageMarkerExample.debug.xcconfig"; sourceTree = "<group>"; };
+		50CB977CE5BF44179F12CFF5 /* MaShanZheng-Regular.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "MaShanZheng-Regular.ttf"; path = "../assets/fonts/MaShanZheng-Regular.ttf"; sourceTree = "<group>"; };
 		5709B34CF0A7D63546082F79 /* Pods-ImageMarkerExample.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-ImageMarkerExample.release.xcconfig"; path = "Target Support Files/Pods-ImageMarkerExample/Pods-ImageMarkerExample.release.xcconfig"; sourceTree = "<group>"; };
 		5DCACB8F33CDC322A6C60F78 /* libPods-ImageMarkerExample.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ImageMarkerExample.a"; sourceTree = BUILT_PRODUCTS_DIR; };
 		6F2EF2314753552DE3ED8A96 /* libPods-ImageMarkerExample-ImageMarkerExampleUITests.a */ = {isa = PBXFileReference; explicitFileType = archive.ar; includeInIndex = 0; path = "libPods-ImageMarkerExample-ImageMarkerExampleUITests.a"; sourceTree = BUILT_PRODUCTS_DIR; };
@@ -44,6 +47,7 @@
 		A119E9DE2B162437000C0527 /* ImageMarkerExampleUITests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = ImageMarkerExampleUITests.xctest; sourceTree = BUILT_PRODUCTS_DIR; };
 		A119E9E02B162437000C0527 /* ImageMarkerExampleUITests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ImageMarkerExampleUITests.swift; sourceTree = "<group>"; };
 		A119E9E22B162437000C0527 /* ImageMarkerExampleUITestsLaunchTests.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ImageMarkerExampleUITestsLaunchTests.swift; sourceTree = "<group>"; };
+		E3DA1B9696844B35AAE670BD /* RubikBurned-Regular.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = undefined; includeInIndex = 0; lastKnownFileType = unknown; name = "RubikBurned-Regular.ttf"; path = "../assets/fonts/RubikBurned-Regular.ttf"; sourceTree = "<group>"; };
 		ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
 /* End PBXFileReference section */
 
@@ -106,6 +110,7 @@
 				83CBBA001A601CBA00E9B192 /* Products */,
 				2D16E6871FA4F8E400B85C8A /* Frameworks */,
 				BBD78D7AC51CEA395F1C20DB /* Pods */,
+				A12431AF27494A9D92C20CF1 /* Resources */,
 			);
 			indentWidth = 2;
 			sourceTree = "<group>";
@@ -130,6 +135,16 @@
 			path = ImageMarkerExampleUITests;
 			sourceTree = "<group>";
 		};
+		A12431AF27494A9D92C20CF1 /* Resources */ = {
+			isa = PBXGroup;
+			children = (
+				E3DA1B9696844B35AAE670BD /* RubikBurned-Regular.ttf */,
+				50CB977CE5BF44179F12CFF5 /* MaShanZheng-Regular.ttf */,
+			);
+			name = Resources;
+			path = "";
+			sourceTree = "<group>";
+		};
 		BBD78D7AC51CEA395F1C20DB /* Pods */ = {
 			isa = PBXGroup;
 			children = (
@@ -230,6 +245,8 @@
 			files = (
 				81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */,
 				13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
+				F95A8E69C66343EEB9A8D9DC /* RubikBurned-Regular.ttf in Resources */,
+				93F7B1DDABE441E6B6212F21 /* MaShanZheng-Regular.ttf in Resources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};

diff --git a/example/ios/ImageMarkerExample/Info.plist b/example/ios/ImageMarkerExample/Info.plist
@@ -37,6 +37,11 @@
 	<string></string>
 	<key>NSPhotoLibraryUsageDescription</key>
 	<string>want to use</string>
+	<key>UIAppFonts</key>
+	<array>
+		<string>RubikBurned-Regular.ttf</string>
+		<string>MaShanZheng-Regular.ttf</string>
+	</array>
 	<key>UILaunchStoryboardName</key>
 	<string>LaunchScreen</string>
 	<key>UIRequiredDeviceCapabilities</key>

diff --git a/example/ios/Podfile.lock b/example/ios/Podfile.lock
@@ -946,7 +946,7 @@ PODS:
     - React-debug
   - react-native-blob-util (0.19.6):
     - React-Core
-  - react-native-image-marker (1.2.1):
+  - react-native-image-marker (1.2.2):
     - React-Core
   - react-native-image-picker (5.7.0):
     - React-Core
@@ -1360,7 +1360,7 @@ SPEC CHECKSUMS:
   React-logger: e0c1e918d9588a9f39c9bc62d9d6bfe9ca238d9d
   React-Mapbuffer: 9731a0a63ebaf8976014623c4d637744d7353a7c
   react-native-blob-util: d8fa1a7f726867907a8e43163fdd8b441d4489ea
-  react-native-image-marker: c2352e04b9c5322c47154bd54430182889f4ebd3
+  react-native-image-marker: 5c211bedcc2c74c68775e63d58b6e76b6e4c7bee
   react-native-image-picker: 3269f75c251cdcd61ab51b911dd30d6fff8c6169
   React-nativeconfig: 37aecd26d64b79327c3f10e43b2e9a6c425e0a60
   React-NativeModulesApple: 9ca6d2eaa1dd5606588262195b46d0774bdec83a

diff --git a/example/ios/link-assets-manifest.json b/example/ios/link-assets-manifest.json
@@ -0,0 +1,13 @@
+{
+  "migIndex": 1,
+  "data": [
+    {
+      "path": "assets/fonts/MaShanZheng-Regular.ttf",
+      "sha1": "1376fdd48ab29afd9599101e8991b773f12177e5"
+    },
+    {
+      "path": "assets/fonts/RubikBurned-Regular.ttf",
+      "sha1": "546eccbc5a368bd10e6a4fe9570208428c16a036"
+    }
+  ]
+}
diff --git a/example/react-native.config.js b/example/react-native.config.js
@@ -7,4 +7,5 @@ module.exports = {
       root: path.join(__dirname, '..'),
     },
   },
+  assets: ['./assets/fonts'],
 };
diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -485,7 +485,7 @@ function useViewModel() {
               },
               style: {
                 color: '#FF0000AA',
-                fontName: 'Arial',
+                fontName: 'MaShanZheng-Regular',
                 fontSize,
                 underline,
                 bold,
@@ -520,7 +520,7 @@ function useViewModel() {
               },
               style: {
                 color: '#FF00AA9F',
-                fontName: 'NotoSansSC-Regular',
+                fontName: 'RubikBurned-Regular',
                 fontSize,
                 underline,
                 bold,
@@ -1146,7 +1146,7 @@ function App() {
                   />
                 </RowSplit>
                 {/* <RowSplit>
-                  
+
                 </RowSplit> */}
                 <TouchableOpacity
                   style={[s.btn, { height: 40 }]}
-Original file line number
+Diff line change
@@ Expand Up / @@ -7,4 +7,5 @@ module.exports = { @@
           root: path.join(__dirname, '..'),
         },
       },
+      assets: ['./assets/fonts'],
     };