Files
ionic-framework/packages/core/src/components/spinner
Brandy Carney 4838d5ebfe chore(snapshot): add support for ios platform and passing a folder (#13635)
* chore(snapshot): adds support for multiple platforms and passing folder

* test(e2e): update e2e tests for multiple platforms

* test(e2e): fix failing backdrop tests

* chore(snapshot): remove console logs
2017-12-12 17:46:11 -05:00
..

ion-spinner

The ion-spinner component provides a variety of animated SVG spinners. Spinners enables you to give users feedback that the app is actively processing/thinking/waiting/chillin’ out, or whatever you’d like it to indicate. By default, the ion-refresher feature uses this spinner component while it's the refresher is in the refreshing state.

Ionic offers a handful of spinners out of the box, and by default, it will use the appropriate spinner for the platform on which it’s running.

lines
lines-small
bubbles
circles
crescent
dots

The following code would use the default spinner for the platform it's running from. If it's neither iOS or Android, it'll default to use ios.

<ion-spinner></ion-spinner>

By setting the name property, you can specify which predefined spinner to use, no matter what the platform is.

<ion-spinner name="bubbles"></ion-spinner>

Styling SVG with CSS

One cool thing about SVG is its ability to be styled with CSS! One thing to note is that some of the CSS properties on an SVG element have different names. For example, SVG uses the term stroke instead of border, and fill instead of background-color.

ion-spinner{
  width: 28px;
  height: 28px;
  stroke: #444;
  fill: #222;
}

Properties

color

string

duration

number

mode

any

name

string

paused

boolean

Attributes

color

string

duration

number

mode

any

name

string

paused

boolean


Built by StencilJS