Quantcast
Channel: Ionic Framework - Ionic Forum
Viewing all 49526 articles
Browse latest View live

Does Exoplayer support with Ionic Framework?

$
0
0

Hello there,
Hope you are doing well.

With regards, we are developing a hybrid video news android app(from our app: we are going to distribute the hyperlocal video news feed to end-users, only video content).

For the above, we are looking to integrate Exoplayer(video player) and the technologies we are using to develop the Hybrid Android App are:
Ionic, Angular JS, Node JS & MySQL

My question is: Does Exoplayer support with Ionic Framework & other technologies we are using?

Will wait to hear from you

Thanks & Regards
Kumar Vansh Moondra

1 post - 1 participant

Read full topic


Ionic Capacitor razor pay

$
0
0

Hi All, how can I integrate razor pay payment gateway in ionic capacitor project.
there is a cordova plugin for that but i need to implement for ionic capacitor project

please help

thanks

2 posts - 2 participants

Read full topic

Account kit alternative

$
0
0

hey guys ! account kit is not available now . so someone can tell me to an alternative ?

1 post - 1 participant

Read full topic

Ionic emoji picker

$
0
0

Emoji picker with slides and tabs (like emoji picker on Whatsapp) for Ionic 4 & Ionic 5

1 post - 1 participant

Read full topic

Remove input bottom red border in Ionic 5

$
0
0
  • Ionic version: 6.10.1
  • @ionic-native/core: 5.27.0
  • @ionic/angular: 5.2.2
  • Angular version: 9.1.6

Screen Shot 2020-06-28 at 4.48.52 PM

How can I remove the bottom red border of the ion-input that appears when you click on it? It appears only if you click on the input, and stays there even if you click on the second input.

Only appears while using Android and Web. On iOS it’s not visible, which is good for me.

This is a new app and this red border seems to be a default behavior, but, why? Why it’s there? I couldn’t find an easy way to remove this.

<ion-content>
  <ion-list>
    <form>

      <ion-item>
        <ion-label position="fixed">Email</ion-label>
        <ion-input type="email" required>
        </ion-input>
      </ion-item>

      <ion-item>
        <ion-label position="fixed">Password</ion-label>
        <ion-input type="password" required>
        </ion-input>
      </ion-item>

    </form>
  </ion-list>
</ion-content>

I have tried a few solutions that I have found out there for Ionic 4, but, no luck so far.

Any help would be appreciated.

Thanks for all.

1 post - 1 participant

Read full topic

Ionic Capacitor Firebase Can't get video to work

$
0
0

Hi,
Hoping you can help? I am trying to create an app for my club. The idea is to store tutorial videos on Firebase storage and then call them as and when they are needed. I have been going round in circle for about a week now. I can get the player to work fine with a generic URL but as soon as I substitute it for the URL from firebase I get an error.
GET http://localhost:8100/[object%20Promise] net::ERR_ABORTED 404 (Not Found)
Uncaught (in promise) DOMException: Failed to load because no supported source was found.
Any ideas where I’m going wrong?

getvid3(){
this.res = firebase.storage().ref(‘Poomsae’).child(‘Poomsae1K.mp4’).getDownloadURL().then(res => console.log(res));
this._videoPlayer.initPlayer({mode: ‘fullscreen’, url: this.res});
}
}

1 post - 1 participant

Read full topic

Close ActionSheetController on Device back button click

$
0
0

Version details:
ionic version - “6.10.1”,
ionic-angular: “3.9.9”

Issue description:
On click photo or upload photo button to open a popup(I’m using ActionSheetController for popup) for capture image from gallery or using a camera,
then after click on the device’s back button to back on the last or previous page and it goes on the last or previous page but the popup is still open, it cants close.

I want to close the popup and then back the last or the previous page.

1 post - 1 participant

Read full topic

Android Studio isn't updating with latest code changes

$
0
0

Android Studio doesn’t seem to be reflecting changes made in the app. These changes show in the web version. As a test I made a slight change to the string inside an alert() popup but even that is not showing on the app in testing.

How can I get Android Studio and my test phone to recognize new code changes? I thought it was supposed to be automagic?

I’ve:

  • Run npx cap sync android
  • Uninstalled the app from my phone
  • Run Sync Project with Gradle Files
  • Reload All from Disk
  • Invalidated Caches/Restart
  • Run Build --> Rebuild project
  • Deleted the Android folder and re-ran ngx cap add android
  • Tried both a physical phone and an emulator

No luck.

1 post - 1 participant

Read full topic


Ionic router push same page

$
0
0

I’m using a ionic stencil starter pwa with ionic router .

I’m in a page and I need to push again that same page but with a different prop, so the page will be loaded from the start with the new prop and re-render.

I’m using

const navCtrl: HTMLIonRouterElement = await(this.nav as any).componentOnReady();
navCtrl.push("/pagename/" + prop + "/", "root"); 

if I’m in a different page, my push works correctly. the problem is when I’m in the same page, nothing happens.

Why this happens? there Is a way to make it works?

1 post - 1 participant

Read full topic

@ngx/translate ts1086: An accessor cannot be declared in an ambient context

Ionic 3 with platform add ios@6.0.0

$
0
0

my ionic info is

Ionic:

ionic (Ionic CLI) : 4.3.1
Ionic Framework : ionic-angular 3.9.6
@ionic/app-scripts : 3.2.1

Cordova:

cordova (Cordova CLI) : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : ios1 6.0.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 5.0.0, (and 26 other plugins)

System:

ios-sim : 8.0.2
NodeJS : v12.18.1 (/Users/admin/.nvm/versions/node/v12.18.1/bin/node)
npm : 6.14.5
OS : macOS
Xcode : Xcode 11.2.1 Build version 11B500

but still i get the error of

unable to load PlatformApi from platform. SyntaxError: Unexpected token …
Uncaught, unspecified “error” event. (The platform “ios” does not appear to be a valid cordova platform. It is missing API.js. ios not supported.)
any one can help me out this

1 post - 1 participant

Read full topic

Page is scrolling to bottom if previous page is scrolled to bottom

$
0
0

hey you guys, I have this annoying issue: I have a component listing some items. If I click the first item, the page displaying its info starts at the top just fine. If I scroll down and click the last item, or the item in the middle, the page displaying its info starts at the bottom/middle. I tried the following:

HTML file

<ion-content #content id="staticstart">
item info
</ion-content>

TS File

@ViewChild('content', {static: false}) private content: any;

ionViewWillEnter() {
        this.content.scrollToPoint(0, document.getElementById('staticstart').offsetTop, 300);
    }

but the page still starts at bottom/middle, depends on the item I click. Any thoughts? Thanks!

1 post - 1 participant

Read full topic

It is possible to Build application for IOS with Android plugins?

$
0
0

Hi, im developing an app for Android and IOS, im using Cordova-plugin-android-permissions to get phone’s UID, i read that for IOS i can get it using device object form codova
( device.uuid) and no permissions are needed, when i build IOS app an error apears:
Installing “cordova.plugin-android-permissions” for ios
[ERROR] An error occurred while running subprocess cordova.

should i generate another project for ios without android plugins? or
is there a way to exclude plugins in buils process?

Regards.

1 post - 1 participant

Read full topic

I need to implement search function in my app and am not sure how to do it

$
0
0

home.html


<ion-title *ngIf="!showSearchbar">

Likatkatә Miya Fal Hyel


<ion-buttons slot=“start” *ngIf="!showSearchbar">


<ion-searchbar [(ngModel)]=“searchTerm”
(ionChange)=“setFilteredItems()”
placeholder=“Search Song & title”
*ngIf=“showSearchbar”
showCancelButton= “always”
(ionCancel) = “showSearchbar=false”
>

<ion-buttons slot =“end” ion-button icon-only *ngIf="!showSearchbar" (click) =“showSearchbar=true”>



{{item.id}}

{{item.title}}

home.ts
import { Component, OnInit } from ‘@angular/core’;
import { DatabaseService, Song } from ‘…/services/database.service’;
import { Platform } from ‘@ionic/angular’;
import { HttpClient } from ‘@angular/common/http’;
import { Observable } from ‘rxjs’;

@Component({
selector: ‘app-home’,
templateUrl: ‘home.page.html’,
styleUrls: [‘home.page.scss’],
})
export class HomePage implements OnInit {

song: Song = ;

songs: Observable<any>;

public items: any = ;
public filterItems = ‘’;

showSearchbar: boolean;
constructor( public http: HttpClient, private db: DatabaseService, private platform: Platform) {
this.platform.ready().then(() => {
}).catch(error => {
console.log(error);
});
}

ngOnInit() {
this.setFilteredItems();
this.db.getDatabaseState().subscribe(rdy => {
if (rdy) {
this.db.getSong().subscribe(content => {
this.song = content;
});
}
});
}

setFilteredItems() {
this.items = this.db.filterSearch(this.filterItems);
}

}

//This what i have been doing from order tutorials on my db.ts page
filterItems() {
return this.database.executeSql('SELECT * FROM song ', ).then(data => {
const items: Song = ;
if (data.rows.length > 0) {
for (let i = 0; i < data.rows.length; i++) {
items.push({
id: data.rows.item(i).id,
title: data.rows.item(i).title,
verse1: data.rows.item(i).verse1,
verse2: data.rows.item(i).verse2,
verse3: data.rows.item(i).verse3,
verse4: data.rows.item(i).verse4,
verse5: data.rows.item(i).verse5,
verse6: data.rows.item(i).verse6,
});
}
}
this.items.next(items);
});

}

filterSearch(filterItems) {
return this.items.filter(items => {
return items.id.toLowerCase().indexOf(filterItems.toLowerCase()) > -1
|| this.items.title.toLowerCase().indexOf(filterItems.toLowerCase()) > -1;
});
}

Please help me, i want to filter the list of songs on the home page.

1 post - 1 participant

Read full topic

Ionic Application successfully compiles but cordova runtime issues

$
0
0

Currently, I have undertaken the task of upgrading my Ionic application from version 3 to Ionic 5, In the process, I have upgraded all the different breaking changes to the application, and I am able to successfully build the application using these commands:

ng serve
ionic build
ionic build -prod

Once I have no compilation errors I use the following command to build the android application to test the changes:

ionic cordova build android

Once I get the application running on my emulator I get the following logs of different errors. I found different references online that showed similar issues but I was not able to use any of the solutions on my application. I just want to know what may be causing these issues and how I can resolve them?

E/eglCodecCommon: GoldfishAddressSpaceHostMemoryAllocator: ioctl_ping failed for device_type=5, ret=-1
D/CordovaWebViewImpl: onPageDidNavigate(file:///android_asset/www/index.html)
D/EGL_emulation: eglMakeCurrent: 0xe5006e00: ver 3 0 (tinfo 0xcda96370)
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 1 2
D/EGL_emulation: eglMakeCurrent: 0xe5006e00: ver 3 0 (tinfo 0xcda96370)
D/EGL_emulation: eglMakeCurrent: 0xe5006e00: ver 3 0 (tinfo 0xcda96370)
W/VideoCapabilities: Unrecognized profile 4 for video/hevc
I/VideoCapabilities: Unsupported profile 4 for video/mp4v-es
W/cr_MediaCodecUtil: HW encoder for video/avc is not available on this device.
D/EGL_emulation: eglMakeCurrent: 0xe5006e00: ver 3 0 (tinfo 0xcda96370)
W/cr_CrashFileManager: /data/user/0/com.clinakos.clinakos/cache/WebView/Crash Reports does not exist or is not a directory
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 0 0
D/EGL_emulation: eglCreateContext: 0xcb74cdc0: maj 3 min 0 rcv 3
D/EGL_emulation: eglMakeCurrent: 0xcb74cdc0: ver 3 0 (tinfo 0xcda96840)
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 0 0
D/eglCodecCommon: setVertexArrayObject: set vao to 2 (2) 0 0
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 0 0
E/AndroidProtocolHandler: Unable to open asset URL: file:///android_asset/www/build/main.css
    Unable to open asset URL: file:///android_asset/www/build/main.js
E/AndroidProtocolHandler: Unable to open asset URL: file:///android_asset/www/build/vendor.js
E/AndroidProtocolHandler: Unable to open asset URL: file:///android_asset/www/build/polyfills.js
D/eglCodecCommon: setVertexArrayObject: set vao to 2 (2) 0 0
D/JsMessageQueue: Set native->JS mode to EvalBridgeMode
D/SystemWebChromeClient: file:///android_asset/www/cordova.js: Line 105 : Uncaught Error: cordova already defined
I/chromium: [INFO:CONSOLE(105)] "Uncaught Error: cordova already defined", source: file:///android_asset/www/cordova.js (105)
I/inakos.clinako: Background concurrent copying GC freed 21926(2031KB) AllocSpace objects, 3(60KB) LOS objects, 49% free, 1834KB/3MB, paused 1.849ms total 116.662ms
I/ShortcutBadger: Checking if platform supports badge counters, attempt 1/3.
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 0
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 5
I/ShortcutBadger: Checking if platform supports badge counters, attempt 2/3.
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
I/ShortcutBadger: Checking if platform supports badge counters, attempt 3/3.
W/ShortcutBadger: Badge counter seems not supported for this platform: unable to resolve intent: Intent { act=android.intent.action.BADGE_COUNT_UPDATE (has extras) }
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
    setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
    setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
    setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
    setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
D/eglCodecCommon: setVertexArrayObject: set vao to 0 (0) 4 3
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 4 9
    setVertexArrayObject: set vao to 0 (0) 4 3
D/SystemWebChromeClient: file:///android_asset/www/vendor.js: Line 31514 : Uncaught Error: Unexpected value 'SignaturePad' imported by the module 'SignupPageModule'. Please add a @NgModule annotation.
I/chromium: [INFO:CONSOLE(31514)] "Uncaught Error: Unexpected value 'SignaturePad' imported by the module 'SignupPageModule'. Please add a @NgModule annotation.", source: file:///android_asset/www/vendor.js (31514)
D/CordovaWebViewImpl: onPageFinished(file:///android_asset/www/index.html)
D/eglCodecCommon: setVertexArrayObject: set vao to 1 (1) 0 0
D/SystemWebChromeClient: file:///android_asset/www/vendor.js: Line 90553 : Ionic Native: deviceready event fired after 309 ms
I/chromium: [INFO:CONSOLE(90553)] "Ionic Native: deviceready event fired after 309 ms", source: file:///android_asset/www/vendor.js (90553)
E/AndroidProtocolHandler: Unable to open asset URL: file:///android_asset/www/assets/icon/favicon.ico```


dependencies:

"dependencies": {
    "@angular/common": "~9.1.6",
    "@angular/core": "~9.1.6",
    "@angular/forms": "~9.1.6",
    "@angular/platform-browser": "~9.1.6",
    "@angular/platform-browser-dynamic": "~9.1.6",
    "@angular/router": "~9.1.6",
    "@capacitor/core": "2.2.0",
    "@ionic-enterprise/cordova": "^9.0.3",
    "@ionic-native/background-fetch": "^5.27.0",
    "@ionic-native/background-mode": "^5.27.0",
    "@ionic-native/badge": "^5.27.0",
    "@ionic-native/camera": "^5.27.0",
    "@ionic-native/contacts": "^5.27.0",
    "@ionic-native/core": "^5.0.7",
    "@ionic-native/device": "^5.27.0",
    "@ionic-native/file": "^5.27.0",
    "@ionic-native/file-transfer": "^5.27.0",
    "@ionic-native/fingerprint-aio": "^5.27.0",
    "@ionic-native/firebase": "^5.27.0",
    "@ionic-native/http": "^5.27.0",
    "@ionic-native/in-app-browser": "^5.27.0",
    "@ionic-native/keyboard": "^5.27.0",
    "@ionic-native/local-notifications": "^5.27.0",
    "@ionic-native/splash-screen": "^5.0.0",
    "@ionic-native/status-bar": "^5.0.0",
    "@ionic/angular": "^5.0.0",
    "@ionic/storage": "2.1.3",
    "angular-signature-pad": "0.0.14",
    "cordova-android": "^9.0.0",
    "cordova-ios": "5.1.1",
    "cordova-plugin-add-swift-support": "^2.0.2",
    "cordova-plugin-advanced-http": "2.4.1",
    "cordova-plugin-background-mode": "^0.7.2",
    "cordova-plugin-badge": "^0.8.8",
    "cordova-plugin-camera": "^4.1.0",
    "cordova-plugin-compat": "^1.2.0",
    "cordova-plugin-contacts": "^3.0.1",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-file": "6.0.2",
    "cordova-plugin-fingerprint-aio": "^1.6.0",
    "cordova-plugin-firebase-lib": "^5.1.1",
    "cordova-plugin-inappbrowser": "^3.2.0",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-local-notification": "^0.9.0-beta.3",
    "cordova-plugin-okhttp": "^2.0.0",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "cordova-plugin-wkwebview-engine": "^1.2.1",
    "hammerjs": "^2.0.8",
    "rxjs": "~6.5.1",
    "rxjs-compat": "^6.5.5",
    "signature_pad": "^3.0.0-beta.3",
    "tslib": "^1.10.0",
    "zone.js": "~0.10.2"
  },

1 post - 1 participant

Read full topic


IonRouterOutlet doesn't works ... even if with a blank project

$
0
0

Hi, Ionic starting to drive me crazy !
I build an app, everything works perfectly ! On android, with ionic serve … but I wanted to publish it online too. It’s not the first time I did that, I never had any issues. Impossible, white page.

So, I tried to create a new clean project with the blank template. If I run ionic build, and I publish the build folder ( with a “homepage”: “build/”, in the package.json ) I have any error message and a white page.

I spend my afternoon to try to find the issue, if I change the redirect from :

<Route exact path="/" render={() => <Redirect to="/home" />} />

to

<Route path="/" render={() => <Redirect to="/home" />} />

Everything works. Problems, I have a lot of routes in my apps, so impossible to remove the exact.

Do you have any idea ?
Thanks

1 post - 1 participant

Read full topic

Embedded HTML page is not rendered on random iOS device

$
0
0

We embedded an HTML page in an app but occasionally/randomly on iOS device the embedded page section is not rendered and displayed as empty/blank page.
There is no error recorded in server or client side.
Current workaround is to restart the app and the page will be rendered correctly.

Any of you encounter this case before? or any advise on the specific area that we need to investigate further?

Thank you!

1 post - 1 participant

Read full topic

Where to buy app template

$
0
0

Hi Guys,
I have been using IONIC for 3 years plus… I am coming from the Web Application mostly doing Web ERP.

I just want to find out where is the better place or website to buy App template for IONIC ? Best if have the UI/UX where they are selling their products or sevices ?

I mostly buy the template from codecayon but they have limited selection.

thank you

1 post - 1 participant

Read full topic

V4 : ion-select native wheelselector for IOS

$
0
0

Hi,

For ion-select in IOS, i want to have wheelselector design to display which ios provides by default in their native application. Is there a way i can achieve this design without using the wheelselector plugin ?

1 post - 1 participant

Read full topic

IONIC 3 input field cursor is scrolled when we are scroll form

Viewing all 49526 articles
Browse latest View live


<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>