2015-05-14 2 views
0

У меня есть класс, который расширяет FlowPanel. Я добавляю виджет DataGrid и виджет в виде грида:GWT FlowPanel не добавляет виджет

dataGrid.setWidth("100%"); 
dataGrid.setHeight("100%"); 

grid.setWidth("100%"); 
grid.setHeight("100%"); 

this.add(dataGrid); 
this.add(grid); 

this.setWidth("100%"); 
this.setHeight("100%"); 

Появляется только виджет DataGrid. Я пробовал переключение с FlowPanel на VerticalPanel и перенос Grid в FlowPanel без радости. Я попытался помещать DataGrid и Grid в 2 строки, 1 столбец Grid и ничего не отображал. Это GWT 2.6.0 на Safari.

Я подозреваю, что у меня есть непонимание того, что делают setHeight() и setWidth() в этом случае, но я не уверен. Есть ли способ увидеть, что GWT считает, что это делается с точки зрения макета?

Спасибо.

ответ

2

Вы указываете DataGrid принимать все свободное пространство внутри FlowPanel. Затем вы указываете грид-виджет делать то же самое. В результате ваша сетка имеет высоту нуля, поскольку для нее не осталось места после того, как DataGrid занял 100% высоты FlowPanel.

Вы должны либо использовать «50%» для высоты, либо сделать свой фиксированный размер DataGrid («100px»), а затем передать Grid, чтобы взять остальные. Самый простой способ добиться того, чтобы использовать LayoutPanel, а затем, например:

layoutPanel.setWidgetTopHeight(dataGrid, 0, Unit.PX, 100, Unit.PX); 
layoutPanel.setWidgetTopBottom(grid, 100, Unit.PX, 0, Unit.PX); 

EDIT:

Это код, который я использую, чтобы изменить размер DataGrid:

public void resize(final boolean addHeader, final boolean addFooter) { 
    Scheduler.get().scheduleDeferred(new ScheduledCommand() { 

     @Override 
     public void execute() { 
      // 37 is the height of header and footer based on my CSS 
      int height = addHeader ? 37 : 0; 
      if (addFooter) { 
       height += 37; 
      } 
      for (int i = 0; i < getRowCount(); i++) { 
       height += getRowElement(i).getOffsetHeight(); 
      } 
      setHeight(height + "px"); 
     } 
    }); 
} 

Если вы используете этот подход, просто добавьте DataGrid в FlowPanel, а затем добавьте свою Grid в FlowPanel. Вызовите resize() в DataGrid и не устанавливайте высоту или ширину в DataGrid или Grid.

Для более точного контроля взгляните на модель flex-box layout. Он поддерживается во всех современных браузерах.

+0

Спасибо, устанавливая каждую высоту до 50% сделали появляются как виджеты. Есть ли какой-либо путь в GWT, чтобы каркас выполнял работу? Я хочу, чтобы DataGrid занимал столько места, сколько нужно, чтобы отображать заголовки и 10 строк, и я хочу, чтобы Grid занимала столько места, сколько нужно, чтобы показать его содержимое. FlowPanel должен заказывать макет и занимать столько места, сколько необходимо для его содержимого. Установка процентов и подсчета пикселей кажется немного примитивной. – Patrick

+0

См. Обновление к моему ответу. –

+0

Я ценю код. Однако это волшебное значение 37 меня беспокоит. Я ожидаю, что GWT должен позаботиться о калибровке для меня. Я просто хочу добавить виджеты на панель и заставить их заняться всем необходимым пространством. Я думал, что FlowPanel будет делать именно это, но когда я не укажу высоту, все, что я вижу, это второй виджет, который я добавил (сетка в этом случае). Это говорит мне о том, что оно не соответствует 100%, что не имеет смысла. Нет ли способа сделать это без явного определения размера? – Patrick

1

@Patrick, относительно ваш комментарий, я использую DockLayoutPanel заботиться о изменении размера для меня:

DockLayoutPanel gridPanel = new DockLayoutPanel(Unit.PCT); 
gridPanel.addNorth(dataGrid, 60); //datagrid will take 60% of the panel 
gridPanel.add(grid); //grid will take the remaining space 
Смежные вопросы