Skip to content

Commit bb11ed9

Browse files
wcandillonwcandillon
authored
fix(📏): fix substancial bug in onSize property (#3351)
1 parent 720fc99 commit bb11ed9

File tree

16 files changed

+131
-96
lines changed

16 files changed

+131
-96
lines changed

‎apps/example/android/gradle/wrapper/gradle-wrapper.properties‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
distributionBase=GRADLE_USER_HOME
22
distributionPath=wrapper/dists
3-
distributionUrl=https\://services.gradle.org/distributions/gradle-8.11.1-bin.zip
3+
distributionUrl=https\://services.gradle.org/distributions/gradle-8.12-bin.zip
44
networkTimeout=10000
55
validateDistributionUrl=true
66
zipStoreBase=GRADLE_USER_HOME

‎apps/example/src/Examples/API/List.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,10 @@ export const examples = [
106106
screen: "OnLayout",
107107
title: "🎛️ OnLayout",
108108
},
109+
{
110+
screen: "OnSize",
111+
title: "📏 OnSize",
112+
},
109113
] as const;
110114

111115
const styles = StyleSheet.create({
@@ -132,7 +136,9 @@ export const List = () => {
132136
<Pressable
133137
key={thumbnail.screen}
134138
onPress={() => {
135-
navigate(thumbnail.screen);
139+
// here the examples tuple is too big
140+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
141+
navigate(thumbnail.screen as any);
136142
}}
137143
testID={thumbnail.screen}
138144
>

‎apps/example/src/Examples/API/OnSize.tsx‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { Canvas, Rect, rect } from "@shopify/react-native-skia";
2+
import React from "react";
3+
import { View, StyleSheet } from "react-native";
4+
import { TextInput } from "react-native-gesture-handler";
5+
import { useDerivedValue, useSharedValue } from "react-native-reanimated";
6+
7+
export const OnSize = () => {
8+
const size = useSharedValue({ width: 0, height: 0 });
9+
const redRect = useDerivedValue(() => {
10+
return rect(0, 0, size.value.width, size.value.height);
11+
});
12+
13+
return (
14+
<View
15+
style={{
16+
alignSelf: "flex-start",
17+
backgroundColor: "cyan",
18+
}}
19+
>
20+
<Canvas onSize={size} style={StyleSheet.absoluteFill}>
21+
<Rect rect={redRect} color="red" />
22+
</Canvas>
23+
<TextInput
24+
placeholder={`
25+
Hello
26+
World!
27+
`}
28+
multiline
29+
/>
30+
</View>
31+
);
32+
};

‎apps/example/src/Examples/API/Routes.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ export type Routes = {
2020
UseCanvas: undefined;
2121
PictureView: undefined;
2222
OnLayout: undefined;
23+
OnSize: undefined;
2324
Snapshot: undefined;
2425
IconsExample: undefined;
2526
Paragraphs: undefined;

‎apps/example/src/Examples/API/index.tsx‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import { FreezeExample } from "./Freeze";
2121
import { Touch } from "./Touch";
2222
import { PictureViewExample } from "./PictureView";
2323
import { OnLayoutDemo } from "./OnLayout";
24+
import { OnSize } from "./OnSize";
2425
import { Snapshot } from "./Snapshot";
2526
import { IconsExample } from "./Icons";
2627
import { FontMgr } from "./FontMgr";
@@ -216,6 +217,13 @@ export const API = () => {
216217
title: "🎛️ OnLayout",
217218
}}
218219
/>
220+
<Stack.Screen
221+
name="OnSize"
222+
component={OnSize}
223+
options={{
224+
title: "📏 OnSize",
225+
}}
226+
/>
219227
</Stack.Navigator>
220228
);
221229
};

‎packages/skia/cpp/api/JsiSkParagraph.h‎

Lines changed: 24 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -95,46 +95,47 @@ class JsiSkParagraph
9595
std::vector<para::LineMetrics> metrics;
9696
getObject()->getLineMetrics(metrics);
9797
auto returnValue = jsi::Array(runtime, metrics.size());
98-
98+
9999
for (size_t i = 0; i < metrics.size(); ++i) {
100100
auto lineMetrics = jsi::Object(runtime);
101-
101+
102102
// Text indices
103-
lineMetrics.setProperty(runtime, "startIndex",
103+
lineMetrics.setProperty(runtime, "startIndex",
104104
static_cast<double>(metrics[i].fStartIndex));
105-
lineMetrics.setProperty(runtime, "endIndex",
105+
lineMetrics.setProperty(runtime, "endIndex",
106106
static_cast<double>(metrics[i].fEndIndex));
107-
lineMetrics.setProperty(runtime, "endExcludingWhitespaces",
108-
static_cast<double>(metrics[i].fEndExcludingWhitespaces));
109-
lineMetrics.setProperty(runtime, "endIncludingNewline",
110-
static_cast<double>(metrics[i].fEndIncludingNewline));
111-
107+
lineMetrics.setProperty(
108+
runtime, "endExcludingWhitespaces",
109+
static_cast<double>(metrics[i].fEndExcludingWhitespaces));
110+
lineMetrics.setProperty(
111+
runtime, "endIncludingNewline",
112+
static_cast<double>(metrics[i].fEndIncludingNewline));
113+
112114
// Line break info
113-
lineMetrics.setProperty(runtime, "isHardBreak",
114-
metrics[i].fHardBreak);
115-
115+
lineMetrics.setProperty(runtime, "isHardBreak", metrics[i].fHardBreak);
116+
116117
// Vertical metrics
117-
lineMetrics.setProperty(runtime, "ascent",
118+
lineMetrics.setProperty(runtime, "ascent",
118119
static_cast<double>(metrics[i].fAscent));
119-
lineMetrics.setProperty(runtime, "descent",
120+
lineMetrics.setProperty(runtime, "descent",
120121
static_cast<double>(metrics[i].fDescent));
121-
lineMetrics.setProperty(runtime, "height",
122+
lineMetrics.setProperty(runtime, "height",
122123
static_cast<double>(metrics[i].fHeight));
123-
124+
124125
// Horizontal metrics
125-
lineMetrics.setProperty(runtime, "width",
126+
lineMetrics.setProperty(runtime, "width",
126127
static_cast<double>(metrics[i].fWidth));
127-
lineMetrics.setProperty(runtime, "left",
128+
lineMetrics.setProperty(runtime, "left",
128129
static_cast<double>(metrics[i].fLeft));
129-
130+
130131
// Position
131-
lineMetrics.setProperty(runtime, "baseline",
132+
lineMetrics.setProperty(runtime, "baseline",
132133
static_cast<double>(metrics[i].fBaseline));
133-
134+
134135
// Line number
135-
lineMetrics.setProperty(runtime, "lineNumber",
136+
lineMetrics.setProperty(runtime, "lineNumber",
136137
static_cast<double>(metrics[i].fLineNumber));
137-
138+
138139
returnValue.setValueAtIndex(runtime, i, lineMetrics);
139140
}
140141
return returnValue;

‎packages/skia/cpp/api/recorder/DrawingCtx.h‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -122,15 +122,15 @@ class DrawingCtx {
122122
std::vector<sk_sp<SkShader>> popShaders(int count) {
123123
std::vector<sk_sp<SkShader>> result;
124124
int actualCount = std::min(count, static_cast<int>(shaders.size()));
125-
125+
126126
if (actualCount > 0) {
127127
// Get the last 'actualCount' shaders
128128
auto start = shaders.end() - actualCount;
129129
result.assign(start, shaders.end());
130130
// Remove them from the original vector
131131
shaders.erase(start, shaders.end());
132132
}
133-
133+
134134
return result;
135135
}
136136

‎packages/skia/cpp/api/recorder/JsiRecorder.h‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -119,10 +119,9 @@ class JsiRecorder : public JsiSkWrappingSharedPtrHostObject<Recorder> {
119119
}
120120

121121
JSI_HOST_FUNCTION(pushShader) {
122-
getObject()->pushShader(runtime,
123-
arguments[0].asString(runtime).utf8(runtime),
124-
arguments[1].asObject(runtime),
125-
arguments[2].asNumber());
122+
getObject()->pushShader(
123+
runtime, arguments[0].asString(runtime).utf8(runtime),
124+
arguments[1].asObject(runtime), arguments[2].asNumber());
126125
return jsi::Value::undefined();
127126
}
128127

‎packages/skia/cpp/api/recorder/Shaders.h‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,8 +41,9 @@ class PushShaderCmd : public Command {
4141
auto uniformsData = processUniforms(source, props.uniforms);
4242

4343
std::vector<sk_sp<SkShader>> childrenShaders = ctx->popShaders(children);
44-
auto shader = source->makeShader(std::move(uniformsData), childrenShaders.data(),
45-
childrenShaders.size(), &m3);
44+
auto shader =
45+
source->makeShader(std::move(uniformsData), childrenShaders.data(),
46+
childrenShaders.size(), &m3);
4647

4748
ctx->shaders.push_back(shader);
4849
}

‎packages/skia/cpp/rnskia/RNSkJsiViewApi.h‎

Lines changed: 19 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616
#include <jsi/jsi.h>
1717

1818
namespace RNSkia {
19+
1920
namespace jsi = facebook::jsi;
2021

2122
using RNSkViewInfo = struct RNSkViewInfo {
@@ -100,16 +101,24 @@ class RNSkJsiViewApi : public RNJsi::JsiHostObject,
100101
// Safely execute operations while holding the registry lock
101102
ViewRegistry::getInstance().withViewInfo(
102103
nativeId, [&](std::shared_ptr<RNSkViewInfo> info) {
103-
info->props.insert_or_assign(
104-
arguments[1].asString(runtime).utf8(runtime),
105-
RNJsi::ViewProperty(runtime, arguments[2]));
106-
107-
// Now let's see if we have a view that we can update
108-
if (info->view != nullptr) {
109-
// Update view!
110-
info->view->setNativeId(nativeId);
111-
info->view->setJsiProperties(info->props);
112-
info->props.clear();
104+
auto name = arguments[1].asString(runtime).utf8(runtime);
105+
if (name == "onSize" && isSharedValue(runtime, arguments[2])) {
106+
jsi::Object size(runtime);
107+
size.setProperty(runtime, "width", info->view->getScaledWidth());
108+
size.setProperty(runtime, "height", info->view->getScaledHeight());
109+
arguments[2].asObject(runtime).setProperty(runtime, "value", size);
110+
} else {
111+
info->props.insert_or_assign(
112+
arguments[1].asString(runtime).utf8(runtime),
113+
RNJsi::ViewProperty(runtime, arguments[2]));
114+
115+
// Now let's see if we have a view that we can update
116+
if (info->view != nullptr) {
117+
// Update view!
118+
info->view->setNativeId(nativeId);
119+
info->view->setJsiProperties(info->props);
120+
info->props.clear();
121+
}
113122
}
114123
return nullptr; // Return type for template deduction
115124
});

0 commit comments

Comments
 (0)