Glad you got it worked out. btw you might wanna updgrade those capacitor plugins as well may, cause other unintended issues while upgrading:
↧
Capacitor sync cb.apply is not a function
↧
FCM push notifications app badge
Hey thanks for your reply. That’s good to know the plugin isn’t deprecated. I figured out the problem and where they moved the badge property on the Firebase Admin SDK. In case anyone else facing the same issue; it has moved from notification > badge on the message object to apns > payload > aps > badge.
↧
↧
Ionic6 ,On some Android phones, in the browser, open the page, click on the time in the on ion-datetime-button, and whether it is clicking on the hour or minute, it will jump up one by one until it shows 00. I don't know why
On some Android phones, in the browser, open the page, click on the time in the on ion-datetime-button, and whether it is clicking on the hour or minute, it will jump up one by one until it shows 00. I don’t know why
code:
```
<ion-label floating>End Date</ion-label>
<ion-datetime-button datetime="datetime2" ></ion-datetime-button>
<ion-modal [keepContentsMounted]="true">
<ng-template>
<ion-datetime id="datetime2" formControlName="EndDate" (ionChange)="onDateChange($event)"></ion-datetime>
</ng-template>
</ion-modal>
↧
Introducing: Capacitor Barcode Scanner Plugin
When npx cap run android, I encounter the following error
- What went wrong:
Execution failed for task ‘:app:checkDebugAarMetadata’.
> Could not resolve all files for configuration ‘:app:debugRuntimeClasspath’.
> Could not find any matches for com.github.outsystems:osbarcode-android:[1.0.1, 2.0.0[ as no versions of com.github.outsystems:osbarcode-android are available.
Searched in the following locations:
- https://dl.google.com/dl/android/maven2/com/github/outsystems/osbarcode-android/maven-metadata.xml
- https://repo.maven.apache.org/maven2/com/github/outsystems/osbarcode-android/maven-metadata.xml
↧
Introducing: Capacitor Barcode Scanner Plugin
The plugin requires to add some lines to the gradle files, see Barcode Scanner Capacitor Plugin API | Capacitor Documentation
↧
↧
Google SignIn on Android, error Code 10
I integrated Google Oauth Sign In in my Ionic Capacitor App but I have an issue for Android Device only:
When the user clicks on the Google login button from the app, a popup appears to select the gmail account. Immediately afterwards the system goes into error and in the log I find this error:
{
"save": false,
"callbackId": "21517523",
"pluginId": "GoogleAuth",
"methodName": "signIn",
"success": false,
"error": {
"message": "Something went wrong",
"code": "10"
}
}
I’ve read several posts and tried different solutions but I can’t resolve the problem. I followed the following steps
-
I deleted all fingerprints from Firebase Console for Android application
-
I have deleted all references from Google Cloud Console Oauth 2.0 Client IDs for the Android application
-
Generated SHA certificate fingerprint using windows shell command
keytool -keystore my-jks-file-path -list -v
Certificate fingerprints:
SHA1: 56:5D:38:F2:D0:XX:XX:XX:XX:XX:D7:FB:56:7A:A2:D4:B5:1B:D0:C5
-
Add SHA certificate fingerprint from Firebase Console (Android Apps)
-
Google creae automatically reference into Google Cloud Console Oauth 2.0 Client IDs (Android client for (auto created by Google Service))
-
Downloaded google-services.json file-path
-
Copied google-services.json file into my ionic app into .\android\app\google-services.json
-
Rebuild App using keystore (the same used for generate SHA certificate fingerprints )
-
Installed on my android device
Please help me.
Thanks
↧
iOS not updated on build
For me the way I built the app was crucial. As Josh Morony pointed out here.
If you update something in the code after that you have run the app via XCode on your phone or the simulator, and you want to see the change, you have to build first:
Using Ionic CLI:
ionic build
Using Vite:
npm run build
(npx cap build ios did not work for me)
Then:
ion cap copy ios
ion cap run ios
↧
Button component with "aria-labelledby" attribute not working correctly
Hello,
I have a question about the “ion-button” component. When I use the button with the “aria-labelledby” attribute and link it to an HTML element with a specific “id” acting as the button’s label, the screen reader does not read the content of the HTML element.
I think it’s because of the shadow DOM, that the inner button used inside the “ion-button” just cannot see the HTML element next to the “ion-button”.
So my question is, if it has some solution how to make this work?
This is the code snippet which I tried:
<ion-content class="ion-padding">
<p id="btn-label">Button Label</p>
<ion-button aria-labelledby="btn-label">Default</ion-button>
<button aria-labelledby="btn-label">Native Button</button>
</ion-content>
or directly link to the showcase: https://stackblitz.com/edit/kq5xbb?file=index.html
As you can see, I implemented the native button HTML element to demonstrate, that the native button announces the label correctly.
↧
ESLint not working with Ionic React 8 TypeScript project
I have a Ionic React 8 TypeScript project generated using the Ionic CLI. But executing npx eslint results in no warnings / errors. What am I missing?
↧
↧
Android Debug Bridge(adb) issue
All good now? Or do you still need help?
↧
ESLint not working with Ionic React 8 TypeScript project
Maybe it doesn’t have any warnings or errors? if you just created the app it shouldn’t throw any warnings.
Have you tried adding some code that would cause warnings?
↧
ESLint not working with Ionic React 8 TypeScript project
Did you configure eslint/tslint and the plugins you want to use?
↧
Nfc integearation in ionic react capacitor porject
@ashokmanjhu Did you find any solution? I am struggling with the same problem nfc integration in ionic react capacitor. Thanks
↧
↧
How to avoid flicker with ion-tabs and isVisible state?
If you dont mind. Can you show you full React Router to handle authentication. I got same issue flicking.
↧
Nfc integearation in ionic react capacitor porject
Yes , Later on contacted to the capawesome-team and purchased their capacitor to use it and it worked perfectly without any issues.
↧
Nfc integearation in ionic react capacitor porject
Aren’t there any free options? how much should we pay ? is it one time purchase or monthly subscription?
↧
Nfc integearation in ionic react capacitor porject
Currently there is no free option. $15 for personal use or $50 for professional use . It is a monthly subscription.
Link - Insiders - Capawesome
↧
↧
Ionic 7 - Mask on a ion-input
Maskito looks good, but it’s russian product. Is there any alternative?
↧
Any way to share a image through Capacitor/Share without saving to the users device?
Great question 
, will get there soon 
Have you tried with a data URL?
const url = 'data:image/jpeg;base64,' + base64encodedImage
Or did you find another solution in the mean time?
↧
Show multi-page PDF inline with iOS native viewer?
Working proof-of-concept using Mozilla’s (non-native) PDFjs (with Svelte) in CapacitorJS:
import { getDocument } from 'pdfjs-dist';
// next line needed for pdfjs-dist to run
import { WorkerMessageHandler } from 'pdfjs-dist/build/pdf.worker.mjs';
export let base64Pdf;
let scale = 1.5;
let pdfContainer;
let errorMessage = '';
try {
pdfContainer.innerHTML = '';
const loadingTask = getDocument({ data: atob(base64Pdf) });
const pdfDocument = await loadingTask.promise;
for (let pageNum = 1; pageNum <= pdfDocument.numPages; pageNum++) {
const page = await pdfDocument.getPage(pageNum);
const viewport = page.getViewport({ scale });
const canvas = document.createElement('canvas');
const context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
const renderContext = {
canvasContext: context,
viewport: viewport
};
await page.render(renderContext).promise;
pdfContainer.appendChild(canvas);
// add a spacer between pages
const wrapper = document.createElement('div');
wrapper.style.backgroundColor = 'grey';
wrapper.style.padding = '10px';
pdfContainer.appendChild(wrapper);
}
} catch (err) {
errorMessage = err.message;
}
And printing is possible via HTML, too:
import { Printer } from '@bcyesil/capacitor-plugin-printer';
const dataUrl = canvas.toDataURL(); // Convert canvas to data URL
htmlString += `<img src="${dataUrl}" width="${canvas.width}" height="${canvas.height}" />`;
Printer.print({ content: htmlString }) }
It’s not native, but it works, therefore will set to resolved.
↧
