Question

我想在FlexTable中使用DialogBox。 DialogBox的大小应与FlexTable的大小相匹配。不幸的是，DialogBox较小，因此FlexTable被切断，只有部分可见。有没有办法自动调整DialogBox的大小，以便FlexTable适合？（请注意，FlexTable在显示时不会改变，所以一旦屏幕上显示，就不需要自动调整大小...）

有没有人已经完成了这个？

Answer 1

我想我现在发现了什么问题。除了布莱恩的伟大答案，这可能也有助于这种情况（虽然在我的自动大小调整和布莱恩的方法之间没有变化）。我发现在使用动画时，GWT中DialogBox的宽度限制为400像素。更改行时

setAnimationEnabled(true);

到

setAnimationEnabled(false);

DialogBox的大小调整完全正常。也许这对某人有帮助......

Answer 2

在我的应用程序中，我创建了一个DialogBox子类，使事情更容易处理，因为您必须知道屏幕上何时出现模态，以便您可以准确地确定表的大小。

public class Modal extends DialogBox
{
  private VerticalPanel myContentPanel;
  private FlexTable myTable;

  public Modal( )
  {
    ...

    // Construct the modal and call `setWidget()` with something like a `VerticalPanel`
    super.setWidget( this.myContentPanel );
  }

  @Override
  public void onAttach( )
  {
    // This is called when the modal attaches to the DOM:
    super.onAttach( );

    // Heights still aren't quite valid, we need to defer the call one more frame.

    // Make ourselves invisible while we defer the call so we don't flicker:
    super.setVisible( false );

    // Defer until the next frame:
    Scheduler.get( ).scheduleDeferred( new ScheduledCommand( )
    {
      @Override
      public void execute( )
      {
        // Height on the table is now valid:
        int width  = myTable.getOffsetWidth( );
        int height = myTable.getOffsetHeight( );

        // Update the heights:
        Modal.this.myContentPanel.setSize( width + "px", height + "px" );
        Modal.this.setSize( width + "px", height + "px" );

        // Center and show ourselves:
        Modal.this.center( );
        Modal.this.setVisible( true );
      }
    });
  }
}

根据我的经验，我发现在将小部件附加到DOM后，您需要推迟getOffsetHeight和getOffsetWidth次调用，以获得一致，有效的结果。

如何在GWT中调整DialogBox的大小以便FlexTable适合？

2 个答案: