zoriya/react-native-svg
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-svg.git synced 2025-12-06 07:06:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: FeComposite filter (#2433)

Browse Source 
# Summary

<img width="324" alt="image"
src="https://github.com/user-attachments/assets/0a9b4a56-d093-49f7-aacd-c198ee00f256">

## Test Plan

Examples app -> Filters -> FeComposite

## Compatibility

| OS      | Implemented |
| ------- | :---------: |
| iOS     |    ✅      |
| macOS   |    ❌*      |
| Android |    ✅      |
| Web     |    ✅      |

_*_ macOS isn't working as:
* `CGBitmapContextCreateImage` always returns null
* FeFlood isn't aligned properly (will be fixed in the following PR)
This commit is contained in:
Jakub Grzywacz
2024-10-25 11:18:07 +02:00
committed by GitHub
parent 525d09ef34
commit 4637dee1e4
51 changed files with 1372 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apple/Utils/RCTConvert+RNSVG.h
View File

@@ -13,6 +13,7 @@
#import "RNSVGBlendMode.h"
#import "RNSVGCGFCRule.h"
#import "RNSVGColorMatrixType.h"
#import "RNSVGCompositeOperator.h"
#import "RNSVGEdgeMode.h"
#import "RNSVGLength.h"
#import "RNSVGMaskType.h"

13
apple/Utils/RCTConvert+RNSVG.mm
View File

@@ -85,6 +85,19 @@ RCT_ENUM_CONVERTER(
SVG_FEBLEND_MODE_UNKNOWN,
intValue)
RCT_ENUM_CONVERTER(
RNSVGCompositeOperator,
(@{
@"over" : @(SVG_FECOMPOSITE_OPERATOR_OVER),
@"in" : @(SVG_FECOMPOSITE_OPERATOR_IN),
@"out" : @(SVG_FECOMPOSITE_OPERATOR_OUT),
@"atop" : @(SVG_FECOMPOSITE_OPERATOR_ATOP),
@"xor" : @(SVG_FECOMPOSITE_OPERATOR_XOR),
@"arithmetic" : @(SVG_FECOMPOSITE_OPERATOR_ARITHMETIC),
}),
SVG_FECOMPOSITE_OPERATOR_UNKNOWN,
intValue)
+ (RNSVGBrush *)RNSVGBrush:(id)json
{
if ([json isKindOfClass:[NSNumber class]]) {

2
apple/Utils/RNSVGConvert.h
View File

@@ -2,6 +2,7 @@
#import <react/renderer/components/rnsvg/Props.h>
#import "RNSVGBlendMode.h"
#import "RNSVGColorMatrixType.h"
#import "RNSVGCompositeOperator.h"
#import "RNSVGEdgeMode.h"
#import "RNSVGUnits.h"
@@ -13,6 +14,7 @@ namespace react = facebook::react;
+ (RNSVGUnits)RNSVGUnitsFromPrimitiveUnitsCppEquivalent:(react::RNSVGFilterPrimitiveUnits)svgUnits;
+ (RNSVGBlendMode)RNSVGBlendModeFromCppEquivalent:(react::RNSVGFeBlendMode)mode;
+ (RNSVGColorMatrixType)RNSVGColorMatrixTypeFromCppEquivalent:(react::RNSVGFeColorMatrixType)type;
+ (RNSVGCompositeOperator)RNSVGRNSVGCompositeOperatorFromCppEquivalent:(react::RNSVGFeCompositeOperator1)operator1;
+ (RNSVGEdgeMode)RNSVGEdgeModeFromCppEquivalent:(react::RNSVGFeGaussianBlurEdgeMode)edgeMode;
@end

18
apple/Utils/RNSVGConvert.mm
View File

@@ -55,6 +55,24 @@
}
}
+ (RNSVGCompositeOperator)RNSVGRNSVGCompositeOperatorFromCppEquivalent:(react::RNSVGFeCompositeOperator1)operator1
{
switch (operator1) {
case react::RNSVGFeCompositeOperator1::Over:
return SVG_FECOMPOSITE_OPERATOR_OVER;
case react::RNSVGFeCompositeOperator1::In:
return SVG_FECOMPOSITE_OPERATOR_IN;
case react::RNSVGFeCompositeOperator1::Out:
return SVG_FECOMPOSITE_OPERATOR_OUT;
case react::RNSVGFeCompositeOperator1::Atop:
return SVG_FECOMPOSITE_OPERATOR_ATOP;
case react::RNSVGFeCompositeOperator1::Xor:
return SVG_FECOMPOSITE_OPERATOR_XOR;
case react::RNSVGFeCompositeOperator1::Arithmetic:
return SVG_FECOMPOSITE_OPERATOR_ARITHMETIC;
}
}
+ (RNSVGEdgeMode)RNSVGEdgeModeFromCppEquivalent:(react::RNSVGFeGaussianBlurEdgeMode)edgeMode
{
switch (edgeMode) {