如何在Google Appmaker的背景页面中添加墙纸/图像?

时间:2019-05-15 11:37:07

标签: google-app-maker

我需要在应用程序的背景页面中添加特定的墙纸,以使该应用程序看起来更加丰富多彩和美观。有什么办法吗?

问题在于,一旦您将图像添加到页面上,便无法在其上放置或覆盖其他小部件。始终将其水平或垂直对齐。

2 个答案:

答案 0 :(得分:0)

您应该能够在样式编辑器中使用CSS来完成此任务。使用“页面样式”还是“全局样式”,取决于您是只希望将背景图像显示到特定页面还是在整个应用程序中使用。您将需要声明一个自定义类或引用要在其中渲染背景图像的特定元素。

对于特定元素:

.app-YourPage1-YourPanel, .app-YourPage2-YourPanel {
  background-image: url(YourImageURL);
}

要创建全局样式,请创建一个类,然后为要应用背景图片的每个元素添加该类到该元素的“样式”部分(小部件):

.YourPanelClass {
  background-image: url(YourImageURL);
}

无论哪种方式,我都强烈建议您在“ html背景图像”上进行搜索,这样您就可以阅读其他选项,例如重复图像以填充空间等等。

答案 1 :(得分:0)

这几乎是基本的CSS。我建议您查看over this了解更多信息。因此,在appmaker中,如果要将背景图像应用到页面上,请执行以下操作:

CSS

1。)首先,选择感兴趣页面的根窗口小部件。 enter image description here

2。)现在,您已经选择了页面,让我们转到样式编辑器。到达该页面后,在页面样式部分中,键入“。”(句点,点),然后等待建议显示。第一个建议就是您需要的建议,因此只需按Enter或用光标将其选中。

enter image description here

3。)现在,您已经使用css选择器选择了元素,然后可以应用样式。对于背景,您需要执行以下操作:

.app-myTestingPage-myPage {
  background: url("url-to-picture");
}

enter image description here

在上面的示例中,url-to-picture表示图像的url,最好是通过 https 提供。


URL

我知道两种获取背景图片网址的方法。第一个是使用您在Internet上找到的任何图像URL或托管在您自己的服务器或CDN中的URL。第二种方法是将图像上传到appmaker资源并使用该url。如果选择后者,请执行以下操作:

1。)转到应用设置。

2。)点击资源

3。)将图像文件拖放到受关注的区域或单击按钮进行浏览

enter image description here

资源上传完成后,您可以单击复制图标以将url复制到资源,然后可以在页面css中将其用作背景URL。

enter image description here