来自图像对象的NativeScript全屏幕背景图像

我尝试在页面上放置图像，我需要将其拉伸至屏幕的全宽和高度（背景图像）。图像比屏幕尺寸大，并且是正方形的，所以我需要它是屏幕的高度并居中。来自图像对象的NativeScript全屏幕背景图像

我需要它作为一个图像，所以我可以稍后移动它并对其进行动画处理。

到目前为止，所有我能够做的就是给我的第一个背景图片：

#page : { 
    background-image: ~/Images/collage.jpg; 
    background-repeat: no-repeat; 
    background-position: center; 
    background-size: cover; 
}

来源

2016-08-04 developer82

您可以考虑使用App_Resources图像提供所有不同的设备为您的应用背景，应用程序图标，和其他静态resources.This，你将有适当的比例适当缩放图像和漂亮的图像（与他们的不同屏幕指标） - 例如查看用于Android和iOS的照片此演示应用程序https://github.com/NativeScript/sample-Groceries/tree/angular-end/app/App_Resources –

我有更大的背景，所以双方将稍后动画 – developer82

您的解决方案应该工作。但是另一种可能的解决方法如下：

page.xml

<Page> 
    <GridLayout> 
     <GridLayout id="background" scaleX="2" scaleY="2" /> 
     <!-- page content follows here --> 
    </GridLayout> 
</Page>

page.css

#background { 
    background-image: url("path-to-image"); 
}

使用相应的比例来拉伸图像，然后您可以稍后轻松地为背景图像制作动画。例如

page.getViewById("background").animate({ 
    scale: { x: 1.4, y: 1.4 }, 
    duration: 4000 
});

来源

2016-08-05 10:50:32

感谢您的答案，但规模不是我要找的。我为100％身高looing和宽度将自动和中心的形象 – developer82

来自图像对象的NativeScript全屏幕背景图像

回答

相关问题