Nativescript background-image fullscreen

Question

I want to create app in Nativescript with fullscreen image on page. I have to use background-image: url('~/images/background.jpg');. But how to make it full screen. Thanks for your help

Answer 1

You need to use the NativeScript supported CSS properties to achieve this.

I've used the following CSS on a background-image attached to the <Page> view before and it works fine.

.coverImage {
    background-image: url('~/images/kiss.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

Answer 2

This does not work with animated gif. My style:

.page{
    background-image: url("~/assets/images/animated.gif") black;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

The gif is shown, centered and enlarged, so great, but static: the animation does not moves.