search

react-native-oh-library / react-native-harmony-svg

SVG library for React Native OpenHarmony.
6 stars 29 forks source link

SVG参数无法使用数字 #252

Closed carverhong closed 2 months ago

carverhong commented 2 months ago

参数使用number时无法展示

<Svg width={300} height="265">
    <Rect width={300} height="265" fill="#123456" rx="0" />
</Svg>

使用string则正常展示

<Svg width="300" height="265">
    <Rect width="300" height="265" fill="#123456" rx="0" />
</Svg>

参数类型应该要支持string和number

Louis-C7 commented 2 months ago

参数使用number时无法展示

<Svg width={300} height="265">
    <Rect width={300} height="265" fill="#123456" rx="0" />
</Svg>

使用string则正常展示

<Svg width="300" height="265">
    <Rect width="300" height="265" fill="#123456" rx="0" />
</Svg>

参数类型应该要支持string和number

请提供您使用的@react-native-oh-tpl/react-native-svg版本信息，我们这边无法复现这个问题。

carverhong commented 2 months ago

企业微信截图_de351f36-0b18-48fe-ba2f-3eb0a1c6987c

这个是使用数字参数无法展示的截图，浅蓝色是用react-devtools选中Rect标签时的效果，不是实际展示的颜色。选中标签时看到元素有大小，但实际展示是空白。

企业微信截图_a6cb94cf-d5a8-4bf0-b9f8-13f60d0725ce

这个是使用字符串参数可以正常展示的截图。

版本信息：react-native-oh-tpl-react-native-svg-15.0.0-0.5.1

carverhong commented 2 months ago

这个是使用数字参数的log

07-01 09:54:29.568   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.569   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.584   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.584   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.584   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.600   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.600   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.600   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.600   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.615   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.615   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.616   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.616   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.616   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.617   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.617   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.631   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.632   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.632   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.633   18792-18917  A0BEEF/#RNOH_CPP               com.demo.localdemo    E     __█ propsConversions.h:139> Error while converting prop 'x': TypeError: expected dynamic type `string', but had type `double'
07-01 09:54:29.633   18792-18917  A0BEEF/#RNOH_CPP               com.demo.localdemo    E     __█ propsConversions.h:139> Error while converting prop 'y': TypeError: expected dynamic type `string', but had type `double'
07-01 09:54:29.633   18792-18917  A0BEEF/#RNOH_CPP               com.demo.localdemo    E     __█ propsConversions.h:139> Error while converting prop 'width': TypeError: expected dynamic type `string', but had type `double'
07-01 09:54:29.635   18792-18917  A0BEEF/#RNOH_CPP               com.demo.localdemo    E     __█ propsConversions.h:139> Error while converting prop 'bbWidth': TypeError: expected dynamic type `string', but had type `double'
07-01 09:54:29.649   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RNSVGRect
07-01 09:54:29.650   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RNSVGGroup
07-01 09:54:29.650   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RNSVGSvgView
07-01 09:54:29.653   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.653   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.653   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.653   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.653   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.653   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SVGPackage.h:61> [SVGPackageComponentInstanceFactoryDelegate] create componentName= RawText
07-01 09:54:29.675   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    W     █__ conversions.h:252> Invalid ImportantForAutofill
07-01 09:54:29.675   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    W     █__ conversions.h:252> Invalid ImportantForAutofill
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:16> [SVG] <SVGViewComponentInstance> props->width: 300
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:17> [SVG] <SVGViewComponentInstance> props->height: 264.923
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:18> [SVG] <SVGViewComponentInstance> props->bbHeight: 265
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:19> [SVG] <SVGViewComponentInstance> props->bbWidth:
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:20> [SVG] <SVGViewComponentInstance> props->bbHeight: 265
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:21> [SVG] <SVGViewComponentInstance> props->minX: 0
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:22> [SVG] <SVGViewComponentInstance> props->minY: 0
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:23> [SVG] <SVGViewComponentInstance> props->vbWidth: 0
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:24> [SVG] <SVGViewComponentInstance> props->vbHeight: 0
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:25> [SVG] <SVGViewComponentInstance> props->align:
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:26> [SVG] <SVGViewComponentInstance> props->meetOrSlice: 0
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:27> [SVG] <SVGViewComponentInstance> props->testId:
07-01 09:54:29.678   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGSvgViewComponentInstance.cpp:28> [SVG] <SVGViewComponentInstance> props->pointScaleFactor: 3.25
07-01 09:54:29.680   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGGroupComponentInstance.cpp:13> [RNSVGGroupComponentInstance] props->fill.payload: 4278190080
07-01 09:54:29.680   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGRectComponentInstance.cpp:13> [RNSVGRectComponentInstance] Props->fill.payload: 4279383126
07-01 09:54:29.680   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGRectComponentInstance.cpp:14> [RNSVGRectComponentInstance] Props->stroke.payload: 2147483647
07-01 09:54:29.680   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGRectComponentInstance.cpp:15> [RNSVGRectComponentInstance] Props->stroke.payload meaningful: 0
07-01 09:54:29.680   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGRectComponentInstance.cpp:17> [RNSVGRectComponentInstance] Props->stroke.type: 0
07-01 09:54:29.680   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGRectComponentInstance.cpp:18> [RNSVGRectComponentInstance] Props->stroke.brushRef:
07-01 09:54:29.680   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGRectComponentInstance.cpp:19> [RNSVGRectComponentInstance] Props->strokeWidth: 1
07-01 09:54:29.680   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGRectComponentInstance.cpp:20> [RNSVGRectComponentInstance] Props->propList size: 1
07-01 09:54:29.680   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ RNSVGRectComponentInstance.cpp:22> [RNSVGRectComponentInstance] Props->propList: fill
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgArkUINode.cpp:53> [svg] <SVGArkUINode> CanvasGetHeight: 861
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgArkUINode.cpp:54> [svg] <SVGArkUINode> CanvasGetWidth: 975
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgPaintState.h:297> hasLineWIdth = 0 to inherit : 1
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgPaintState.h:297> hasLineWIdth = 0 to inherit : 1
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgPaintState.h:297> hasLineWIdth = 0 to inherit : 1
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:66> [svgView] bbHeight: 265
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:67> [svgView] bbWidth: 265
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:68> [svgView] svg Height: 861
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:69> [svgView] svg Width: 975
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:70> [svgView] canvas Height: 861
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:71> [svgView] canvas Width: 975
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:44> [FitCanvas] viewBox = Rect (0.00, 0.00) - [0.00 x 0.00] svgSize = [975.00 x 861.00] canvas = 975, 861
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgGraphic.cpp:36> [SVGGraphic] onDraw marker =
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgGraphic.cpp:429> [svg] strokeState.GetLineCap(): 0
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgGraphic.cpp:437> [svg] strokeState.GetLineJoin(): 0
07-01 09:54:29.695   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgGraphic.cpp:445> [SvgRect] OH_Drawing_PenSetWidth: 1
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgArkUINode.cpp:53> [svg] <SVGArkUINode> CanvasGetHeight: 861
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgArkUINode.cpp:54> [svg] <SVGArkUINode> CanvasGetWidth: 975
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgPaintState.h:297> hasLineWIdth = 0 to inherit : 1
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgPaintState.h:297> hasLineWIdth = 0 to inherit : 1
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgPaintState.h:297> hasLineWIdth = 0 to inherit : 1
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:66> [svgView] bbHeight: 265
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:67> [svgView] bbWidth: 265
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:68> [svgView] svg Height: 861
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:69> [svgView] svg Width: 975
07-01 09:54:29.797   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:70> [svgView] canvas Height: 861
07-01 09:54:29.798   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:71> [svgView] canvas Width: 975
07-01 09:54:29.798   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgSvg.cpp:44> [FitCanvas] viewBox = Rect (0.00, 0.00) - [0.00 x 0.00] svgSize = [975.00 x 861.00] canvas = 975, 861
07-01 09:54:29.798   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgGraphic.cpp:36> [SVGGraphic] onDraw marker =
07-01 09:54:29.798   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgGraphic.cpp:429> [svg] strokeState.GetLineCap(): 0
07-01 09:54:29.798   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgGraphic.cpp:437> [svg] strokeState.GetLineJoin(): 0
07-01 09:54:29.798   18792-18792  A0BEEF/#RNOH_CPP               com.demo.localdemo    I     █__ SvgGraphic.cpp:445> [SvgRect] OH_Drawing_PenSetWidth: 1
Louis-C7 commented 2 months ago

企业微信截图_de351f36-0b18-48fe-ba2f-3eb0a1c6987c

这个是使用数字参数无法展示的截图，浅蓝色是用react-devtools选中Rect标签时的效果，不是实际展示的颜色。选中标签时看到元素有大小，但实际展示是空白。

企业微信截图_a6cb94cf-d5a8-4bf0-b9f8-13f60d0725ce

这个是使用字符串参数可以正常展示的截图。

版本信息：react-native-oh-tpl-react-native-svg-15.0.0-0.5.1

请确保已经安装react-native-svg@15.0.0，因为支持数字和字符串输入是在该库的JS代码中实现，我们沿用了原库这部分的代码，没有修改。目前还是没法复现，该功能一直都是支持的。请提供更多的信息，例如react-native-harmony版本等。

image
carverhong commented 2 months ago

企业微信截图_de351f36-0b18-48fe-ba2f-3eb0a1c6987c 这个是使用数字参数无法展示的截图，浅蓝色是用react-devtools选中Rect标签时的效果，不是实际展示的颜色。选中标签时看到元素有大小，但实际展示是空白。 企业微信截图_a6cb94cf-d5a8-4bf0-b9f8-13f60d0725ce 这个是使用字符串参数可以正常展示的截图。 版本信息：react-native-oh-tpl-react-native-svg-15.0.0-0.5.1

请确保已经安装react-native-svg@15.0.0，因为支持数字和字符串输入是在该库的JS代码中实现，我们沿用了原库这部分的代码，没有修改。目前还是没法复现，该功能一直都是支持的。请提供更多的信息，例如react-native-harmony版本等。 image

已确认是react-native-svg的版本问题，15.1.0移除了参数转成字符串的实现，切换到15.0.0解决该问题，感谢帮助

Louis-C7 commented 2 months ago

企业微信截图_de351f36-0b18-48fe-ba2f-3eb0a1c6987c 这个是使用数字参数无法展示的截图，浅蓝色是用react-devtools选中Rect标签时的效果，不是实际展示的颜色。选中标签时看到元素有大小，但实际展示是空白。 企业微信截图_a6cb94cf-d5a8-4bf0-b9f8-13f60d0725ce 这个是使用字符串参数可以正常展示的截图。 版本信息：react-native-oh-tpl-react-native-svg-15.0.0-0.5.1

请确保已经安装react-native-svg@15.0.0，因为支持数字和字符串输入是在该库的JS代码中实现，我们沿用了原库这部分的代码，没有修改。目前还是没法复现，该功能一直都是支持的。请提供更多的信息，例如react-native-harmony版本等。 image

已确认是react-native-svg的版本问题，15.1.0移除了参数转成字符串的实现，切换到15.0.0解决该问题，感谢帮助

感谢反馈，react-native-svg@15.1.0对数据传递到原生侧的部分有比较大的更新，这块更新暂时还没有跟进。