Search code examples
androidbackground-imagenativescripthybrid-mobile-app

Change Background Image of View, NativeScript (Android application)


I am trying to change the background Image of a view of my android mobile application. I am using NativeScript to create a hybrid application but it is not working.

XML of the view

<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="onNavigatingTo" actionBarHidden="true" >
<StackLayout orientation="vertical">
    <Image src="rec://logo" stretch="none" horizontalAlignment="center"/>
    <Button text="Click" />
    <Button text="Click"/>
</StackLayout>

CSS of the view:

Page{
background-image: url('~/images/back.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
background-size: cover;
}

Note: the image that i want to put for the background is back.jpg and it is in the images folder under the app folder.


Solution

  • I think that background-image property needs a little tweak, I have it defined as follows and it works fine: background-image: ~/images/bg_intro_pin.jpg