Appearance
Basic Cropper Component
A powerful and flexible image cropping component built on vue-advanced-cropper with custom stencil support.
Overview
The Basic Cropper component provides:
- Advanced image cropping with custom stencil
- Click-to-position cropping area
- Customizable crop dimensions (width/height)
- Full-size cropping option
- Base64 image output
- Drag and drop image support
- Real-time preview
When to Use
Use the Basic Cropper component when you need to:
- Allow users to crop images before upload
- Create profile picture uploaders
- Build image editing interfaces
- Implement custom image selection areas
- Create image processing workflows
Key Features
- Custom Stencil: Uses a custom stencil component for cropping area
- Click to Position: Click anywhere on the image to center the crop area
- Flexible Dimensions: Set custom width and height or use full image size
- Base64 Output: Returns cropped images as base64 data URLs
- Smooth Initialization: Blur effect during stencil initialization
- Wheel Zoom: Mouse wheel support for image zooming
- Event-Driven: Emits cropped image data when ready