### controller.croppedBitmap() Source: https://context7.com/deakjahn/crop_image/llms.txt Get the cropped image as a `ui.Image` object. Supports scaling and applying an overlay painter. ```APIDOC ## `controller.croppedBitmap()` — Get Cropped `ui.Image` Returns a `Future` of the bitmap region selected by the current crop rect and rotation, optionally scaled down and/or painted over with a `CustomPainter`. Use this when you need raw pixel data (e.g., to encode and save to a file). > **Note:** Throws on Flutter Web with the HTML renderer — use CanvasKit instead. ```dart Future saveToFile(File outputFile) async { // Limit the output to 1024 px on the longest side final ui.Image bitmap = await controller.croppedBitmap( maxSize: 1024, quality: FilterQuality.high, overlayPainter: null, // optional CustomPainter drawn on top ); final ByteData? data = await bitmap.toByteData(format: ui.ImageByteFormat.png); if (data == null) return; await outputFile.writeAsBytes(data.buffer.asUint8List(), flush: true); debugPrint('Saved ${bitmap.width}×${bitmap.height} px crop to ${outputFile.path}'); } ``` ``` -------------------------------- ### controller.croppedImage() Source: https://context7.com/deakjahn/crop_image/llms.txt Get the cropped image as a Flutter `Image` widget. A convenience wrapper for previewing. ```APIDOC ## `controller.croppedImage()` — Get Cropped Flutter `Image` Widget A convenience wrapper around `croppedBitmap()` that returns a ready-to-display `Image` widget with `BoxFit.contain`. Suitable for previewing the result inside the UI. ```dart Future _showPreview(BuildContext context) async { final Image preview = await controller.croppedImage( quality: FilterQuality.medium, ); if (!context.mounted) return; showDialog( context: context, builder: (_) => Dialog( child: Column( mainAxisSize: MainAxisSize.min, children: [ const Text('Cropped preview'), preview, Text('relative: ${controller.crop}'), Text('pixels: ${controller.cropSize}'), ], ), ), ); } ``` ``` -------------------------------- ### Get Cropped Bitmap and Image Source: https://github.com/deakjahn/crop_image/blob/master/README.md Obtain the cropped image as a ui.Image or a Flutter Image object. ```dart ui.Image bitmap = await controller.croppedBitmap(); Image image = await controller.croppedImage(); ``` -------------------------------- ### Get Cropped Flutter Image Widget Source: https://context7.com/deakjahn/crop_image/llms.txt Obtain a ready-to-display `Image` widget from the cropped bitmap. This is a convenience wrapper for UI previews and uses `BoxFit.contain`. ```dart Future _showPreview(BuildContext context) async { final Image preview = await controller.croppedImage( quality: FilterQuality.medium, ); if (!context.mounted) return; showDialog( context: context, builder: (_) => Dialog( child: Column( mainAxisSize: MainAxisSize.min, children: [ const Text('Cropped preview'), preview, Text('relative: ${controller.crop}'), Text('pixels: ${controller.cropSize}'), ], ), ), ); } ``` -------------------------------- ### Get Crop Rectangle Source: https://github.com/deakjahn/crop_image/blob/master/README.md Retrieve the final crop rectangle in relative and pixel terms from the controller. ```dart Rect finalCropRelative = controller.crop; Rect finalCropPixels = controller.cropSize; ``` -------------------------------- ### Get Cropped Bitmap Source: https://context7.com/deakjahn/crop_image/llms.txt Retrieve a `Future` of the cropped and rotated bitmap. Optionally scale it down using `maxSize` and apply an `overlayPainter`. Note: Throws on Flutter Web with HTML renderer. ```dart Future saveToFile(File outputFile) async { // Limit the output to 1024 px on the longest side final ui.Image bitmap = await controller.croppedBitmap( maxSize: 1024, quality: FilterQuality.high, overlayPainter: null, // optional CustomPainter drawn on top ); final ByteData? data = await bitmap.toByteData(format: ui.ImageByteFormat.png); if (data == null) return; await outputFile.writeAsBytes(data.buffer.asUint8List(), flush: true); debugPrint('Saved ${bitmap.width}×${bitmap.height} px crop to ${outputFile.path}'); } ``` -------------------------------- ### Initialize CropController with Options Source: https://context7.com/deakjahn/crop_image/llms.txt Create a controller for CropImage, optionally setting aspect ratio, default crop, rotation, and minimum image size. Remember to dispose of the controller when it's no longer needed to free up resources. ```dart import 'package:crop_image/crop_image.dart'; import 'package:flutter/material.dart'; class _EditorState extends State { // 16:9 aspect ratio, crop starts 5% inset from every edge final controller = CropController( aspectRatio: 16.0 / 9.0, defaultCrop: const Rect.fromLTRB(0.05, 0.05, 0.95, 0.95), rotation: CropRotation.up, minimumImageSize: 80, // never shrink crop below 80 px ); @override void dispose() { controller.dispose(); // always dispose to free resources super.dispose(); } @override Widget build(BuildContext context) => CropImage( controller: controller, image: Image.asset('assets/photo.jpg'), ); } ``` -------------------------------- ### Initialize and Use CropController Source: https://github.com/deakjahn/crop_image/blob/master/README.md Initialize a CropController with aspect ratio and default crop, then use it with the CropImage widget. The controller allows programmatic control over the crop rectangle and aspect ratio. ```dart final controller = CropController( /// If not specified, [aspectRatio] will not be enforced. aspectRatio: 1, /// Specify in percentages (1 means full width and height). Defaults to the full image. defaultCrop: Rect.fromLTRB(0.1, 0.1, 0.9, 0.9), ); CropImage( /// Only needed if you expect to make use of its functionality like setting initial values of /// [aspectRatio] and [defaultCrop]. controller: controller, /// The image to be cropped. Use [Image.file] or [Image.network] or any other [Image]. image: Image.asset('...'), /// The crop grid color of the outer lines. Defaults to 70% white. gridColor: Colors.white, /// The crop grid color of the inner lines. Defaults to [gridColor]. gridInnerColor: Colors.white, /// The crop grid color of the corner lines. Defaults to [gridColor]. gridCornerColor: Colors.white, /// The size of the corner of the crop grid. Defaults to 25. gridCornerSize: 50, /// The offset of the corner handles from the crop grid edges. /// Positive values move corners outside. Defaults to 0. cornerOffset: 10, /// Whether to display the corners. Defaults to true. showCorners: true, /// The width of the crop grid thin lines. Defaults to 2. gridThinWidth: 3, /// The width of the crop grid thick lines. Defaults to 5. gridThickWidth: 6, /// The crop grid scrim (outside area overlay) color. Defaults to 54% black. scrimColor: Colors.grey.withOpacity(0.5), /// True: Always show third lines of the crop grid. /// False: third lines are only displayed while the user manipulates the grid (default). alwaysShowThirdLines: true, /// Event called when the user changes the crop rectangle. /// The passed [Rect] is normalized between 0 and 1. onCrop: (rect) => print(rect), /// The minimum pixel size the crop rectangle can be shrunk to. Defaults to 100. minimumImageSize: 50, /// The maximum pixel size the crop rectangle can be grown to. Defaults to infinity. /// You can constrain the crop rectangle to a fixed size by setting /// both [minimumImageSize] and [maximumImageSize] to the same value (the width) and using /// the [aspectRatio] of the controller to force the other dimension (width / height). /// Doing so disables the display of the corners. maximumImageSize: 2000; ); ``` -------------------------------- ### CropController Constructor Source: https://context7.com/deakjahn/crop_image/llms.txt Creates a controller to manage the state of a CropImage widget. It allows for setting an initial aspect ratio, default crop rectangle, rotation, and minimum image size. Remember to dispose of the controller when it's no longer needed to free up resources. ```APIDOC ## `CropController` — Controller Constructor Creates a controller that drives a `CropImage` widget. Accepts an optional `aspectRatio` (enforced automatically), an initial `defaultCrop` rect (normalized 0–1), an initial `rotation`, and a `minimumImageSize` guard. Must be `dispose()`d when no longer needed. ```dart import 'package:crop_image/crop_image.dart'; import 'package:flutter/material.dart'; class _EditorState extends State { // 16:9 aspect ratio, crop starts 5% inset from every edge final controller = CropController( aspectRatio: 16.0 / 9.0, defaultCrop: const Rect.fromLTRB(0.05, 0.05, 0.95, 0.95), rotation: CropRotation.up, minimumImageSize: 80, // never shrink crop below 80 px ); @override void dispose() { controller.dispose(); // always dispose to free resources super.dispose(); } @override Widget build(BuildContext context) => CropImage( controller: controller, image: Image.asset('assets/photo.jpg'), ); } ``` ``` -------------------------------- ### Initialize CropController with Aspect Ratio Source: https://github.com/deakjahn/crop_image/blob/master/README.md Set initial values for aspectRatio and defaultCrop when creating a CropController. The aspectRatio will enforce the crop rectangle's proportions. ```dart final controller = CropController( aspectRatio: 16.0 / 9.0, defaultCrop: Rect.fromLTRB(0.05, 0.05, 0.95, 0.95), ); ``` -------------------------------- ### Static Crop Utility Source: https://context7.com/deakjahn/crop_image/llms.txt Use `CropController.getCroppedBitmap()` for batch processing or server-side operations without a controller instance. It performs the same crop/rotate/scale pipeline. ```dart Future processRawImage({ required ui.Image source, required Rect cropRect, // normalized 0–1 required CropRotation rotation, double? maxDimension, }) async { return CropController.getCroppedBitmap( image: source, crop: cropRect, rotation: rotation, maxSize: maxDimension, quality: FilterQuality.high, ); } // Usage final ui.Image result = await processRawImage( source: rawBitmap, cropRect: const Rect.fromLTRB(0.25, 0.25, 0.75, 0.75), rotation: CropRotation.left, maxDimension: 512, ); ``` -------------------------------- ### controller.aspectRatio Source: https://context7.com/deakjahn/crop_image/llms.txt Set the aspect ratio for the crop rectangle. Setting it to null allows for free-form cropping. ```APIDOC ## `controller.aspectRatio` — Enforce or Release Aspect Ratio Setting `aspectRatio` causes the crop rect to be adjusted immediately and on every future drag. Set to `null` for free-form cropping. ```dart // Enforce square crop controller.aspectRatio = 1.0; // Switch to 4:3 controller.aspectRatio = 4.0 / 3.0; // Allow free selection controller.aspectRatio = null; // Common aspect ratios const ratios = { 'free': null, 'square': 1.0, '16:9': 16.0 / 9.0, '4:3': 4.0 / 3.0, '2:1': 2.0, '1:2': 1.0 / 2.0, }; void applyRatio(String key) { controller.aspectRatio = ratios[key]; // Reset crop to leave 10 % padding controller.crop = const Rect.fromLTRB(0.1, 0.1, 0.9, 0.9); } ``` ``` -------------------------------- ### CropController.getCroppedBitmap() Source: https://context7.com/deakjahn/crop_image/llms.txt Static utility method to crop and rotate an image without a controller instance. Useful for batch processing. ```APIDOC ## `CropController.getCroppedBitmap()` — Static Crop Utility A static method that performs the same crop/rotate/scale pipeline as the instance method, but without requiring a controller. Useful for batch-processing or server-side-like operations where only raw data is available. ```dart Future processRawImage({ required ui.Image source, required Rect cropRect, // normalized 0–1 required CropRotation rotation, double? maxDimension, }) async { return CropController.getCroppedBitmap( image: source, crop: cropRect, rotation: rotation, maxSize: maxDimension, quality: FilterQuality.high, ); } // Usage final ui.Image result = await processRawImage( source: rawBitmap, cropRect: const Rect.fromLTRB(0.25, 0.25, 0.75, 0.75), rotation: CropRotation.left, maxDimension: 512, ); ``` ``` -------------------------------- ### CropImage Widget Source: https://context7.com/deakjahn/crop_image/llms.txt The main interactive widget for cropping images. It displays the image, a customizable grid overlay, and a scrim. It handles all touch and mouse gestures internally. The `image` parameter is required, while others are optional for customization. ```APIDOC ## `CropImage` — Widget The interactive crop widget. Renders the image, the configurable grid overlay, and a scrim over the excluded area. Handles all touch/mouse gestures internally. Requires only `image`; all other parameters are optional. ```dart CropImage( controller: controller, // omit to let the widget manage its own state image: Image.network('https://example.com/photo.jpg'), // Grid appearance gridColor: Colors.white, // outer rectangle lines (default: 70% white) gridInnerColor: Colors.white70, // third-division inner lines gridCornerColor: Colors.blue, // L-shaped corner handles gridCornerSize: 30, // length of each corner arm (default: 25) cornerOffset: 8, // move corners outside the rect (default: 0) showCorners: true, // hide corners for a fixed-size crop gridThinWidth: 1.5, // border & inner line width (default: 2) gridThickWidth: 4, // corner line width (default: 5) scrimColor: Colors.black54, // overlay outside the crop rect // Behaviour paddingSize: 20, // space between widget edge and image (default: 0) touchSize: 48, // tap target radius around each corner (default: 50) minimumImageSize: 60, // smallest draggable crop (px, default: 100) maximumImageSize: 800, // largest draggable crop (px, default: infinity) alwaysShowThirdLines: true, // show rule-of-thirds lines without dragging alwaysMove: false, // true: pan anywhere; false: pan only inside crop rect // Callbacks & overlays onCrop: (Rect normalized) { // called on every drag update; rect values are 0.0–1.0 debugPrint('crop changed: $normalized'); }, overlayWidget: const ColorFiltered( // optional widget drawn above the image colorFilter: ColorFilter.mode(Colors.red, BlendMode.hue), child: SizedBox.expand(), ), loadingPlaceholder: const Center( // shown while the image decodes child: CircularProgressIndicator.adaptive(), ), ) ``` ``` -------------------------------- ### Fixed-Size Crop with CropController Source: https://context7.com/deakjahn/crop_image/llms.txt Configures a locked crop to a specific pixel size by setting `minimumImageSize` equal to `maximumImageSize` and providing an `aspectRatio`. This configuration hides corner handles and prevents resizing. ```dart // Locked 200×200 px square crop final controller = CropController( aspectRatio: 1.0, // square defaultCrop: const Rect.fromLTRB(0.3, 0.3, 0.7, 0.7), ); CropImage( controller: controller, image: Image.asset('assets/avatar.png'), minimumImageSize: 200, // both equal → fixed size maximumImageSize: 200, // corners are hidden automatically ); ``` -------------------------------- ### Save Cropped Image to File Source: https://github.com/deakjahn/crop_image/blob/master/README.md Convert the cropped ui.Image to PNG byte data and write it to a file. ```dart data = await bitmap.toByteData(format: ImageByteFormat.png); bytes = data!.buffer.asUint8List(); file.writeAsBytes(bytes, flush); ``` -------------------------------- ### Configure Runner Executable Source: https://github.com/deakjahn/crop_image/blob/master/example/windows/runner/CMakeLists.txt Defines the runner executable, lists its source files, applies standard settings, sets compile definitions, links necessary libraries, and adds include directories. It also establishes a dependency on the flutter_assemble target. ```cmake cmake_minimum_required(VERSION 3.15) project(runner LANGUAGES CXX) add_executable(${BINARY_NAME} WIN32 "flutter_window.cpp" "main.cpp" "run_loop.cpp" "utils.cpp" "win32_window.cpp" "${FLUTTER_MANAGED_DIR}/generated_plugin_registrant.cc" "Runner.rc" "runner.exe.manifest" ) apply_standard_settings(${BINARY_NAME}) target_compile_definitions(${BINARY_NAME} PRIVATE "NOMINMAX") target_link_libraries(${BINARY_NAME} PRIVATE flutter flutter_wrapper_app) target_include_directories(${BINARY_NAME} PRIVATE "${CMAKE_SOURCE_DIR}") add_dependencies(${BINARY_NAME} flutter_assemble) ``` -------------------------------- ### Configure CropImage Widget Source: https://context7.com/deakjahn/crop_image/llms.txt The CropImage widget displays the image and cropping interface. Customize its appearance and behavior using various optional parameters. Omit the controller to let the widget manage its own state. ```dart CropImage( controller: controller, image: Image.network('https://example.com/photo.jpg'), // Grid appearance gridColor: Colors.white, // outer rectangle lines (default: 70% white) gridInnerColor: Colors.white70, // third-division inner lines gridCornerColor: Colors.blue, // L-shaped corner handles gridCornerSize: 30, // length of each corner arm (default: 25) cornerOffset: 8, // move corners outside the rect (default: 0) showCorners: true, // hide corners for a fixed-size crop gridThinWidth: 1.5, // border & inner line width (default: 2) gridThickWidth: 4, // corner line width (default: 5) scrimColor: Colors.black54, // overlay outside the crop rect // Behaviour paddingSize: 20, // space between widget edge and image (default: 0) touchSize: 48, // tap target radius around each corner (default: 50) minimumImageSize: 60, // smallest draggable crop (px, default: 100) maximumImageSize: 800, // largest draggable crop (px, default: infinity) alwaysShowThirdLines: true, // show rule-of-thirds lines without dragging alwaysMove: false, // true: pan anywhere; false: pan only inside crop rect // Callbacks & overlays onCrop: (Rect normalized) { // called on every drag update; rect values are 0.0–1.0 debugPrint('crop changed: $normalized'); }, overlayWidget: const ColorFiltered( // optional widget drawn above the image colorFilter: ColorFilter.mode(Colors.red, BlendMode.hue), child: SizedBox.expand(), ), loadingPlaceholder: const Center( // shown while the image decodes child: CircularProgressIndicator.adaptive(), ), ) ``` -------------------------------- ### Read and Set Crop Rectangle with CropController Source: https://context7.com/deakjahn/crop_image/llms.txt Access the current crop selection as a normalized Rect (0.0-1.0) or in bitmap pixels using `controller.crop` and `controller.cropSize`. You can also programmatically set the crop rectangle using either normalized values or pixel coordinates. ```dart // Read normalized crop (0.0 – 1.0) final Rect normalized = controller.crop; // e.g. Rect.fromLTRB(0.10, 0.05, 0.90, 0.95) // Read crop in bitmap pixels (requires the bitmap to be loaded) final Rect pixels = controller.cropSize; // e.g. Rect.fromLTRB(192.0, 96.0, 1728.0, 1824.0) for a 1920×1920 image // Programmatically set crop (normalized); aspect ratio is auto-adjusted controller.crop = const Rect.fromLTRB(0.2, 0.2, 0.8, 0.8); // Set via pixels controller.cropSize = const Rect.fromLTWH(100, 100, 600, 400); ``` -------------------------------- ### Reading and Setting Crop Rectangle Source: https://context7.com/deakjahn/crop_image/llms.txt Access and modify the crop rectangle using the `crop` (normalized 0-1) and `cropSize` (bitmap pixels) properties of the `CropController`. Setting these properties will automatically notify listeners and re-render the widget. ```APIDOC ## `controller.crop` / `controller.cropSize` — Read & Set Crop Rectangle `crop` is the normalized crop `Rect` (all values 0–1). `cropSize` maps the same rect to actual bitmap pixels. Both are readable at any time and settable programmatically; setting either notifies listeners and re-renders the widget. ```dart // Read normalized crop (0.0 – 1.0) final Rect normalized = controller.crop; // e.g. Rect.fromLTRB(0.10, 0.05, 0.90, 0.95) // Read crop in bitmap pixels (requires the bitmap to be loaded) final Rect pixels = controller.cropSize; // e.g. Rect.fromLTRB(192.0, 96.0, 1728.0, 1824.0) for a 1920×1920 image // Programmatically set crop (normalized); aspect ratio is auto-adjusted controller.crop = const Rect.fromLTRB(0.2, 0.2, 0.8, 0.8); // Set via pixels controller.cropSize = const Rect.fromLTWH(100, 100, 600, 400); ``` ``` -------------------------------- ### Use UiImageProvider with dart:ui Image Source: https://context7.com/deakjahn/crop_image/llms.txt Wraps a `dart:ui.Image` object to be used where Flutter expects an `ImageProvider`. Useful for custom image display or decorations with specific BoxFit values. ```dart Future displayWithCustomFit(BuildContext context) async { final ui.Image bitmap = await controller.croppedBitmap(maxSize: 800); // Use BoxFit.fill instead of the default BoxFit.contain final widget = Image( image: UiImageProvider(bitmap), fit: BoxFit.fill, width: 400, height: 300, ); // Or as a decoration final box = DecoratedBox( decoration: BoxDecoration( image: DecorationImage( image: UiImageProvider(bitmap), fit: BoxFit.cover, ), borderRadius: BorderRadius.circular(12), ), ); } ``` -------------------------------- ### Enforce or Release Aspect Ratio Source: https://context7.com/deakjahn/crop_image/llms.txt Set `aspectRatio` to a double for a fixed ratio or `null` for free-form cropping. The crop rect adjusts immediately. Common ratios are provided. ```dart // Enforce square crop controller.aspectRatio = 1.0; // Switch to 4:3 controller.aspectRatio = 4.0 / 3.0; // Allow free selection controller.aspectRatio = null; // Common aspect ratios const ratios = { 'free': null, 'square': 1.0, '16:9': 16.0 / 9.0, '4:3': 4.0 / 3.0, '2:1': 2.0, '1:2': 1.0 / 2.0, }; void applyRatio(String key) { controller.aspectRatio = ratios[key]; // Reset crop to leave 10 % padding controller.crop = const Rect.fromLTRB(0.1, 0.1, 0.9, 0.9); } ``` -------------------------------- ### Programmatically Change Crop and Aspect Ratio Source: https://github.com/deakjahn/crop_image/blob/master/README.md Modify the crop rectangle and aspect ratio of an existing CropController instance. The crop rectangle will automatically adjust if an aspectRatio is set. ```dart controller.aspectRatio = 16.0 / 9.0; controller.crop = Rect.fromLTRB(0.05, 0.05, 0.95, 0.95); ``` -------------------------------- ### controller.rotation Source: https://context7.com/deakjahn/crop_image/llms.txt Control the rotation of the image. Can be set to a specific orientation or rotated incrementally. ```APIDOC ## `controller.rotation` / `rotateLeft()` / `rotateRight()` — Image Rotation `CropRotation` is a 4-value enum: `up`, `right`, `down`, `left`. Assigning `controller.rotation` jumps to that orientation; `rotateLeft()` / `rotateRight()` rotate by 90° steps and recalculate the crop center automatically. ```dart // Jump to a specific orientation controller.rotation = CropRotation.right; // 90° cw // Rotate incrementally (UI buttons) IconButton( icon: const Icon(Icons.rotate_90_degrees_ccw_outlined), onPressed: controller.rotateLeft, ), IconButton( icon: const Icon(Icons.rotate_90_degrees_cw_outlined), onPressed: controller.rotateRight, ), // Read current rotation final CropRotation r = controller.rotation; print('${r.degrees}°'); // 0 / 90 / 180 / 270 print('${r.radians} rad'); // Convert from degrees final CropRotation? rot = CropRotationExtension.fromDegrees(180); // rot == CropRotation.down // Reset everything controller.rotation = CropRotation.up; controller.crop = const Rect.fromLTRB(0.0, 0.0, 1.0, 1.0); ``` ``` -------------------------------- ### Set Crop Rotation Source: https://github.com/deakjahn/crop_image/blob/master/README.md Adjust the rotation of the crop rectangle using predefined CropRotation values or by repeatedly rotating. ```dart controller.rotation = CropRotation.right; ``` ```dart controller.rotateLeft(); controller.rotateRight(); ``` -------------------------------- ### Image Rotation Control Source: https://context7.com/deakjahn/crop_image/llms.txt Control image rotation using `controller.rotation` or `rotateLeft()`/`rotateRight()` methods. `CropRotation` is a 4-value enum. You can also convert degrees to `CropRotation`. ```dart // Jump to a specific orientation controller.rotation = CropRotation.right; // 90° cw // Rotate incrementally (UI buttons) IconButton( icon: const Icon(Icons.rotate_90_degrees_ccw_outlined), onPressed: controller.rotateLeft, ), IconButton( icon: const Icon(Icons.rotate_90_degrees_cw_outlined), onPressed: controller.rotateRight, ), // Read current rotation final CropRotation r = controller.rotation; print('${r.degrees}°'); // 0 / 90 / 180 / 270 print('${r.radians} rad'); // Convert from degrees final CropRotation? rot = CropRotationExtension.fromDegrees(180); // rot == CropRotation.down // Reset everything controller.rotation = CropRotation.up; controller.crop = const Rect.fromLTRB(0.0, 0.0, 1.0, 1.0); ``` === COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.