FlowPanel против HTMLPanel в GWT UiBinder - PullRequest
Новая
       11

FlowPanel против HTMLPanel в GWT UiBinder

7 голосов
/ 20 января 2012

При использовании UiBinder какой метод создания простого макета является предпочтительным?

FlowPanel: 

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
    xmlns:g='urn:import:com.google.gwt.user.client.ui'>
  <ui:style>
    .outer {
      display: table;
      height: 100%;
      width: 100%;
    }
    .inner {
      background: #DDD;
      display: table-cell;
      vertical-align: middle;
    }
  </ui:style>
  <g:FlowPanel styleName="{style.outer}">
    <g:FlowPanel styleName="{style.inner}">
      <g:Label ui:field="someLabel"/>
    </g:FlowPanel>
  </g:FlowPanel>
</ui:UiBinder>

HTMLPanel: 

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
    xmlns:g='urn:import:com.google.gwt.user.client.ui'>
  <ui:style>
    .outer {
      display: table;
      height: 100%;
      width: 100%;
    }
    .inner {
      background: #DDD;
      display: table-cell;
      vertical-align: middle;
    }
  </ui:style>
  <g:HTMLPanel styleName="{style.outer}">
    <div class="{style.inner}">
      <g:Label ui:field="someLabel"/>
    </div>
  </g:HTMLPanel>
</ui:UiBinder>

Редактировать: Я знаю, что они генерируют один и тот же HTML при рендеринге, мне интересно, есть ли основания использовать один стиль поверх другого.

Javadocs говорят, что FlowPanel - самая простая панель, нов какой момент использование HTMLPanel становится предпочтительным.например, 

<FlowPanel>
  <FlowPanel>
    <Widget>
  </FlowPanel>
  <FlowPanel>
    <Widget>
  </FlowPanel>
</FlowPanel>

против 

<HTMLPanel>
  <div>
    <Widget>
  </div>
  <div>
    <Widget>
  </div>
</HTMLPanel>

Спасибо.

UiBinder - HTMLPanel против div - довольно похожий вопрос, но задает вопрос об использованииdiv против HTMLPanel.

Ответы [ 3 ]

10 голосов
/ 20 января 2012

На самом деле они будут делать то же самое в вашем случае - div.Нет никакой разницы, если вы не начнете добавлять больше элементов в FlowPanel.

Вы можете попробовать поведение FlowPanel здесь: http://examples.roughian.com/index.htm#Panels~FlowPanel

Вы должны использовать HTMLPanel в тех случаях, когда вам нужно написать свой собственный HTMLкод на странице.Это позволяет писать HTML-код внутри тега HTMLPanel.

Например, вы не можете сделать такой трюк с FlowPanel.

4 голосов
/ 23 августа 2012

Я недавно прочитал Теги First GWT Programming .Мне кажется, что описанная им техника позволит вам намного лучше контролировать окончательный рендеринг вашей страницы, сохраняя при этом преимущества GWT.

Я думаю, что дихотомия, о которой вы спрашиваете, междуFlowPanel и HTMLPanel не совсем правильный вопрос.Вместо этого лучше признать, что они предназначены для разных вещей.

HTMLPanel способен намного больше, чем FlowPanel.Если вам нужно динамически добавлять и удалять виджеты, встроенные в некоторые пользовательские HTML, используйте HTMLPanel.Если вы просто хотите, чтобы некоторые виджеты совмещались на странице с обычным потоком HTML (например, текст и рисунки), используйте FlowPanel.

Мой личный совет - использовать простейшую вещь, которая может делать то, что вам нужнок.

0 голосов
/ 11 июля 2013

Рекомендую второй пример.Если возможно , вы должны предпочесть использование простого HTML-тега, такого как "div", над виджетом, таким как "FlowPanel", поскольку накладные расходы имеют неиспользуемый логический виджет.

Сначала это может показаться тривиальнымно это избавляет вас от головной боли (утечки памяти, операции gquery, ...), когда вам приходится иметь дело с большим количеством элементов.

...