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.

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

Minimum height/width not respected on mobile if user "taps" the image #425

Open
mikemarian opened this issue Jun 2, 2021 · 4 comments
Open
Labels

Comments

@mikemarian
Copy link

mikemarian commented Jun 2, 2021

Hi, I'm seeing an issue where although we've defined a minimum height/width (and a fixed aspect ratio if that matters), on mobile - specifically iPhone Safari - if the user "taps" the screen, the user is able to select a very small area of a few pixels by a few pixels.

If the user tries to drag/select an area, there are no issues, but any ideas how we can prevent the "tap" from bypassing these requirements?

If you drag, it enforces the minimums:
Crop-Enforced

If you "tap", it does not:
Crop-Broken

Thanks!

Mike

@DominicTobias-b1
Copy link
Collaborator

DominicTobias-b1 commented Jun 10, 2021

@mikemarian what version are you using, latest?

I can't repro it on Safari with the latest version. Crop params:

<ReactCrop
  src={this.state.src}
  crop={this.state.crop}
  onImageLoaded={this.onImageLoaded}
  onComplete={this.onCropComplete}
  onChange={this.onCropChange}
  onDragStart={this.onDragStart}
  onDragEnd={this.onDragEnd}
  minWidth={300}
  minHeight={300}
/>

@mikemarian
Copy link
Author

Hi @DominicTobias-b1 thanks for taking a look!

We just upgraded to 8.6.9 ( we were on 8.6.6) and the issue still persists.

We're using the same params as above, with a couple changes for the sake of the flow its being used for:

<ReactCrop
                minWidth={300}
                minHeight={205}
                src={this.state.src}
                crop={!this.state.defaultImage ? this.state.crop : {}}
                disabled={this.state.defaultImage}
                ruleOfThirds
                onImageLoaded={this.onImageLoaded}
                onComplete={this.onCropComplete}
                onChange={this.onCropChange}
                onDragStart={this.onDragStart}
                onDragEnd={this.onDragEnd}
              />

Just to clarify, the issue of being able to select a single pixel is only if you tap outside of where the crop selector already exists. If you tap the area that is already selected, it is not an issue.

Thanks,

Mike

@DominicTobias-b1
Copy link
Collaborator

Just to clarify, the issue of being able to select a single pixel is only if you tap outside of where the crop selector already exists. If you tap the area that is already selected, it is not an issue.

Aha thanks

@dominictobias
Copy link
Owner

Hi please try 8.6.10

While checking this I noticed that when using minWidth/minHeight aspect crops can only be drawn left->right in a downwards motion - raised #428

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants