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

Ionic notifications like whatsapp calls


Problem with emulating Android

$
0
0

@Llarian wrote:

Hi,

I had the idea of emulating my app in an Android Studio AVD, went through the usual stuff, finally got the emulator up and running but had no idea on how to put the app into the emulator.
After the next PC boot when I enter ‘ionic cordova emulate android’ in VS Code, the emulator console window pops up for some milliseconds and VS Code gives the following outpit:

Waiting for emulator to start...

WARNING: FeatureControlImpl.cpp:199: Failed to load advanced feature default setting:G:\Android\android-sdk\emulator\lib\advancedFeaturesCanary.ini
emulator: WARNING: Couldn't find file G:\Android\android-sdk\emulator\lib\ca-bundle.pem

emulator: Requested console port 5584: Inferring adb port 5585.
emulator: WARNING: encryption is off
HAX is working and emulator runs in fast virt mode.
qemu: could not load PC BIOS 'bios-256k.bin'
Warning: QObject::
INFO: QtLogger.cpp:66: Warning: QObject::~QObject: Timers cannot be stopped from another thread ((null):0, (null))


~QObject: Timers cannot be stopped from another thread ((null):0, (null))

What is my problem, how to get it running again and when it is, how to put my app into the emulator to debug it?

Posts: 1

Participants: 1

Read full topic

Scrolling appears at the bottom of the ion-header

Base64 - Not allowed to load local resource

$
0
0

@marie_fashion wrote:

Hello! I am trying to convert a file to base64 using this plugin (https://ionicframework.com/docs/native/base64/). I am using the code as described

let filePath: string = 'file:///...';
this.base64.encodeFile(filePath).then((base64File: string) => {
  console.log(base64File);
}, (err) => {
  console.log(err);
});

When I import it with the /ngx extension I get the following error by running: ionic Cordova iOS build:

[12:38:36]  typescript: src/pages/contact/contact.ts, line: 9 
            Cannot find module '@ionic-native/base64/ngx'. 

       L8:  import { File } from '@ionic-native/file';
       L9:  import { Base64 } from '@ionic-native/base64/ngx';

[12:38:36]  ionic-app-script task: "build" 
[12:38:36]  Error: Failed to transpile program 

So I removed the /ngx and did:

import { Base64 } from '@ionic-native/base64';

But when I try to execute this function I get the following error:

Not allowed to load local resource: file:////var/mobile....

I also tried removing the file:/// parameter which ends up in cannot load http://localhost:8080/var/m. But his is also not like it should be used like mentioned here: stackoverflow.

my config is as follow:


Ionic:

   ionic (Ionic CLI)  : 4.7.1 (/usr/local/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.1

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.3.1, (and 9 other plugins)

System:

   ios-deploy : 1.9.4
   NodeJS     : v11.6.0 (/usr/local/bin/node)
   npm        : 6.7.0
   OS         : macOS Mojave
   Xcode      : Xcode 10.1 Build version 10B61

So mentioned to the plugin described here: https://github.com/hazemhagrass/phonegap-base64:

for Cordova >= 5.0.0
cordova plugin add com-badrit-base64

It should work like mentioned in the documentation? My plugin version is com-badrit-base64 0.2.0 “Base64”. Help is really appreciated. Also an alternative way in converting an audio file to base64. Thanks.

Posts: 1

Participants: 1

Read full topic

Alphabetically - scrollbar

After selecting the value from popup, the pop up is still displayed on the UI

$
0
0

@kunalinfo wrote:

After selecting the value from popup, the pop up is still displayed on the UI. i used popoverController from the ionic , when i m selecting any value from pop-up … the value get selected but pop-up didn’t get closed it is there on the page only. but second time if select anything the popup get closed.

Posts: 1

Participants: 1

Read full topic

Ionic app optimization

$
0
0

@Spsahu wrote:

Hi Team,

Is there any way in Ionic to minify the ts and css file.
As in angular web application, we do minify before pushing the app in prod.

Please help, it will solve my production issue.

Thanks

Posts: 1

Participants: 1

Read full topic

Hide Ionic tabs and Toolbar on botton click [Ionic 4.0.0]

$
0
0

@TrulsLoug wrote:

Hi, I was wondering if its possible to hide the Ion-tabs and Ion-toolbar on a button click.

   async toggleFullScreen() {
    const loading = await this.loadingCtrl.create({
      message: "",
      spinner: "lines",
      duration: 2000
    });
    await loading.present();
    const style = document.getElementById("full").style;
    await this.platform.ready();
    const [ data, color] = this.fullscreen === "all" ?
      ["true", "on", "#f2af46"] :
      ["false", "off", "transparent"];
       //TODO write code that hides toolbar and tabs
       //
       //
       //
      loading.dismiss();
     
    localStorage.setItem("Fullbutton", this.fullscreen = data);
    style.backgroundColor = color;
  }

I’d like to run a function like this on a button click, I’ve seen a few posts but they all seem to be about hiding the toolbar/tabs on ngViewDidEnter (Example)
I’d like to keep the tabs and toolbar until the button was clicked.

Any help or resources that could help with my issue would be greatly appreciated!

Posts: 1

Participants: 1

Read full topic


Force update app

Ionic 3: Part of css not working on Android platform

$
0
0

@rhanesoghlyan wrote:

After building app for Android platform part of css not working.
We didn’t change any dependencies. And problem we have only in some Android devices.

For example we have 2 Samsung Galaxy s8 devices (Android version - 8.0.0)
In one device it works but in other not

in iOS platform all works well

Posts: 1

Participants: 1

Read full topic

How to set styling in ionic 4 by default either Iphone app style or android

$
0
0

@albincs wrote:

Please try this in your index.html file

I tried the below html code in

ionic 4

and it works

Use the below one for getting styled your apk same as ios.

<html lang=“en” dir=“ltr” class=“plt-iphone plt-ios plt-phablet plt-mobile ios” mode=“ios”>

Use the below one for getting styled your ios app same as android.

<html lang=“en” dir=“ltr” class=“plt-android plt-mobile md” mode=“md”>

Posts: 1

Participants: 1

Read full topic

Style broken in android apk build

$
0
0

@tom5677 wrote:

I’m working on a ionic v3 app which were actually already working on ios and android.
Suddenly in the native android app the style is broken. It seems, that some css stylings are not applied.
I’ve tried already lot of things:

  • tried on different android device
  • debug and prod build
  • build locally and via ionic pro
  • remove add android platform
  • upgrade cordova-plugin-ionic-webview to 2.1.0
    No success.
    No error in build process identified.
My ionic info

Ionic:

   ionic (Ionic CLI)  : 4.8.0 (C:\Users\tk\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.1

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.4
   Cordova Plugins       : cordova-plugin-ionic 4.2.0, cordova-plugin-ionic-webview 2.0.0, (and 7 other plugins)

System:

   Android SDK Tools : 26.1.1 (C:\Users\tk\AppData\Local\Android\Sdk)
   NodeJS            : v6.11.4 (C:\Program Files\nodejs\node.exe)
   npm               : 3.10.10
   OS                : Windows 10

This is from ionic serve and OK

This is from an android device where the style is broken.

Cheers,Tom

Posts: 1

Participants: 1

Read full topic

How to retrieve objects using ionic & angular

$
0
0

@issamahwach wrote:

Hello Everyone,
I’m building a small game that contains a background (table) and four players on it .
I have two buttons (next & previous) when I click next I need to highlight the next player icon (replace the old icon with highlighted one).
the default highlighted icon is for player1.
I’m thinking of a way that can retrieve the next player to highlight it’s icon.

home.html

<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding class="bg-image">
  <ion-grid>
    <ion-row>
      <ion-col>
          <div class="player2" (click)="player2btn()">
            <br><br>
              <img src="assets/imgs/player-2.png" width=100 height=100 id="playert" name="playert">
          </div>
      </ion-col>
      <ion-col>

        <div class="playernamebox">
            <img src="assets/imgs/player name box.png">
        </div>
      </ion-col>
      <ion-col>
        <div class="player3" (click)="player3btn()">
          <br><br>
            <img src="assets/imgs/player-3.png"width=100 height=100>
        </div>
      </ion-col>

    </ion-row>
    <ion-row>
        <div *ngIf="hideme" class= "file" width=50 height=50>
            <img src="assets/imgs/file.png">
            <div class="player-description">{{playernum}}
              <img src="assets/imgs/ok btn.png">
            </div>
            
          </div>
    </ion-row>
    <ion-row>
    <ion-col>
        <div class="player1" (click)="player1btn()">
          <br><br>
            <img src="assets/imgs/player-1h.png" width=100 height=100>
        </div>
      </ion-col>
      <ion-col>
          <div class="player4" (click)="player4btn()">
            <br><br>
              <img src="assets/imgs/player-4.png"width=100 height=100>
          </div>
        </ion-col>
      </ion-row>
      <ion-row>
        <ion-col>
            <div class="previous">
              <br><br>
                <img src="assets/imgs/previous button.png"width=60 height=70>
            </div>
          </ion-col>
          <ion-col>
              <div class="next">
                <br><br>
                  <img src="assets/imgs/next button.png"width=60 height=70 ng-click="selectnext()">
              </div>
            </ion-col>
          </ion-row>
  </ion-grid>
</ion-content>

home.ts

import { Component } from '@angular/core';
import { NavController , NavParams} from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  hideme: boolean;
  name: string;
  playernum:string;
  player1flag: boolean;
  player2flag: boolean;
  player3flag: boolean;
  player4flag: boolean;
  id: number;


  player1btn(){
    this.playernum="P1";
    this.hideme= !this.hideme;
    
  }
  
  player2btn(){
    this.playernum="P2";
    this.hideme= !this.hideme;
    
  }
  player3btn(){
    this.playernum="P3";
    this.hideme= !this.hideme;
    
  }
  player4btn(){
    this.playernum="P4";
    this.hideme= !this.hideme;
    
  }
  nextbtn(){
    this.id=this.id+1;
    switch (this.id){
case 1:{

  break;
}
    }


  }

  constructor(public navCtrl: NavController,public NavParams:NavParams) {
this.player1flag =true;
    
  }
 
}

Posts: 1

Participants: 1

Read full topic

Google plus shutting down

$
0
0

@obinnae wrote:

With the pending shutdown of Google+ in March/April, does that mean the Google+ login plugin would stop working? Would there be another way to authenticate Google?

Posts: 1

Participants: 1

Read full topic

How to check my app 64-bit hardware compatibility or not?

$
0
0

@flycoders_sourav wrote:

how to check my app 64-bit hardware compatibility or not? because google play has changed their policy. please help me out any help would be highly appreciated

Please help @Sujan12

Posts: 1

Participants: 1

Read full topic


Ionic: Widgets

$
0
0

@Llarian wrote:

Hi there,

as far as I know there is no official way to create a widget with Ionic.
I need a widget that has no more functionality than displaying some status values from my app.

Shouldn’t it be possible to create a native widget, using Android Studio or something, send a completely composed Html including the values via intent, let the widget receive and display it?
I have never worked with intents, is it possible to create one without any needed interaction with the user and restrict it to only work between my widget and my app?

In case the described communication is possible shouldn’t it then also be possible to create a widget with some more functionality like reacting to a click and send a message to the app triggering an action? Like using a RPC?

Or are these thoughts complete nonsense?

Posts: 1

Participants: 1

Read full topic

Ionic app post json to gmap

$
0
0

@thecrowjulian wrote:

Hi there to all!
Im developing an app with ionic v2 and im facing a problem that i cant resolve.
My aplication is supposed to track the location of several users and display the tracking on a gmap on an admin website, Is there a possibility of storing the lat and lng values in a json and then post that json x times a day to the gmap on the admin web page? Is this possible? Any help will be appreciated. Thanks in advance.

Posts: 1

Participants: 1

Read full topic

Error trying to read NFC card on Ionic 3

$
0
0

@derman10 wrote:

I’m stuck for weeks trying read NFC card from my ionic project.

Running the app on a real device (Samsung S7 Edge with Android).

I’m following this:

Then, I installed the plugin on my project:

ionic cordova plugin add phonegap-nfc

npm install @ionic-native/nfc

Only need read the Card Tag Id into the variable tagId (string) to show it.

My source:

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { NFC, Ndef } from '@ionic-native/nfc/ngx';

@NgModule({
  declarations: [
    MyApp,
    HomePage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    NFC,
    Ndef,
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

home.ts

import { Component } from '@angular/core';
import { NavController, Platform, AlertController, ToastController } from 'ionic-angular';
import { NFC, Ndef } from '@ionic-native/nfc/ngx';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  tagId: string;

  constructor(public platform: Platform,
              private alertCtrl: AlertController, 
              private toastCtrl: ToastController,
              public navCtrl: NavController, 
              private nfc: NFC,
              private ndef: Ndef) {

    this.platform.ready().then(() => { 
      this.addListenNFC();
    });

  } // del constructor

    addListenNFC() {
      console.log('entra a addListenNFC');

      this.nfc.addNdefListener(() => {
        console.log('successfully attached ndef listener');
      }, (err) => {
        console.log('error attaching ndef listener', err);

        let toast = this.toastCtrl.create({
          message: err,
          duration: 1000,
          position: 'bottom'
        });

        toast.present(); 

      }).subscribe((event) => {
        console.log('received ndef message. the tag contains: ', event.tag);
        console.log('decoded tag id', this.nfc.bytesToHexString(event.tag.id));
      
        let toast = this.toastCtrl.create({
          message: this.nfc.bytesToHexString(event.tag.id),
          duration: 1000,
          position: 'bottom'
        });

        toast.present(); 

      });

    }
 
}

home.html

<ion-content padding>
<h1>Please Scan Access Card</h1>
<ion-card>
<ion-card-content>
<p>Account Tag ID: {{ tagId }}</p>
</ion-card-content>
</ion-card>
</ion-content>

I’m getting the following error in the console:

Why do I get this error when adding the listener?
What is wrong??

Thanks.

Posts: 1

Participants: 1

Read full topic

Dissappointed with Ionic support and the forums

$
0
0

@mrchrisf wrote:

Definitely dissappointed with Ionic support for free accounts and the Forum.

  1. Forum: Posted a question on the forum 9 days ago and no replyies. Had to figure out the problem for myself. This is one reason I don’t generally like forums as “support”: no replies, or unreliable replies. I recognize that I might have created this issue by my own dumbness, but at least someone could have responded to tell me I’m an idiot!
<ol>
<li>Forum: Posted a question on the forum 9 days ago and no replys. Had to figure out the problem for myself. This is one reason I don't generally like forums as "support". No replies, or unreliable replies.</li>
<li>Support: Received a non-answer to a problem with Creator stuck in 'saving' mode. I was told to delete a complex app in Creator and continue editing in the CLI.  What good is Creator if I have to use the CLI anyway.?</li>
</ol>

Probably will not be accessing Support, or the Forum anytime in the near future.

Posts: 1

Participants: 1

Read full topic

Trying to update cordova-plugin-ionic-webview to 2.3.1

$
0
0

@mamzellejuu wrote:

I know that we need to update the cordova-plugin-ionic-webview for security issue.

I have to support IOS 10.

I have in my config.xml
<plugin name="cordova-plugin-ionic-webview" spec="2.3.1"> <variable name="ANDROID_SUPPORT_ANNOTATIONS_VERSION" value="27.+" /> </plugin>

but I have problem when i run
ionic cordova platform add ios@4.5.4

it update the plugin to 3.1.1 automatically and update my package.json to 3.1.1 also.

Do someone know why it doesn’t respect my fixed version ?

Posts: 1

Participants: 1

Read full topic

Viewing all 48979 articles
Browse latest View live