Skip to content

Able to draw out of height and width #78

@nijarv

Description

@nijarv

On what kind of device are you using this library?

  • Android
  • iOS
  • Web

Environment

- OS: macOS Ventura
- react-native: 0.70.4
- @benjeau/react-native-draw: 0.8.3
- @benjeau/react-native-draw-extras: 0.2.2

Current Behavior

I'm developing an app for drawing above an image, I have restricted the canvas height and width but I can draw more than the specified height and width.

Code:

<View style={{ height: '60%, width: '100%', paddingHorizontal: 16 }}>
            <FastImage
                style={{ height: '100%', width: '100%' }}
                source={{ uri: image.uri }}
                resizeMode={FastImage.resizeMode.contain}
            />

            <Canvas
                enabled={isEditing}
                ref={canvasRef}
                style={{ position: 'absolute', top: 0, bottom: 0, left: 0, right: 0, backgroundColor: 'transparent' }}
                color={color}
                thickness={thickness}
                opacity={opacity}
                tool={DrawingTool.Brush}
                onPathsChange={setPaths}
            />
</View>

Sample Video:

Screen.Recording.2023-03-22.at.6.09.55.PM.mov

Expected Behavior

I should be able to restrict drawing height to the view's height and width. I need something like this UI part I can take care. Just that drawing part alone I'm facing issues.

RPReplay_Final1679923703.MP4

Steps To Reproduce

You can check my above code in the current behavior section.

Anything else?

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions