Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: improve animating colors #2471

Merged
merged 5 commits into from
Oct 4, 2024
Merged

feat: improve animating colors #2471

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
292baa2
feat: change color props (fill/stroke) to ColorValue | ColorStruct
jakex7 Oct 2, 2024
992a06e
feat: extract brush on setNativeProps
jakex7 Oct 2, 2024
9384cc5
feat: use RCTConvert RNSVGBrush instead of brushFromColorStruct
jakex7 Oct 2, 2024
f28f1da
chore: update fill types
jakex7 Oct 2, 2024
0732041
test: add example/test case
jakex7 Oct 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGCircleManagerDelegate.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
import com.facebook.react.bridge.ColorPropConverter;
import com.facebook.react.bridge.DynamicFromObject;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.uimanager.BaseViewManagerDelegate;
import com.facebook.react.uimanager.BaseViewManagerInterface;

Expand Down Expand Up @@ -65,7 +64,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setColor(view, ColorPropConverter.getColor(value, view.getContext()));
break;
case "fill":
mViewManager.setFill(view, (ReadableMap) value);
mViewManager.setFill(view, new DynamicFromObject(value));
break;
case "fillOpacity":
mViewManager.setFillOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand All @@ -74,7 +73,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setFillRule(view, value == null ? 1 : ((Double) value).intValue());
break;
case "stroke":
mViewManager.setStroke(view, (ReadableMap) value);
mViewManager.setStroke(view, new DynamicFromObject(value));
break;
case "strokeOpacity":
mViewManager.setStrokeOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGCircleManagerInterface.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
import androidx.annotation.Nullable;
import com.facebook.react.bridge.Dynamic;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;

public interface RNSVGCircleManagerInterface<T extends View> {
void setName(T view, @Nullable String value);
Expand All @@ -29,10 +28,10 @@ public interface RNSVGCircleManagerInterface<T extends View> {
void setDisplay(T view, @Nullable String value);
void setPointerEvents(T view, @Nullable String value);
void setColor(T view, @Nullable Integer value);
void setFill(T view, @Nullable ReadableMap value);
void setFill(T view, Dynamic value);
void setFillOpacity(T view, float value);
void setFillRule(T view, int value);
void setStroke(T view, @Nullable ReadableMap value);
void setStroke(T view, Dynamic value);
void setStrokeOpacity(T view, float value);
void setStrokeWidth(T view, Dynamic value);
void setStrokeLinecap(T view, int value);
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGClipPathManagerDelegate.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
import com.facebook.react.bridge.ColorPropConverter;
import com.facebook.react.bridge.DynamicFromObject;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.uimanager.BaseViewManagerDelegate;
import com.facebook.react.uimanager.BaseViewManagerInterface;

Expand Down Expand Up @@ -65,7 +64,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setColor(view, ColorPropConverter.getColor(value, view.getContext()));
break;
case "fill":
mViewManager.setFill(view, (ReadableMap) value);
mViewManager.setFill(view, new DynamicFromObject(value));
break;
case "fillOpacity":
mViewManager.setFillOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand All @@ -74,7 +73,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setFillRule(view, value == null ? 1 : ((Double) value).intValue());
break;
case "stroke":
mViewManager.setStroke(view, (ReadableMap) value);
mViewManager.setStroke(view, new DynamicFromObject(value));
break;
case "strokeOpacity":
mViewManager.setStrokeOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGClipPathManagerInterface.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
import androidx.annotation.Nullable;
import com.facebook.react.bridge.Dynamic;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;

public interface RNSVGClipPathManagerInterface<T extends View> {
void setName(T view, @Nullable String value);
Expand All @@ -29,10 +28,10 @@ public interface RNSVGClipPathManagerInterface<T extends View> {
void setDisplay(T view, @Nullable String value);
void setPointerEvents(T view, @Nullable String value);
void setColor(T view, @Nullable Integer value);
void setFill(T view, @Nullable ReadableMap value);
void setFill(T view, Dynamic value);
void setFillOpacity(T view, float value);
void setFillRule(T view, int value);
void setStroke(T view, @Nullable ReadableMap value);
void setStroke(T view, Dynamic value);
void setStrokeOpacity(T view, float value);
void setStrokeWidth(T view, Dynamic value);
void setStrokeLinecap(T view, int value);
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGEllipseManagerDelegate.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
import com.facebook.react.bridge.ColorPropConverter;
import com.facebook.react.bridge.DynamicFromObject;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.uimanager.BaseViewManagerDelegate;
import com.facebook.react.uimanager.BaseViewManagerInterface;

Expand Down Expand Up @@ -65,7 +64,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setColor(view, ColorPropConverter.getColor(value, view.getContext()));
break;
case "fill":
mViewManager.setFill(view, (ReadableMap) value);
mViewManager.setFill(view, new DynamicFromObject(value));
break;
case "fillOpacity":
mViewManager.setFillOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand All @@ -74,7 +73,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setFillRule(view, value == null ? 1 : ((Double) value).intValue());
break;
case "stroke":
mViewManager.setStroke(view, (ReadableMap) value);
mViewManager.setStroke(view, new DynamicFromObject(value));
break;
case "strokeOpacity":
mViewManager.setStrokeOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGEllipseManagerInterface.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
import androidx.annotation.Nullable;
import com.facebook.react.bridge.Dynamic;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;

public interface RNSVGEllipseManagerInterface<T extends View> {
void setName(T view, @Nullable String value);
Expand All @@ -29,10 +28,10 @@ public interface RNSVGEllipseManagerInterface<T extends View> {
void setDisplay(T view, @Nullable String value);
void setPointerEvents(T view, @Nullable String value);
void setColor(T view, @Nullable Integer value);
void setFill(T view, @Nullable ReadableMap value);
void setFill(T view, Dynamic value);
void setFillOpacity(T view, float value);
void setFillRule(T view, int value);
void setStroke(T view, @Nullable ReadableMap value);
void setStroke(T view, Dynamic value);
void setStrokeOpacity(T view, float value);
void setStrokeWidth(T view, Dynamic value);
void setStrokeLinecap(T view, int value);
Expand Down
5 changes: 2 additions & 3 deletions ...oid/src/paper/java/com/facebook/react/viewmanagers/RNSVGForeignObjectManagerDelegate.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
import com.facebook.react.bridge.ColorPropConverter;
import com.facebook.react.bridge.DynamicFromObject;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.uimanager.BaseViewManagerDelegate;
import com.facebook.react.uimanager.BaseViewManagerInterface;

Expand Down Expand Up @@ -65,7 +64,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setColor(view, ColorPropConverter.getColor(value, view.getContext()));
break;
case "fill":
mViewManager.setFill(view, (ReadableMap) value);
mViewManager.setFill(view, new DynamicFromObject(value));
break;
case "fillOpacity":
mViewManager.setFillOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand All @@ -74,7 +73,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setFillRule(view, value == null ? 1 : ((Double) value).intValue());
break;
case "stroke":
mViewManager.setStroke(view, (ReadableMap) value);
mViewManager.setStroke(view, new DynamicFromObject(value));
break;
case "strokeOpacity":
mViewManager.setStrokeOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand Down
5 changes: 2 additions & 3 deletions ...id/src/paper/java/com/facebook/react/viewmanagers/RNSVGForeignObjectManagerInterface.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
import androidx.annotation.Nullable;
import com.facebook.react.bridge.Dynamic;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;

public interface RNSVGForeignObjectManagerInterface<T extends View> {
void setName(T view, @Nullable String value);
Expand All @@ -29,10 +28,10 @@ public interface RNSVGForeignObjectManagerInterface<T extends View> {
void setDisplay(T view, @Nullable String value);
void setPointerEvents(T view, @Nullable String value);
void setColor(T view, @Nullable Integer value);
void setFill(T view, @Nullable ReadableMap value);
void setFill(T view, Dynamic value);
void setFillOpacity(T view, float value);
void setFillRule(T view, int value);
void setStroke(T view, @Nullable ReadableMap value);
void setStroke(T view, Dynamic value);
void setStrokeOpacity(T view, float value);
void setStrokeWidth(T view, Dynamic value);
void setStrokeLinecap(T view, int value);
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGGroupManagerDelegate.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
import com.facebook.react.bridge.ColorPropConverter;
import com.facebook.react.bridge.DynamicFromObject;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.uimanager.BaseViewManagerDelegate;
import com.facebook.react.uimanager.BaseViewManagerInterface;

Expand Down Expand Up @@ -65,7 +64,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setColor(view, ColorPropConverter.getColor(value, view.getContext()));
break;
case "fill":
mViewManager.setFill(view, (ReadableMap) value);
mViewManager.setFill(view, new DynamicFromObject(value));
break;
case "fillOpacity":
mViewManager.setFillOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand All @@ -74,7 +73,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setFillRule(view, value == null ? 1 : ((Double) value).intValue());
break;
case "stroke":
mViewManager.setStroke(view, (ReadableMap) value);
mViewManager.setStroke(view, new DynamicFromObject(value));
break;
case "strokeOpacity":
mViewManager.setStrokeOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGGroupManagerInterface.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
import androidx.annotation.Nullable;
import com.facebook.react.bridge.Dynamic;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;

public interface RNSVGGroupManagerInterface<T extends View> {
void setName(T view, @Nullable String value);
Expand All @@ -29,10 +28,10 @@ public interface RNSVGGroupManagerInterface<T extends View> {
void setDisplay(T view, @Nullable String value);
void setPointerEvents(T view, @Nullable String value);
void setColor(T view, @Nullable Integer value);
void setFill(T view, @Nullable ReadableMap value);
void setFill(T view, Dynamic value);
void setFillOpacity(T view, float value);
void setFillRule(T view, int value);
void setStroke(T view, @Nullable ReadableMap value);
void setStroke(T view, Dynamic value);
void setStrokeOpacity(T view, float value);
void setStrokeWidth(T view, Dynamic value);
void setStrokeLinecap(T view, int value);
Expand Down
4 changes: 2 additions & 2 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGImageManagerDelegate.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setColor(view, ColorPropConverter.getColor(value, view.getContext()));
break;
case "fill":
mViewManager.setFill(view, (ReadableMap) value);
mViewManager.setFill(view, new DynamicFromObject(value));
break;
case "fillOpacity":
mViewManager.setFillOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand All @@ -74,7 +74,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setFillRule(view, value == null ? 1 : ((Double) value).intValue());
break;
case "stroke":
mViewManager.setStroke(view, (ReadableMap) value);
mViewManager.setStroke(view, new DynamicFromObject(value));
break;
case "strokeOpacity":
mViewManager.setStrokeOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand Down
4 changes: 2 additions & 2 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGImageManagerInterface.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,10 +29,10 @@ public interface RNSVGImageManagerInterface<T extends View> {
void setDisplay(T view, @Nullable String value);
void setPointerEvents(T view, @Nullable String value);
void setColor(T view, @Nullable Integer value);
void setFill(T view, @Nullable ReadableMap value);
void setFill(T view, Dynamic value);
void setFillOpacity(T view, float value);
void setFillRule(T view, int value);
void setStroke(T view, @Nullable ReadableMap value);
void setStroke(T view, Dynamic value);
void setStrokeOpacity(T view, float value);
void setStrokeWidth(T view, Dynamic value);
void setStrokeLinecap(T view, int value);
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGLineManagerDelegate.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
import com.facebook.react.bridge.ColorPropConverter;
import com.facebook.react.bridge.DynamicFromObject;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.uimanager.BaseViewManagerDelegate;
import com.facebook.react.uimanager.BaseViewManagerInterface;

Expand Down Expand Up @@ -65,7 +64,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setColor(view, ColorPropConverter.getColor(value, view.getContext()));
break;
case "fill":
mViewManager.setFill(view, (ReadableMap) value);
mViewManager.setFill(view, new DynamicFromObject(value));
break;
case "fillOpacity":
mViewManager.setFillOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand All @@ -74,7 +73,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setFillRule(view, value == null ? 1 : ((Double) value).intValue());
break;
case "stroke":
mViewManager.setStroke(view, (ReadableMap) value);
mViewManager.setStroke(view, new DynamicFromObject(value));
break;
case "strokeOpacity":
mViewManager.setStrokeOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGLineManagerInterface.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
import androidx.annotation.Nullable;
import com.facebook.react.bridge.Dynamic;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;

public interface RNSVGLineManagerInterface<T extends View> {
void setName(T view, @Nullable String value);
Expand All @@ -29,10 +28,10 @@ public interface RNSVGLineManagerInterface<T extends View> {
void setDisplay(T view, @Nullable String value);
void setPointerEvents(T view, @Nullable String value);
void setColor(T view, @Nullable Integer value);
void setFill(T view, @Nullable ReadableMap value);
void setFill(T view, Dynamic value);
void setFillOpacity(T view, float value);
void setFillRule(T view, int value);
void setStroke(T view, @Nullable ReadableMap value);
void setStroke(T view, Dynamic value);
void setStrokeOpacity(T view, float value);
void setStrokeWidth(T view, Dynamic value);
void setStrokeLinecap(T view, int value);
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGMarkerManagerDelegate.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
import com.facebook.react.bridge.ColorPropConverter;
import com.facebook.react.bridge.DynamicFromObject;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.uimanager.BaseViewManagerDelegate;
import com.facebook.react.uimanager.BaseViewManagerInterface;

Expand Down Expand Up @@ -65,7 +64,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setColor(view, ColorPropConverter.getColor(value, view.getContext()));
break;
case "fill":
mViewManager.setFill(view, (ReadableMap) value);
mViewManager.setFill(view, new DynamicFromObject(value));
break;
case "fillOpacity":
mViewManager.setFillOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand All @@ -74,7 +73,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setFillRule(view, value == null ? 1 : ((Double) value).intValue());
break;
case "stroke":
mViewManager.setStroke(view, (ReadableMap) value);
mViewManager.setStroke(view, new DynamicFromObject(value));
break;
case "strokeOpacity":
mViewManager.setStrokeOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGMarkerManagerInterface.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@
import androidx.annotation.Nullable;
import com.facebook.react.bridge.Dynamic;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;

public interface RNSVGMarkerManagerInterface<T extends View> {
void setName(T view, @Nullable String value);
Expand All @@ -29,10 +28,10 @@ public interface RNSVGMarkerManagerInterface<T extends View> {
void setDisplay(T view, @Nullable String value);
void setPointerEvents(T view, @Nullable String value);
void setColor(T view, @Nullable Integer value);
void setFill(T view, @Nullable ReadableMap value);
void setFill(T view, Dynamic value);
void setFillOpacity(T view, float value);
void setFillRule(T view, int value);
void setStroke(T view, @Nullable ReadableMap value);
void setStroke(T view, Dynamic value);
void setStrokeOpacity(T view, float value);
void setStrokeWidth(T view, Dynamic value);
void setStrokeLinecap(T view, int value);
Expand Down
5 changes: 2 additions & 3 deletions android/src/paper/java/com/facebook/react/viewmanagers/RNSVGMaskManagerDelegate.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@
import com.facebook.react.bridge.ColorPropConverter;
import com.facebook.react.bridge.DynamicFromObject;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.bridge.ReadableMap;
import com.facebook.react.uimanager.BaseViewManagerDelegate;
import com.facebook.react.uimanager.BaseViewManagerInterface;

Expand Down Expand Up @@ -65,7 +64,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setColor(view, ColorPropConverter.getColor(value, view.getContext()));
break;
case "fill":
mViewManager.setFill(view, (ReadableMap) value);
mViewManager.setFill(view, new DynamicFromObject(value));
break;
case "fillOpacity":
mViewManager.setFillOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand All @@ -74,7 +73,7 @@ public void setProperty(T view, String propName, @Nullable Object value) {
mViewManager.setFillRule(view, value == null ? 1 : ((Double) value).intValue());
break;
case "stroke":
mViewManager.setStroke(view, (ReadableMap) value);
mViewManager.setStroke(view, new DynamicFromObject(value));
break;
case "strokeOpacity":
mViewManager.setStrokeOpacity(view, value == null ? 1f : ((Double) value).floatValue());
Expand Down
Loading
Loading