0
I’m developing an app with Ionic using Vue. The user takes a photo, (I’m using the Capacitor.js Camera plugin). So far everything works. But I need to cut the image to always be square (It will be avatar photo). But I found very few solutions.
Photo.Vue (template)
<ion-img v-if="photo" :src="photo"></ion-img>
<ion-button @click="getPhoto('photo')">Tirar foto</ion-button>
Photo.Vue (script)
import { Plugins, CameraResultType } from '@capacitor/core';
const { Camera } = Plugins;
...
methods : {
async getPhoto() {
const image = await Camera.getPhoto({
quality: 90,
allowEditing: true,
resultType: CameraResultType.Uri
});
this.photo = image.webPath; // Esta foto precisa ser cortada a partir de agora
}
Using the traditional (web) Vue.js Cropper components does not work for Ionic (Android, iOS), and the capacitor.js solution itself works with Angular or React only. So I still need a Cropper solution for Ionic Vue.
Any help is welcome. Thank you!