Integrate Htmls into GWT

2019-08-16 12:38发布

站内问答 / 前端开发
698 2 5

We have a web application that its UI is based on GWT. We are pretty satisfied from the technology, but we have one major problem: We get html files from our designer, and it takes a lot of time to integrate them into our GWT code.

Is there a quick way or rules to do that?

For instance, I would like to take the html, put it almost "as is" in a ui.xml file, and then start binding the components to UiBinder fields. What is the quickest way to do that? What should I do with the CSS and JS files that I get?

I need some guidelines to make this conversion, so it will be quick & easy.

2条回答
女痞
2楼-- · 2019-08-16 13:00

We have the same problem. It might be hard for a designer to get used to GWT widgets. But he'll have to forget about making HTML proof-of-concepts and using GWT directly.

We didn't overcame the difficulty. As a result, many GWT features are under-used (like CSSResources, or GWT-Bootstrap layout capabilities).

I would advise to have him learn the xml of GWT widget libraries.

You can also start by using GWT Designer. This way he can still do the design, learn the XML bit by bit, and you can still work on wiring the components.

Of course it is a slow process. People don't change old habits instantly.

查看更多
0人赞 添加讨论(0) 举报
对你真心纯属浪费
3楼-- · 2019-08-16 13:26

Errai seems to fit your requirements.

Basically is uses regular HTML5 templates, binded to GWT logic.

"Create standard conform HTML5 templates or use existing HTML and CSS files to design your web and mobile applications."

http://errai.github.io/

Here is an example of a sign-in page:

<!DOCTYPE html>
<link rel=stylesheet href="css/TodoList.css">
<div data-field="main">
  <h1>Get it done with Errai.</h1>
  <div class=form>
    <p class=error data-field=loginError>
      Login failed. Please check that your email address and password were entered correctly.
    </p>
    <input type=text data-field=username placeholder="Email">
    <input type=password data-field=password placeholder="Password">
    <button data-field=loginButton>Sign In</button>
    <p>New here? <a href="SignupPage.html" data-field="signupLink">Sign up in seconds!</a></p>
  </div>
</div>

source

(p.s. I've never used it, yet)

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)