polymer2-splashscreen | Vaadin

Polymer v2 Splashcreen Element

[ This description is mirrored from README.md at github.com/arcoirislabs/polymer2-splashscreen on 2019-05-22 ]


Splash Screen element for Polymer v2


This element DOES NOT works with Polymer 1.x

The 1.x version will be available soon

How to Use

Here is how to use the <splash-screen> element

<splash-screen align="middle" show="true" background-style="#432" destroy="false">
    <img src="images/manifest/icon-48x48.png" class="center-aligned" slot="logo" alt="">
    <div slot="content">

        <!---Your custom html--->


Element Properties

show - Boolean

This is a boolean flag to cancel the splashcreen activity. Default true

destroy - Boolean

If you are planning to reuse the splashcreen, set this flag as false. Otherwise the element is destroyed. Default false

background-style - String

This flag accepts both hex strings, url() & default material color variables. Default white

align - String

This flag allows you to position your content of splashscreen in different positions. Here are the allowed values

  • middle default
  • middle-left
  • middle-right
  • top-left
  • top-right
  • top-middle
  • top-left
  • top-right

Slot properties

<splash-screen> element is composed using specific slots inside the element. Here are the slot names allowed

  • logo - To set the logo image
  • content - Here you can set the content that follows the logo

Viewing Your Element

$ polymer serve

Running Tests

$ polymer test

Your application is already set up to be tested via web-component-tester. Run polymer test to run your application's test suite locally.

Future work

  • Add a slot for introducing custom dynamic background like <canvas> based animations
  • Add custom animation behaviour to entire splash screen content (logo and content)
  • Introduce spinner slots with custom positioning


Apache License 2.0


Link to this version
TestedReleased 30 June 2017Apache License 2.0
Framework Support
Polymer 2.0+
Browser Compatibility
Install with
Release notes - Version 1.0.0