@Sweg wrote:

I am trying to run my ionic app using npx cap open android,

When I run ionic serve, my app appears.

But when I run npx cap open android, the “blank” ionic app that you start off with is displayed on my phone.

Can someone please tell me why this is? I’m definitely running the same projects also.

Posts: 1

Participants: 1

Read full topic

@SirSaren wrote:

Is possible entry to folder gallery for Android & iOs. I need to get name and size photo or image of gallery ?

Posts: 1

Participants: 1

Read full topic

@imdroid wrote:

Is Ionic studio subscription available as a solo item (outside of appflow / cloud services)?

Posts: 1

Participants: 1

Read full topic

@KevinR007 wrote:

I’m having the following issue:

• When launching the app, the splash screen appears. When the SplashScreen.hide(); is called the splash screen flickers and hides.

I need a solid solution for this fix, there are many comments on the internet that suggests using a setTimeout(), that won’t work for me because I can’t trust on a fixed time.

The code I’m using is pretty simple and straight forwards:

//Side info
import { Plugins } from '@capacitor/core';
const { SplashScreen } = Plugins;

//Using the Ionic InAppBrowser
constructor ( private iab: InAppBrowser)

ngOnInit() {
  this.platform.ready().then () => {
    const browser = this.iab.create('https://google.com', '_blank');
    browser.on('loadstop').subscribe( event => { SplashScreen.hide(); });
  });
}

Changing the SplashScreenDelay value has no effect, if anyone needs more information please let me know!

Posts: 1

Participants: 1

Read full topic

@tkclark wrote:

I updated to Xcode 11.4 and now my project won’t compile. I guess it’s a good idea not to update to the latest version right away?

Error I’m getting:
Thread 1: EXC_BAD_INSTRUCTION (code=EXC_I386_INVOP, subcode=0x0)

on file:
Pods>Development Pods>Capacitor>CAPBridge.swift>registerPlugins()

on this line:
let c: AnyClass = classes![i]

debug window says:

2020-03-24 17:52:14.159915-0400 App[53045:17186165] WF: === Starting WebFilter logging for process App
2020-03-24 17:52:14.160038-0400 App[53045:17186165] WF: _userSettingsForUser : (null)
2020-03-24 17:52:14.160149-0400 App[53045:17186165] WF: _WebFilterIsActive returning: NO
2020-03-24 17:52:14.190025-0400 App[53045:17186165] *** NSForwarding: warning: object 0x7fff89115030 of class 'PFEmbeddedMulticasterImplementation' does not implement methodSignatureForSelector: -- trouble ahead
2020-03-24 17:52:14.190217-0400 App[53045:17186165] *** NSForwarding: warning: object 0x7fff89115030 of class 'PFEmbeddedMulticasterImplementation' does not implement doesNotRecognizeSelector: -- abort

Anything I can do to fix? Wait for a capacitor update?

P.S. I am running an Ionic/Vue project if that matters.

Posts: 1

Participants: 1

Read full topic

@rafaelmoura wrote:

How I can get all IPs in Network with this plugin Hotspot in Ionic 3 ?

  getAllIps() {
    this.hotspot.getAllHotspotDevices() ...
  }

Posts: 1

Participants: 1

Read full topic

@kodis wrote:

Just wondering if there is any way to trigger a Popover on view init?

Basically it’s a tour functionality, so the first time a user goes to a screen the popover will automatically be displayed on a button. I was able to get it to automatically show a popover with the following code but it doesn’t get attached to the element, it just displays it in the middle of the screen.

preview.ts

// Import modules
import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import { NavController, ToastController, PopoverController } from '@ionic/angular';
import { PopoverSimpleComponent } from '../../components/popover-simple/popover-simple.component';

@Component({
	selector: 'app-preview',
	templateUrl: './preview.page.html',
	styleUrls: ['./preview.page.scss'],
})
export class ProgramPage implements OnInit {
	@ViewChild('addButton', { read: ElementRef, static: false}) addButton: ElementRef;

	constructor(
		public navCtrl: NavController,
		public toastCtrl: ToastController,
		public popoverCtrl: PopoverController
	) {
	}

	async ngOnInit() {
		this.presentPopover(this.addButton.nativeElement, 'Text instructions');
	}
}

preview.html (relevant component only)

<ion-button #addButton class="b-add-to-library" color="primary" size="small" (click)="addToLibrary($event)">
	<ion-icon name="add"></ion-icon>
	<ion-label>Add to Library</ion-label>
</ion-button>

Cheers!

Posts: 1

Participants: 1

Read full topic

@CHAEN wrote:

Hi guys!
Can’t I use an image instead of a checkbox in the ion-checkbox?
I am beginner. Please help me ;(

Posts: 1

Participants: 1

Read full topic

@Astrid5 wrote:

Hey guys, I need to make a selection between 3 dates values (today, this week, this month) or open a date picker to choose the date myself.

so, I thought about using ion-segment and ion-segment-buttons to do that, but so far I got this:

I wonder if ion-segment-button is the best choice for it (i think it is) and wich is the best way to style it. Here’s my code atm:

ion-segment-button {
    height: 40px;
    min-height: 40px;
    border-radius: 51px;
  }
  ion-segment-button.segment-button-checked {
    border-bottom: 2px solid;
    background: #ff9009;
    color: #FFFFFF !important;
  }

text-color is not applying… and the width is weird. Tips and solutions are apreciated.

Posts: 1

Participants: 1

Read full topic

@lily28 wrote:

Hi, I tried to make a login & register page using mysql and php as the backend, but the toast timeout (image 1 below) keep came out yet the data is been saved (image 2 below)

image 1

image284×501 11.7 KB

image 2

image691×48 5.96 KB

There is no error after click on the register button except Timeout alert, but there are few errors like this

image1060×705 26.1 KB

image990×22 1.03 KB

This is my code in login.page.html

<ion-header no-border>
  <ion-toolbar color="warning">
    <ion-title>Login</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list>
    <div class="">
      <ion-item>
        <ion-label position="floating">Email</ion-label>
        <ion-input type="text" [(ngModel)]="u_email_address"></ion-input>
      </ion-item>
    
      <ion-item>
        <ion-label position="floating">Password</ion-label>
        <ion-input type="password" [(ngModel)]="u_password"></ion-input>
      </ion-item>
      <br><br><br>
      <ion-button expand="block" class="ion-padding" color="warning" (click)="tryLogin()">Login</ion-button>
  </div>

    <p class="ion-text-center info-1">
      <br>Don't have an account? <span (click)="openRegister()">Register now</span>
    </p>
  </ion-list>
</ion-content>

register.page.html

<ion-header no-border>
  <ion-toolbar color="warning">
    <ion-title>Register</ion-title>
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list>
    <div class="">
      <ion-item>
        <ion-label position="floating">Name</ion-label>
        <ion-input type="text" [(ngModel)]="u_name"></ion-input>
      </ion-item>
    
      <ion-item>
        <ion-label position="floating">Email</ion-label>
        <ion-input type="text" [(ngModel)]="u_email_address"></ion-input>
      </ion-item>

      <ion-item>
        <ion-label position="floating">Password</ion-label>
        <ion-input type="password" [(ngModel)]="u_password"></ion-input>
      </ion-item>
    
      <ion-item>
        <ion-label position="floating">Confirm Password</ion-label>
        <ion-input type="password" [(ngModel)]="u_confirm_password"></ion-input>
      </ion-item>
      <br><br><br>
      <ion-button expand="block" class="ion-padding" color="warning" (click)="tryRegister()" [disabled]="disabledButton">Register</ion-button>
  </div>
  </ion-list>
</ion-content>

register.page.ts

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { ToastController, LoadingController, AlertController } from '@ionic/angular';
import { AccessProviders } from '../providers/access-providers';

@Component({
  selector: 'app-register',
  templateUrl: './register.page.html',
  styleUrls: ['./register.page.scss'],
})
export class RegisterPage implements OnInit {

  u_name          : string = "";
  u_email_address : string = "";
  u_password      : string = "";
  u_confirm_password : string = "";

  disabledButton;

  constructor(
    private router : Router,
    private toastCtrl : ToastController,
    private loadingCtrl : LoadingController,
    private alertCtrl : AlertController,
    private accsPrvds: AccessProviders
  ) { }

  ngOnInit() {
  }

  ionViewDidEnter(){
    this.disabledButton = false;
  }

  async tryRegister(){
    if(this.u_name == ""){
      this.presentToast('Name is required');
    }else if(this.u_email_address == ""){
      this.presentToast('Email is required');
    }else if(this.u_password == ""){
      this.presentToast('Password is required');
    }else if(this.u_confirm_password != this.u_password){
      this.presentToast('Password are not the same');
    }else{
      this.disabledButton = true;
      const loader = await this.loadingCtrl.create({
        message: 'Please wait a moment...',
      });
      loader.present();

      return new Promise(resolve =>{
        let body = {
          aksi: 'proses_register',
          u_name: this.u_name,
          u_email_address: this.u_email_address,
          u_password: this.u_password
        }

        this.accsPrvds.postData(body, 'proses_api.php').subscribe((res:any)=>{
          if(res.success==true){
            loader.dismiss();
            this.disabledButton = false;
            this.presentToast(res.msg);
            this.router.navigate(['/login']);
          }else{
            loader.dismiss();
            this.disabledButton = false;
            this.presentToast(res.msg);
          }
        },(err)=>{
          loader.dismiss();
          this.disabledButton = false;
          this.presentAlert('Timeout');
        });
      });
    }
  }

  async presentToast(a){
    const toast = await this.toastCtrl.create({
      message : a,
      duration: 1500,
      position: 'top'
    });
    toast.present();
  }

  async presentAlert(a){
    const alert = await this.alertCtrl.create({
      header: a,
      backdropDismiss: false,
      buttons: [
      {
        text: 'Close',
        handler: (blah) => {
          console.log('Confirm Cancel: blah');
          //action
        }
      }, {
          text: 'Try Again',
          handler: () => {
            this.tryRegister();
          }
        }
      ]
    });
    await alert.present();
  }
}

access-providers.ts

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders, HttpErrorResponse } from '@angular/common/http';
import { map } from 'rxjs/operators';
import { timeout } from 'rxjs/operators'; 

@Injectable()
export class AccessProviders {
    //url backend api json
    server: string ='http://localhost/login-register-home/api/';

    constructor(public http: HttpClient){}

    postData(body, file){
        let headers = new HttpHeaders({
            'Content-Type' : 'application/json; charset=UTF-8'
        });
        let options = {
            headers: headers
        }

        return this.http.post(this.server + file,JSON.stringify(body), options)
        .pipe(timeout(59000))// 59 sec timeout
        .pipe(map(res => res));
    }
}

Does anyone how to fix this ? Thank you

Posts: 1

Participants: 1

Read full topic

@salad-gg wrote:

I have tried most options to change the color of header and buttons in ion-alert. What could be the solution?

async resetPin() {
const alert = await this.alertController.create({
header: ‘Reset Pin’,
cssClass:‘alertHeader’,
inputs: [
{
name: ‘phone’,
type: ‘number’,
placeholder: ‘Enter phone number’
}
],
buttons: [
{
text: ‘Cancel’,
role: ‘cancel’,
cssClass: ‘alertButton’,
handler: (blah) => {
alert.dismiss();
}
}, {
…
…

c.scss

.alertHeader {
color: #b52024 !important;
// --color: #b52024 !important;
}
h2.alertHeader {
color: #b52024 !important;
// --color: #b52024 !important;
}

//this works for alertHeader when inspecting in the browser
.alert-sub-title.sc-ion-alert-md, .alert-title.sc-ion-alert-md {
color: #b32224;
}

Posts: 1

Participants: 1

Read full topic

@jhoncbernal wrote:

I had problems with react in ionic to use de File transfer someone can help me?

import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';
export class FileFormPage extends React.Component<{},
    {   http:HTTP,
        file: any,
        showToast1: boolean,
        loginMessage: string,
        hiddenbar: boolean,
    }> {
    constructor(props: any,private http: HTTP,private transfer: FileTransfer) {
        super(props);
        this.state = {
            http:http,
            file: '',
            showToast1: false,
            loginMessage: '',
            hiddenbar: true,
        }
    }
    async handleSubmit(e: FormEvent) {
        e.preventDefault();
        try {
            const fileTransfer: FileTransferObject = **this.transfer.create();** "Cannot read property 'create' of undefined"
 or if i change the import 
> TypeScript error in /Users/jhoncasallas/Documents/OwnCode/VecinoIonic/src/components/FileForm.tsx(22,69):
> Cannot find module '@ionic-native/file-transfer/ngx'.  TS2307
>     20 | import { execFile } from 'child_process';
>     21 | import { File } from '@ionic-native/file';
>   > 22 | import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer/ngx'

Posts: 2

Participants: 2

Read full topic

@AvkAvk wrote:

if its possible . put ting a button with WhatsApp or Facebook messenger direct link, that would open the contact directly, so the user can talk to the clinic through video chat

please suggest me for ionic developer .

Posts: 4

Participants: 2

Read full topic

@marcinni2 wrote:

Hi,

I was developing the Ionic App - I am a beginner after cash course and I have some doubts - if You could advise me something, regarding Generating the App.

I’ve generated one, it was working, then I’ve tried put it on Google Play and:

Package “io.ionic.starter” exists on Google Play, but I was changing the name of the app everywhere, where it was recommended during the courses.

Ok, after that, I changed “io.ionic.starter” everywhere, using Search Tool. But… It stopped working well. I think that I made some mistakes. If You could tell me - where should be App name and where should be “io.ionic.starter” or something like that.

capacitor.config.json:

{
  "appId": "com.sportigio.smartclub",
  "appName": "SmartClub",

config.xml

<widget id="com.sportigio.smartclub" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">

    <name>SmartClub</name>

build.gradle

android {
    compileSdkVersion 28
    defaultConfig {
        applicationId "com.sportigio.smartclub"
        minSdkVersion 21
        targetSdkVersion 28
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }

AndroidManifest.xml

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.sportigio.smartclub">

 <activity
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale"
            android:name="com.sportigio.smartclub.MainActivity"

MainActivity.java

package com.sportigio.smartclub;

strings.xml

<resources>
    <string name="package_name">com.sportigio.smartclub</string>
    <string name="custom_url_scheme">com.sportigio.smartclub</string>
</resources>

However, I see the folder in Android Studio, called io.ionic.starter and I am unable to change the name of this folder:

---

2. What is the correct workflow when I update my App?

When I was generating my App first time I did in this order:

ng build --prod

ionic capacitor sync android

ionic capacitor open android

When I was updating something - I did everything once again - start from “ng build --prod”.
Is it correct or what should I type when app is already generated, but I want to change something.

I hope You understand my problem and You will help me with my IONIC understanding - thanks in advance!

Posts: 1

Participants: 1

Read full topic

@Lyhout wrote:

Hi dear, I got some feedback from Apple about my delivery app to App Store.
Here is :
ITMS-90338: Non-public API usage - The app references non-public selectors in Pencil Portal: _setAlwaysRunsAtForegroundPriority:. If method names in your source code match the private Apple APIs listed above, altering your method names will help prevent this app from being flagged in future submissions. In addition, note that one or more of the above APIs may be located in a static library that was included with your app. If so, they must be removed. For further information, visit the Technical Support Information at http://developer.apple.com/support/technical/

I don’t how to fix it. because I’m fresher with app store deploying.

Posts: 1

Participants: 1

Read full topic

@Lyhout wrote:

Hello Y’all, I got some feedback from Apple when I delivery the app to App Store.
ITMS-90683: Missing Purpose String in Info.plist - Your app’s code references one or more APIs that access sensitive user data. The app’s Info.plist file should contain a NSPhotoLibraryUsageDescription key with a user-facing purpose string explaining clearly and completely why your app needs the data. Starting Spring 2019, all apps submitted to the App Store that access user data are required to include a purpose string. If you’re using external libraries or SDKs, they may reference APIs that require a purpose string. While your app might not use these APIs, a purpose string is still required. You can contact the developer of the library or SDK and request they release a version of their code that doesn’t contain the APIs. Learn more (https://developer.apple.com/documentation/uikit/core_app/protecting_the_user_s_privacy).

How do I fix it?
please help

Posts: 2

Participants: 2

Read full topic

@mbithik wrote:

I have created a tabs page in ionic v4 but every-time I navigate to the tabs page it goes straight to the default page. for example, if my tabs page is set up as below

<ion-tabs>

  <ion-tab-bar slot="bottom" color="primary">
    <ion-tab-button tab="tab1">
      <ion-icon name="home"></ion-icon>
      <ion-label>Home</ion-label>
    </ion-tab-button>

    <ion-tab-button tab="tab2">
      <ion-icon name="apps"></ion-icon>
      <ion-label>Feed</ion-label>
    </ion-tab-button>

    <ion-tab-button tab="tab3">
      <ion-icon name="settings"></ion-icon>
      <ion-label>Settings</ion-label>
    </ion-tab-button>
  </ion-tab-bar>

</ion-tabs>

and routing like

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { TabsPage } from './tabs.page';

const routes: Routes = [
  {
    path: 'tabs',
    component: TabsPage,
    children:
      [
        {
          path: 'tab1',
          children:
            [
              {
                path: '',
                loadChildren: '../tab1/tab1.module#Tab1PageModule'
              }
            ]
        },
        {
          path: 'tab2',
          children:
            [
              {
                path: '',
                loadChildren: '../tab2/tab2.module#Tab2PageModule'
              }
            ]
        },
        {
          path: 'tab3',
          children:
            [
              {
                path: '',
                loadChildren: '../tab3/tab3.module#Tab3PageModule'
              }
            ]
        },
        {
          path: '',
          redirectTo: '/tabs/tab1',
          pathMatch: 'full'
        }
      ]
  },
  {
    path: '',
    redirectTo: '/tabs/tab1',
    pathMatch: 'full'
  }
];

@NgModule({
  imports:
    [
      RouterModule.forChild(routes)
    ],
  exports:
    [
      RouterModule
    ]
})
export class TabsPageRoutingModule {}

if I attempt to navigate to ‘/tabs/tab1’ the page tab1 is loaded and the tabs bar is not displayed

after further test the tabs only works when it is the default on app-routing.module

import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';

const routes: Routes = [
  {
    path: '',
    loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule)
  }
];
@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {}

if at all you have other routes especially when empty path redirects to a different page, tabs doesn’t work as expected

Posts: 1

Participants: 1

Read full topic

@Pratikjaiswa15 wrote:

I am a firebase phone authentication in my ionic app. After success, I redirect users to details page which asks the user for name and email. But there is a strange problem. After redirecting, the formcontrols name and email are always invalid even though the right values are typed. If I refresh the page then, it is working fine.

I can’t get what is going wrong. I have used invisible ReCaptcha for firebase phone authentication if that matters

Thank you in advance here is the code

.ts

userDetails = this.fb.group({
    name : ['', [Validators.required, Validators.minLength(3), Validators.maxLength(30), Validators.pattern('[a-zA-Z ]*') ] ],
    Email : ['', [ Validators.required , Validators.pattern('^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}
```) ]],
  })

 submit(email, name ){

    console.log(email)
    console.log(name)

}

.html

 <form [formGroup] = "userDetails">

      <ion-card>
        <ion-item>
            <ion-label position="floating">Enter your name</ion-label>
            <ion-input formControlName = "name" type = "text"></ion-input>
        </ion-item>
        <div style="color:red; padding-top: 0.2rem" *ngIf= "name.invalid && name.touched">
          <small *ngIf = "name.errors?.required"  class="text-danger"> name is required</small>
          <small *ngIf = "name.errors?.minlength" class="text-danger"> name must be at least 3 characters </small>
          <small *ngIf = "name.errors?.pattern" class="text-danger"> Enter valid name </small>

       </div>
          <br>
        <ion-item>
        <ion-label position="floating">Enter your email </ion-label>
          <ion-input formControlName = "Email" type = "text"></ion-input>
        </ion-item>

          <div style="color:red; padding-top: 0.2rem" *ngIf= "Email.invalid && Email.touched">
          <small *ngIf = "Email.errors?.pattern" class="text-danger"> Enter a valid email address </small>

          </div>

          <br>
          <br>
          <ion-button type="submit" [disabled]="!userDetails.valid" (click)="submit(Email.value, name.value )">Submit</ion-button>
        </ion-card>


      </form>

Sometimes it also shows this error

Uncaught (in promise) Timeout (g)

Posts: 1

Participants: 1

Read full topic

@shoakbar wrote:

I created app (shopping cart).How I can send data from app to Telegram or Gmail.In my app selecting products, I must know who is select and how many products selected.I hope I clarified the essence

Posts: 1

Participants: 1

Read full topic

@mehraj786 wrote:

issue1138×543 55.3 KB

i am getting error when i click on prescription here i am using model i dont know what error it is from past 1 week having this issue can anyone know the solution…

Posts: 1

Participants: 1

Read full topic