-
Notifications
You must be signed in to change notification settings - Fork 920
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.
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
Custom React Canvas Component #46
base: master
Are you sure you want to change the base?
Custom React Canvas Component #46
Conversation
Instead of using a switch for drawFunction in drawRenderLayer we use a registry for draw function based on layer type
This sounds interesting, maybe I can get a little clarification. I'm hoping to use opentype.js to draw to a canvas. I would like to have a stack of canvas layers, targeting specific drawing instructions to specific layers in the stack. The canvases would all be the same size and use their own transparency settings so there would be a blended composite image resulting from the complete stack of canvas layers. Is this the kind of thing that react-canvas is intended for? |
Would be nice to see this PR merged |
Update on this? Are custom shapes not something React Canvas aims to add? |
👍 for this. I'm curious to know if there is a plan moving forward for custom components - whether through this PR or otherwise. For what its worth I was able to successfully create custom components using @fdecampredon's branch and following his instructions in #13 (comment) |
👍 |
@fdecampredon this is sweet—exactly what I was hoping to implement. Thanks for sharing this. Hope it gets merged. |
This PR is related to #13. And follow more or less the proposal of this comment
The purpose here is to expose extensions points in the drawing engine.
This PR introduce a map layer 'type' to draw function instead of switching over a predetermined list of type, and expose a new api at top level :
registerLayerType(type: string, draw: (ctx: Context, layer: RenderLayer) => void)
.This function will allow the user to inject custom draw function into the drawing engine.
To be able to consume the new layer type, this PR introduce a new top level function that allows to create a new
Layer
like component with custom render layer type and style :createCanvasComponent(specs: { layerType: string; applyCustomProps: ?Function })
The custom-draw example create a
Circle
component and shows how to take advantage of the new feature.