Feature Request
Ionic version:
[x] 4.0.2
Describe the Feature Request
The loading indicator should be able to change the message while the indicator is being displayed. This would make it constant with the spinner property which can be changed.
// was: @Prop() message?: string;
@Prop({ mutable: true }) message?: string;The use case is to display a progress message with text that changes over time. For example: "Working on step A", then "Working on step B". Providing more information to users during long operations helps the app to not feel stuck.
Another proposed change would be to allow both the message and spinner properties to be blank so that a loading outline is not displayed. For example, change from this:
render() {
return [
<ion-backdrop visible={this.showBackdrop} tappable={this.backdropDismiss} />,
<div class="loading-wrapper" role="dialog">
{this.spinner && (
<div class="loading-spinner">
<ion-spinner name={this.spinner} />
</div>
)}
{this.message && <div class="loading-content">{this.message}</div>}
</div>
];
}to this:
render() {
return [
<ion-backdrop visible={this.showBackdrop} tappable={this.backdropDismiss} />,
{(this.spinner || this.message) && <div class="loading-wrapper" role="dialog">
{this.spinner && (
<div class="loading-spinner">
<ion-spinner name={this.spinner} />
</div>
)}
{this.message && <div class="loading-content">{this.message}</div>}}
</div>
];
}The use case for not showing content is if you want to avoid too much flashing for progress messages that are completed quickly. For example, a sign in dialog might first render the loading indicator without content (so the overlay prevents the user from clicking on other content during sign in) and then switch the message to "Signing in..." with a spinner after a delay of 300ms (or hiding the loading indicator earlier if the operation completes). This results in less flashing if sign in completes quickly.
Feature Request
Ionic version:
[x] 4.0.2
Describe the Feature Request
The loading indicator should be able to change the message while the indicator is being displayed. This would make it constant with the
spinnerproperty which can be changed.The use case is to display a progress message with text that changes over time. For example: "Working on step A", then "Working on step B". Providing more information to users during long operations helps the app to not feel stuck.
Another proposed change would be to allow both the
messageandspinnerproperties to be blank so that a loading outline is not displayed. For example, change from this:to this:
The use case for not showing content is if you want to avoid too much flashing for progress messages that are completed quickly. For example, a sign in dialog might first render the loading indicator without content (so the overlay prevents the user from clicking on other content during sign in) and then switch the message to "Signing in..." with a spinner after a delay of 300ms (or hiding the loading indicator earlier if the operation completes). This results in less flashing if sign in completes quickly.