Button Delay on Assigning Clear

There is a delay that creates a flash on the button with icon.

If i apply these properties clear and color to the ion-button i can see that it makes a flash because it is only being applied in the lifecycle ngAfterContentInit.

Is there any solution for this?

<button ion-button clear icon-only color="secondary"  (click)="presentMore($event)">
      <ion-icon name="more"></ion-icon>
</button>"

Always share the actual relevant code you are using so that someone trying to help you may understand your question better.

<button ion-button clear icon-only color="secondary"  (click)="presentMore($event)">
      <ion-icon name="more"></ion-icon>
</button>

If you are referring to the temporary light grey background being shown when we click the button as the ‘flash’, then what exactly do you want to do? It’s a part of the UX, it gives us a visual indication that the button has been clicked.

1 Like

It is when the page is loaded ore i change segment.

Every time i change segment it will make this flash to the buttons

This means the code you shared earlier has nothing to do with the actual problem, the button code in itself is not producing the flash you are mentioning. So, do you see the need to actually share the relevant code now for someone to even try to understand your problem? Please share the relevant code which is giving you the problem!

Actually yes the code i shared is the problem.

If i don´t apply the input properties, clear, and color, especially clear there will be no flash.

Like i said before ionic button seems to apply the clear and color only on the button ngAfterContentInit

if you go to ionic button.js ore

import { Button } from 'ionic-angular';
    Button.prototype.ngAfterContentInit = function () {
        this._init = true;
        this._assignCss(true);
    };

this means that its applying all the css style late and it should be on ngOnInit.

if i apply my own transparency style (clear) to the button i fix the problem because it start with the style already set.

but this defeats the purpose of using clear on the button.

I am afraid, what you “think” does not matter right now. As you’ve asked for a solution, it’s more important that we should be able to reproduce your error and cross check it. For that you need to provide us the relevant code that’s creating the problem, and as far as I guess, it should be at least the <ion-segment> markup and relevant method code if any is being called. Is this so much of a rocket science to understand?

FYI, I’ve not seen any kind of “flash” in a button, doesn’t matter whether it’s in a segment or somewhere else. So, rather than even thinking of putting fingers on ionic itself, I’d like to believe that your yet to be seen code is the culprit. Until and unless you let us make sure of what you are saying of course.