Angular 9 ngx-image-cropper для изменения размера с ползунком

Я использую библиотеку ngx-image-cropper в своем проекте. Я хотел бы обрезать изображение только в соотношении сторон 16/9, и это нормально. Я установил aspectRatio на 16/9, а обрезка — прямоугольник. Я также реализовал mat-slider, который должен изменять только ширину и высоту обрезки изображения, точно так же, как он работает с перетаскиванием стрелок обрезки для его масштабирования. Можно ли добавить в мат-слайдер событие изменения размера обрезки точно так же, как это работает с изменением масштаба обрезки путем перетаскивания стрелок? Я не хочу масштабировать изображение мат-слайдером, а только кадрировать. Я искал в библиотеке ngx-image-cropper, но не нашел ничего, что соответствовало бы моим потребностям. Спасибо за любую помощь!

Ссылка на библиотеку: https://www.npmjs.com/package/ngx-image-cropper

    <div class="image-cropper-dimensions">
      <image-crop
        [imageFile]="data.file"
        [cropWidth]="sliderValue"
        [aspectRatio]="16 / 9"
        [isFileStrip]="true"
        [roundCropper]="data.isRoundedCropper"
        (onImageCropped)="onImageCropped($event)"
      >
      </image-crop>
    </div>
  </div>
  <div class="image-edit-container">
    <mat-slider
      [min]="SLIDER_MIN_VALUE"
      [color]="'primary'"
      [value]="sliderValue"
      [step]="SLIDER_STEP"
      (input)="onSliderChange($event)"
    >
    </mat-slider>

angular cropper
person ciolas2    schedule 12.07.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

в моем приложении я меняю только высоту и высоту с помощью этой команды: [maintainAspectRatio]=false

Это небольшая часть моего кода:

<image-cropper
  [imageChangedEvent]="imageChangedEvent"
  [imageURL]="imageUrl"
  [transform]="transform"
  [maintainAspectRatio]="false"
  [aspectRatio]="aspectRatio"
  [canvasRotation]="canvasRotation"
  (imageCropped)="imageCropped($event)"
></image-cropper>

person Shushan    schedule 14.07.2020
comment
Да, и в моем приложении мне нужно сделать этот ресайз именно таким, как он работает с mainAspectRatio, но с ползунком - person ciolas2; 21.07.2020