Quantcast
Channel: Ionic Forum - Latest posts
Viewing all 231634 articles
Browse latest View live

[Ionic Tutorial] Beautiful Custom Tabs with Custom Icons

$
0
0

@reinerluke97 the only cosmetic fix i can see is possibly removing the ripple effect from tab button 3 and adding it to the custom middle button so it more accurately appears to be the point of interaction


Upgrade to WKWebView causes API calls to fail: 401 Unauthorized

$
0
0

Due to Apple’s upcoming deprecation of UIWebView we are updating our Ionic mobile app to use WKWebView.

API calls to an MVC web application requiring authentication fail, returning 401 Unauthorized. These calls were successful using UIWebView. As WKWebView forces CORS, we are assuming the errors are caused by malformed CORS settings but have not found the root cause or solution. We have tried updating the CORS settings in the servers side API controllers, Global.asax, and web.config as well as the Ionic code.
We do have full control of both server and client side code. Has anyone in this forum experience with this type of setup?

Ionic 4 back button not working

Ionic 4 - Nested Tabs Relative Routes

$
0
0

Hi @mrbhaskar ,
Could you please help me to resolve what is “tabPath” in the code because it is unrecognised for me.

Electron - falling at the first hurdle

$
0
0

Changing the base href either manually or via an environment/build setting is the generally accepted way to get apps to function under Electron. I haven’t run into any issues personally doing so.

How to add/override platform files during AppFlow build?

$
0
0

Well, I’ve found a good way achieving it through config.xml file.

Under the relevant platform (Android in my case) I’ve added a directive per file which did the work:

<resource-file src="resources/google-services.json" target="app/google-services.json" />
<resource-file src="resources/gradle.properties" target="gradle.properties" />
<resource-file src="resources/project.properties" target="project.properties" />
<source-file src="resources/Capture.java" target-dir="app/src/main/java/org/cordova/mediacapture" />

BR,
Amit

Capacitor add Plugin from local Folder

Dark Mode not working for ionic 5

$
0
0

My project is working in windows dark mode toggle but not working at Android device. What changes i need to do?


HTML and css

$
0
0

What is the question? Did you mean to post the v1 forum?

How do I increase the "" active segment border width in Ionic segment?

$
0
0

can you make a simple demo of this? It’s a bit hard to know what doesn’t work without it

Not able to use capacitor community plugins

$
0
0

Make sure you have done the following steps in your project file:

  • npm i capacitor-rate-app
  • npx cap sync

Now open your android platform project (npx cap open android) and see if that solved your issue, if not please reply.

How to round the top edges of the page?

$
0
0

How to round the edges of the page without breaking the transition animations? It happens when I use the CSS below but the animations are broken.

ion-content {
  border-top-left-radius: 5% !important;
  border-top-right-radius: 5% !important;
  -webkit-border-top-left-radius: 5% !important;
  -webkit-border-top-right-radius: 5% !important;
  overflow: hidden !important;
  -webkit-backface-visibility: hidden !important;
  -moz-backface-visibility: hidden !important;
  -webkit-transform: translate3d(0, 0, 0) !important;
  -moz-transform: translate3d(0, 0, 0) !important;
}

Ionic 4 - Nested Tabs Relative Routes

$
0
0

The tabPath is just a local variable that keeps the url path of the current section e.g. “private tabPath = ‘private/interaction/customers/’;”
The tab part is just the sub section so the full path would resolve to “private/interaction/customers/search’;”

Hardware back button with Ionic 4 Disable

$
0
0

Thank you! It’s working for me.

Ion-radio buttons not selecting

$
0
0

Hello! I’m having trouble using (ionSelect) in my Ion Radio Group. I have three choices and placed ionSelect in a different area for each choice to find the correct placement - but it’s not firing! Here is my code:

      <ion-radio-group [(ngModel)]="paymentType" (ionSelect)="paymentChosen()">
        <ion-item lines="none">
          <ion-label lines="none">Cash</ion-label>
          <ion-radio slot="start" value="cash" (ionSelect)="paymentChosen()"></ion-radio>
        </ion-item>
        <ion-item lines="none">
          <ion-label lines="none" (ionSelect)="paymentChosen()">Credit Card</ion-label>
          <ion-radio slot="start" value="credit-card"></ion-radio>
        </ion-item>
        <ion-item lines="none" (ionSelect)="paymentChosen()">
          <ion-label lines="none">COD</ion-label>
          <ion-radio slot="start" value="cod"></ion-radio>
        </ion-item>
      </ion-radio-group>

In my .ts file:

  paymentChosen(){
    console.log('Working!')
  }

Nothing logs to the console. What do y’all advise?

Thanks!


Ion-radio buttons not selecting

$
0
0

If you’re not taking any arguments in paymentChosen, I don’t think even if you solve the problem you’re asking about, you’ll end up with any thing useful. I would recommend reading the reactive forms guide, and using FormControls instead of ngModel. That way you can do whatever you’re wanting to do in paymentChosen completely within the controller, avoiding polluting the template with it.

Capacitor/plugin performance

$
0
0

A general question about plugins/Capacitor bridge and performance: how long does it take for a js method call to cross the Capacitor bridge to the native OS?

I’m only talking about the bridge itself, not whatever operation is done after crossing the bridge.

I am sure it depends on the OS and the hardware, but it would be interesting to have a ballpark figure, and I’m certain the Capacitor devs have done such benchmarks.

How to load a sub-component after other parts of the page gets loaded?

$
0
0

For Ionic-Angular app, the page contains several sub-components and I want to load them after other vital components load and gets displayed so that vital components are displayed as soon as possible and other non-essential components can load afterward.

Display badge because of notification from other URL

$
0
0

Hi, suppose I have a menu button, clicking the button displays menu bar in which click event listeners point out to multiple URL. Now I want to show notification badge in both menu button and menu-item from which it is coming.

How can I plan a strategy to execute this kind of function?

Ionic 4: The “src” content of an “img” tag is not updating when I change it from the controller in IOS

$
0
0

I am developing an app for Android and IOS.

I have a profile page where the user can change profile pictures. The photo appears in the view and is changed in real time.

My code is like this in the view:

<img alt="logo" style="width:15vh; height:15vh; border-radius: 50%;" src="{{pictureusuariomenu}}">

pictureusuariomenu is a variable found in the controller.

With that variable what I do is, it is the URL of the image that I upload, I update it there. here is the function:

updateStoredImages(name) {
    this.storage.get(STORAGE_KEY).then(images => {
        let arr = JSON.parse(images);
        if (!arr) {
            let newImages = [name];
            this.storage.set(STORAGE_KEY, JSON.stringify(newImages));
        } else {
            arr.push(name);
            this.storage.set(STORAGE_KEY, JSON.stringify(arr));
        }

        let filePath = this.file.dataDirectory + name;
        let resPath = this.pathForImage(filePath);
       // alert(resPath);
        this.urlImage=resPath;


        let newEntry = {
            name: name,
            path: resPath,
            filePath: filePath
        };
        this.images=[]; //borrar las imagenes anteriores (no crear la lista de imagenes)
        this.images = [newEntry, ...this.images];
        this.urlImage = this.images[0].path;
        this.colocarImagenEnProfile(this.urlImage);     
        this.ref.detectChanges(); // trigger change detection cycle
    });
}

In this line:

this.colocarImagenEnProfile(this.urlImage);

What I do is:

colocarImagenEnProfile(newFileName){
    this.pictureusuariomenu=newFileName;
}

Now in android is working fine this way of updating the profile image in view:

Before:

enter image description here

After:

enter image description here

But in IOS this isn’t working. The view is not updated at all

Before:

enter image description here

After:

enter image description here

Nothing appears, just a few letters. But the view doesn’t update in IOS.

What could it be?

My specifications:

enter image description here

Viewing all 231634 articles
Browse latest View live


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