Cropper¶
Das Cropper-Controll erlaubt das Zuschneiden eines Bildes auf die gewünschte Größe. Als Bibliothek kommt cropper.js zum Einsatz.
url = new URL('https://example.com/image.png');
options = {
}
cropper = new Alvine.Package.UI.Dialog.Widgets.Cropper(url, options);
crpper.initDefaultToolbar();
Schlüssel | Beschreibung | Default | Beispiel |
---|---|---|---|
id | ID des Elements | zufällige ID | myID |
class | Klasse des Containers | undefined | |
container-class | Container-Klasse | "container-fluid" | |
dragMode | Modus none, crop, move | "none" | |
viewMode | View-Modus 0,1,2,3 | 0 | |
aspectRatio | Verhältnis der Crop-Box | undefined | |
movable | Erlaubt das verschieben | true | |
rotatable | Erlaubt das Drehen | true | |
scalable | Erlaubt die Skalierung | true | |
zoomable | Erlaubt Zoomen | true | |
autoCrop | Im Crop-Modus starten | false | |
initialAspectRatio | undefined | ||
available-ration | Verfügbare Verhältnisse zwischen Breite und Höhe der Crop-Box (1/1, 16/9, 4/3, ⅔, undefined) | undefined | |
autoCropArea | 0.8 | ||
eventHandler | Cropper.eventHandler | ||
infobox-class | infobox |