gpt4 book ai didi

java - GWT 高分子 Material 设计

转载 作者:太空宇宙 更新时间:2023-11-04 10:59:01 25 4
gpt4 key购买 nike

我正在使用 gwt 和 vaadin gwt-polymer 插件创建一个设计,并将它们与 RESTful 网络服务相结合。但是我很困惑如何设置背景颜色。我是 gwt 的新手,我找不到任何教程来解决我的问题。

我的uibinder代码如下

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
xmlns:g='urn:import:com.google.gwt.user.client.ui'
xmlns:p='urn:import:com.vaadin.polymer.paper.widget'
xmlns:i='urn:import:com.vaadin.polymer.iron.widget'>

<ui:style>

</ui:style>

<g:HTMLPanel>
<!-- top data inputs -->
<g:VerticalPanel width="100%" height="100%">
<g:DockLayoutPanel width="100%" height="150px"
unit="PX">
<g:east size="200">
<g:VerticalPanel>
<p:PaperMaterial>
<p:PaperInput label="Number" type="number"></p:PaperInput>
<p:PaperInput label="Date" type="date"></p:PaperInput>
</p:PaperMaterial>
</g:VerticalPanel>
</g:east>
</g:DockLayoutPanel>
</g:VerticalPanel>

<!-- content panel -->
<p:PaperMaterial>
<g:HTMLPanel>
Content goes here
</g:HTMLPanel>
</p:PaperMaterial>

<!-- action buttons -->
<g:VerticalPanel>
<p:PaperMaterial>
<p:PaperButton>New</p:PaperButton>
<p:PaperButton>Edit</p:PaperButton>
<p:PaperButton>Delete</p:PaperButton>
</p:PaperMaterial>
</g:VerticalPanel>
</g:HTMLPanel>

我的HTML主机页面代码如下

<!doctype html>

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<title>Web Application Starter Project</title>
<script type="text/javascript" language="javascript"
src="opening_balance/opening_balance.nocache.js"></script>
</head>

<body>
</body>
</html>

输出如下

enter image description here

我想让它更聪明如下

enter image description here

最佳答案

gwt 使用 css 设置所有元素的颜色。您可以使用 css 文件或手动执行此操作,在 java 中设置所有样式。使用带有 client bundle 的 css是首选方式。也许你应该首先阅读如何使用 css 设计你的小部件/元素的样式。
styling with uibinder
styling with a css file

回答你的问题...要更改主体的背景颜色,您可以将 body 样式添加到您的 css 文件中:

body {
background-color:green;
}

或者用java做:

Document.get().getBody().getStyle().setBackgroundColor("green");

或直接将样式元素添加到您的正文元素:

<!doctype html>

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<title>Web Application Starter Project</title>
<script type="text/javascript" language="javascript"
src="opening_balance/opening_balance.nocache.js"></script>
</head>

<body style="background-color: green"></body>
</html>

可能你还想改变其他元素的背景,你可以用上面描述的相同方法来实现。

yourwidget.get().getBody().getStyle().setBackgroundColor("green");

CSS:
.你的风格{
背景色:绿色;
}

java:
yourwidget.addStyleName("yourstyle");

关于java - GWT 高分子 Material 设计,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34483175/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com