Skip to content

Commit 0cd0afe

Browse files
authored
fix: fix #202 generates inconsistent text size across different devices for 1.1.x (#203)
* feat: replace positionOptions to postions * fix: set the font size without considering the screen density * ci: update gh actions * chore: release 1.1.14
1 parent 6e4bd2e commit 0cd0afe

File tree

9 files changed

+95
-49
lines changed

9 files changed

+95
-49
lines changed

.github/workflows/ci.yml

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
name: Build and Test
2-
on:
1+
name: CI
2+
on:
33
pull_request:
44
types: [opened, synchronize, reopened]
55
workflow_dispatch:
66

7-
concurrency:
7+
concurrency:
88
group: ${{ github.workflow }}-${{ github.head_ref }}
99
cancel-in-progress: true
1010

@@ -43,7 +43,7 @@ jobs:
4343
ruby-version: 2.7
4444
bundler-cache: true
4545

46-
- name: Setup node 16
46+
- name: Setup node
4747
if: steps.verify-dev-changed-files.outputs.any_changed == 'true'
4848
uses: actions/setup-node@v3
4949
with:
@@ -78,7 +78,7 @@ jobs:
7878
assets/**
7979
package.json
8080
!example/ios/**
81-
81+
8282
- uses: actions/cache@v3
8383
name: Cache node_modules
8484
if: steps.verify-android-changed-files.outputs.any_changed == 'true'
@@ -107,7 +107,7 @@ jobs:
107107
ruby-version: 2.7
108108
bundler-cache: true
109109

110-
- name: Setup node 16
110+
- name: Setup node
111111
uses: actions/setup-node@v3
112112
if: steps.verify-android-changed-files.outputs.any_changed == 'true'
113113
with:
@@ -119,7 +119,7 @@ jobs:
119119
with:
120120
distribution: 'zulu'
121121
java-version: 11
122-
122+
123123
- name: Install Gradle dependencies
124124
if: steps.cache-gradle.outputs.cache-hit != 'true' && steps.verify-android-changed-files.outputs.any_changed == 'true'
125125
run: |
@@ -128,7 +128,7 @@ jobs:
128128
129129
- name: Run unit tests
130130
if: steps.verify-android-changed-files.outputs.any_changed == 'true'
131-
run: |
131+
run: |
132132
cd example/android
133133
./gradlew test --stacktrace
134134
@@ -153,7 +153,7 @@ jobs:
153153
name: Android Test
154154
strategy:
155155
matrix:
156-
api-level: [24, 25, 29, 30, 31]
156+
api-level: [24, 30, 31]
157157
target: [default]
158158
steps:
159159
- name: Checkout the code
@@ -199,7 +199,7 @@ jobs:
199199
ruby-version: 2.7
200200
bundler-cache: true
201201

202-
- name: Setup node 16
202+
- name: Setup node
203203
uses: actions/setup-node@v3
204204
if: steps.verify-android-changed-files.outputs.any_changed == 'true'
205205
with:
@@ -262,7 +262,7 @@ jobs:
262262
example/node_modules
263263
key: ${{ runner.os }}-nodeModules-${{ hashFiles('package.json') }}-${{ hashFiles('example/package.json') }}
264264
fail-on-cache-miss: true
265-
265+
266266
- name: Cache Pods
267267
id: cache-pods
268268
uses: actions/cache@v3
@@ -277,12 +277,12 @@ jobs:
277277
with:
278278
ruby-version: 2.7
279279
bundler-cache: true
280-
280+
281281
- name: Install Cocoapods
282282
if: steps.verify-iOS-changed-files.outputs.any_changed == 'true'
283283
run: gem install cocoapods -v ${{ matrix.cocoapods }}
284284

285-
- name: Setup node 16
285+
- name: Setup node
286286
if: steps.verify-iOS-changed-files.outputs.any_changed == 'true'
287287
uses: actions/setup-node@v3
288288
with:
@@ -301,13 +301,13 @@ jobs:
301301

302302
- name: Build
303303
if: steps.verify-iOS-changed-files.outputs.any_changed == 'true'
304-
run: |
304+
run: |
305305
cd example/ios
306306
xcodebuild -workspace ImageMarkerExample.xcworkspace -scheme ImageMarkerExample -configuration Release -sdk iphonesimulator -destination 'platform=iOS Simulator,name=iPhone 12' | xcpretty
307307
308308
- name: Test
309309
if: steps.verify-iOS-changed-files.outputs.any_changed == 'true'
310-
run: |
310+
run: |
311311
cd example/ios
312312
xcodebuild -workspace ImageMarkerExample.xcworkspace -scheme ImageMarkerExample -sdk iphonesimulator -destination 'platform=iOS Simulator,name=iPhone 12' test | xcpretty
313313

CHANGELOG.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,17 @@
11

22

3+
## [1.1.14](https://github.com/JimmyDaddy/react-native-image-marker/compare/v1.1.13...v1.1.14) (2024-01-24)
4+
5+
6+
### Bug Fixes
7+
8+
* set the font size without considering the screen density ([da84135](https://github.com/JimmyDaddy/react-native-image-marker/commit/da8413520f8adc185048ea89a21c28a55f2689c5))
9+
10+
11+
### Features
12+
13+
* replace positionOptions to postions ([8077617](https://github.com/JimmyDaddy/react-native-image-marker/commit/8077617b5b5eadf3d239d610853d76220852f5de))
14+
315
## [1.1.13](https://github.com/JimmyDaddy/react-native-image-marker/compare/v1.1.12...v1.1.13) (2024-01-22)
416

517

android/src/main/java/com/jimmydaddy/imagemarker/base/TextOptions.kt

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ data class TextOptions(val options: ReadableMap) {
3131
throw MarkerError(ErrorCode.PARAMS_REQUIRED, "mark text is required")
3232
}
3333
val positionOptions =
34-
if (null != options.getMap("positionOptions")) options.getMap("positionOptions") else null
34+
if (null != options.getMap("position")) options.getMap("position") else null
3535
x = if (positionOptions!!.hasKey("X")) Utils.handleDynamicToString(positionOptions.getDynamic("X")) else null
3636
y = if (positionOptions.hasKey("Y")) Utils.handleDynamicToString(positionOptions.getDynamic("Y")) else null
3737
positionEnum =
@@ -69,11 +69,12 @@ data class TextOptions(val options: ReadableMap) {
6969
Typeface.DEFAULT
7070
}
7171
}
72-
val textSize = TypedValue.applyDimension(
73-
TypedValue.COMPLEX_UNIT_SP,
74-
style.fontSize,
75-
context.resources.displayMetrics
76-
)
72+
// val textSize = TypedValue.applyDimension(
73+
// TypedValue.COMPLEX_UNIT_SP,
74+
// style.fontSize,
75+
// context.resources.displayMetrics
76+
// )
77+
val textSize = style.fontSize
7778
textPaint.isAntiAlias = true
7879
textPaint.textSize = textSize
7980
Log.i(Constants.IMAGE_MARKER_TAG, "textSize: " + textSize + " fontSize: " + style.fontSize + " displayMetrics: " + context.resources.displayMetrics)
@@ -121,7 +122,7 @@ data class TextOptions(val options: ReadableMap) {
121122
).toInt()
122123
}
123124
val margin = DEFAULT_MARGIN
124-
var position = Position(margin.toFloat(), margin.toFloat())
125+
var position = Position(margin, margin)
125126
if (positionEnum != null) {
126127
position = Position.getTextPosition(
127128
positionEnum,
@@ -168,9 +169,9 @@ data class TextOptions(val options: ReadableMap) {
168169
if (style.textBackgroundStyle!!.cornerRadius != null) {
169170
val path = Path()
170171

171-
path.addRoundRect(bgRect, style.textBackgroundStyle!!.cornerRadius!!.radii(bgRect), Path.Direction.CW);
172+
path.addRoundRect(bgRect, style.textBackgroundStyle!!.cornerRadius!!.radii(bgRect), Path.Direction.CW)
172173

173-
canvas.drawPath(path, paint);
174+
canvas.drawPath(path, paint)
174175
} else {
175176
canvas.drawRect(bgRect, paint)
176177
}
@@ -179,6 +180,7 @@ data class TextOptions(val options: ReadableMap) {
179180
Paint.Align.RIGHT -> x + textWidth
180181
Paint.Align.CENTER -> x + textWidth / 2
181182
Paint.Align.LEFT -> x
183+
else -> x
182184
}
183185
canvas.translate(textX, y)
184186
textLayout.draw(canvas)

android/src/main/java/com/jimmydaddy/imagemarker/base/TextStyle.kt

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ data class TextStyle(val options: ReadableMap?) {
1111
var shadowLayerStyle: ShadowLayerStyle?
1212
var textBackgroundStyle: TextBackgroundStyle?
1313
var underline: Boolean = if (options?.hasKey("underline") == true) options.getBoolean("underline") else false
14-
var skewX: Float? = if (options?.hasKey("skewX") == true) options.getDouble("skewX")?.toFloat() else 0f
14+
var skewX: Float? = if (options?.hasKey("skewX") == true) options.getDouble("skewX").toFloat() else 0f
1515
var strikeThrough: Boolean = if (options?.hasKey("strikeThrough") == true) options.getBoolean("strikeThrough") else false
1616
var textAlign: Align
1717
var italic: Boolean = if (options?.hasKey("italic") == true) options.getBoolean("italic") else false

example/src/App.tsx

Lines changed: 33 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -291,8 +291,11 @@ function useViewModel() {
291291
useModal: true,
292292
},
293293
(buttonIndex) => {
294-
if (buttonIndex === cancelButtonIndex || buttonIndex == null) return;
295-
else setBackgroundFormat(options[buttonIndex] as any);
294+
if (buttonIndex === cancelButtonIndex || buttonIndex == null) {
295+
return;
296+
} else {
297+
setBackgroundFormat(options[buttonIndex] as any);
298+
}
296299
}
297300
);
298301
}
@@ -309,8 +312,11 @@ function useViewModel() {
309312
useModal: true,
310313
},
311314
(buttonIndex) => {
312-
if (buttonIndex === cancelButtonIndex || buttonIndex == null) return;
313-
else setWaterMarkType(options[buttonIndex] as any);
315+
if (buttonIndex === cancelButtonIndex || buttonIndex == null) {
316+
return;
317+
} else {
318+
setWaterMarkType(options[buttonIndex] as any);
319+
}
314320
}
315321
);
316322
}
@@ -332,8 +338,11 @@ function useViewModel() {
332338
useModal: true,
333339
},
334340
(buttonIndex) => {
335-
if (buttonIndex === cancelButtonIndex || buttonIndex == null) return;
336-
else setSaveFormat(options[buttonIndex] as any);
341+
if (buttonIndex === cancelButtonIndex || buttonIndex == null) {
342+
return;
343+
} else {
344+
setSaveFormat(options[buttonIndex] as any);
345+
}
337346
}
338347
);
339348
}
@@ -359,8 +368,9 @@ function useViewModel() {
359368
useModal: true,
360369
},
361370
(buttonIndex) => {
362-
if (buttonIndex === cancelButtonIndex || buttonIndex == null) return;
363-
else {
371+
if (buttonIndex === cancelButtonIndex || buttonIndex == null) {
372+
return;
373+
} else {
364374
setPosition(options[buttonIndex] as any);
365375
}
366376
}
@@ -384,8 +394,9 @@ function useViewModel() {
384394
useModal: true,
385395
},
386396
(buttonIndex) => {
387-
if (buttonIndex === cancelButtonIndex || buttonIndex == null) return;
388-
else {
397+
if (buttonIndex === cancelButtonIndex || buttonIndex == null) {
398+
return;
399+
} else {
389400
setTextBgStretch(options[buttonIndex] as any);
390401
}
391402
}
@@ -404,8 +415,9 @@ function useViewModel() {
404415
useModal: true,
405416
},
406417
(buttonIndex) => {
407-
if (buttonIndex === cancelButtonIndex || buttonIndex == null) return;
408-
else {
418+
if (buttonIndex === cancelButtonIndex || buttonIndex == null) {
419+
return;
420+
} else {
409421
setTextAlign(options[buttonIndex] as any);
410422
}
411423
}
@@ -514,7 +526,7 @@ function useViewModel() {
514526
},
515527
},
516528
{
517-
text: `text marker normal`,
529+
text: 'text marker normal',
518530
positionOptions: {
519531
position: Position.center,
520532
},
@@ -560,13 +572,14 @@ function useViewModel() {
560572
saveFormat: saveFormat,
561573
});
562574
}
563-
setUri(
575+
const resUri =
564576
saveFormat === ImageFormat.base64
565577
? path
566578
: Platform.OS === 'android'
567579
? 'file:' + path
568-
: path
569-
);
580+
: path;
581+
setUri(resUri);
582+
console.log(resUri);
570583
setLoading(false);
571584
setShow(true);
572585
const stat = await RNBlobUtil.fs.stat(path);
@@ -698,13 +711,14 @@ function useViewModel() {
698711
saveFormat: saveFormat,
699712
});
700713
}
701-
setUri(
714+
const resUri =
702715
saveFormat === ImageFormat.base64
703716
? path
704717
: Platform.OS === 'android'
705718
? 'file:' + path
706-
: path
707-
);
719+
: path;
720+
setUri(resUri);
721+
console.log(resUri);
708722
setShow(true);
709723
setLoading(false);
710724
const stat = await RNBlobUtil.fs.stat(path);

ios/RCTImageMarker/TextOptions.swift

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ class TextOptions: NSObject {
2121
throw NSError(domain: ErrorDomainEnum.PARAMS_REQUIRED.rawValue, code: 0, userInfo: [NSLocalizedDescriptionKey: "text is required"])
2222
}
2323

24-
if let positionOpts = opts["positionOptions"] as? [AnyHashable: Any] {
24+
if let positionOpts = opts["position"] as? [AnyHashable: Any] {
2525
self.X = Utils.handleDynamicToString(v: positionOpts["X"])
2626
self.Y = Utils.handleDynamicToString(v: positionOpts["Y"])
2727
self.position = positionOpts["position"] != nil ? RCTConvert.MarkerPosition(positionOpts["position"]) : .none

ios/RCTImageMarker/TextStyle.swift

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,7 @@ class TextStyle: NSObject {
3030
self.shadow = nil
3131
}
3232
self.textBackground = try TextBackground(textBackgroundStyle: (opts["textBackgroundStyle"] as? [AnyHashable : Any]))
33-
let scale = UIScreen.main.scale
34-
let fontSize = opts["fontSize"] != nil ? (RCTConvert.cgFloat(opts["fontSize"]) * scale) : (14.0 * scale)
33+
let fontSize = opts["fontSize"] != nil ? RCTConvert.cgFloat(opts["fontSize"]) : 14.0
3534
self.font = UIFont(name: opts["fontName"] as? String ?? "", size: fontSize)
3635
if self.font == nil {
3736
self.font = UIFont.systemFont(ofSize: fontSize)

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-native-image-marker",
3-
"version": "1.1.13",
3+
"version": "1.1.14",
44
"description": "Add text or icon watermark to your images",
55
"main": "lib/commonjs/index",
66
"module": "lib/module/index",

src/index.ts

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -376,7 +376,7 @@ export interface TextBackgroundStyle extends Padding {
376376
* @example
377377
* type: TextBackgroundType.stretchX
378378
**/
379-
type: TextBackgroundType | null;
379+
type?: TextBackgroundType | null;
380380
/**
381381
* @description background color
382382
* @example
@@ -452,6 +452,7 @@ export interface TextOptions {
452452
**/
453453
text: string;
454454
/**
455+
* @deprecated since 1.2.4 use position instead
455456
* @description text position options
456457
* @example
457458
* positionOptions: {
@@ -462,6 +463,19 @@ export interface TextOptions {
462463
* }
463464
*/
464465
positionOptions?: PositionOptions;
466+
467+
/**
468+
* @description text position options
469+
* @example
470+
* positionOptions: {
471+
* X: 10,
472+
* Y: 10,
473+
* // or
474+
* // position: Position.center
475+
* }
476+
*/
477+
position?: PositionOptions;
478+
465479
/**
466480
* @description text style
467481
* @example
@@ -922,6 +936,11 @@ class Marker {
922936
};
923937
}
924938

939+
options.watermarkTexts.forEach((item) => {
940+
item.position = item.position || item.positionOptions;
941+
delete item.positionOptions;
942+
});
943+
925944
options.backgroundImage.src = srcObj;
926945
// let mShadowStyle = shadowStyle || {};
927946
// let mTextBackgroundStyle = textBackgroundStyle || {};

0 commit comments

Comments
 (0)