TypeScript panel.PanelLayout类代码示例

  constructor(model: NotebookDiffModel, rendermime: IRenderMime) {
    super();
    this._model = model;
    this._rendermime = rendermime;
    let layout = this.layout = new PanelLayout();

    this.addClass(NBDIFF_CLASS);

    if (model.metadata) {
      layout.addWidget(new MetadataDiffWidget(model.metadata));
    }
    for (let c of model.cells) {
      layout.addWidget(new CellDiffWidget(c, rendermime, model.mimetype));
    }
  }

 /**
  * Add an item to the toolbar.
  *
  * @param name - The name of the widget to add to the toolbar.
  *
  * @param widget - The widget to add to the toolbar.
  *
  * @param after - The optional name of the item to insert after.
  *
  * #### Notes
  * An error is thrown if a widget of the same name is already given.
  * If `after` is not given, or the named widget is not in the toolbar,
  * the widget will be added to the end of the toolbar.
  */
 add(name: string, widget: Widget, after?: string): void {
   let names = this.list();
   if (names.indexOf(name) !== -1) {
     throw new Error(`A button named "${name}" was already added`);
   }
   widget.addClass(TOOLBAR_ITEM_CLASS);
   let layout = this.layout as PanelLayout;
   let index = names.indexOf(after);
   if (index === -1) {
     layout.addWidget(widget);
   } else {
     layout.insertWidget(index + 1, widget);
   }
   Private.nameProperty.set(widget, name);
 }

  constructor(options: Collapse.IOptions) {
    super(options);
    this.addClass(COLLAPSE_CLASS);
    this._header = new Widget();
    this._header.addClass(COLLAPSE_HEADER_CLASS);
    this._header.node.addEventListener('click', this);
    this._content = new Panel();
    this._content.addClass(COLLAPSE_CONTENTS_CLASS);

    let layout = new PanelLayout();
    this.layout = layout;
    layout.addWidget(this._header);
    layout.addWidget(this._content);
    if (options.widget) {
      this.widget = options.widget;
    }
    this.collapsed = false;
  }

  constructor(model: RenderableDiffModel<T>, editorClass: string[],
              rendermime: IRenderMime) {
    super();
    this._rendermime = rendermime;
    let bdata = model.base;
    let rdata = model.remote;
    this.layout = new PanelLayout();

    let ci = 0;
    if (bdata) {
      let widget = this.createSubView(bdata, false);
      this.layout.addWidget(widget);
      widget.addClass(editorClass[ci++]);
    }
    if (rdata && rdata !== bdata) {
      let widget = this.createSubView(rdata, false);
      this.layout.addWidget(widget);
      widget.addClass(editorClass[ci++]);
    }
  }

 /**
  * Insert an item into the toolbar at the specified index.
  *
  * @param index - The index at which to insert the item.
  *
  * @param name - The name of the item.
  *
  * @param widget - The widget to add.
  *
  * @returns Whether the item was added to the toolbar. Returns false if
  *   an item of the same name is already in the toolbar.
  *
  * #### Notes
  * The index will be clamped to the bounds of the items.
  */
 insertItem(index: number, name: string, widget: T): boolean {
   let existing = find(this.names(), value => value === name);
   if (existing) {
     return false;
   }
   widget.addClass(TOOLBAR_ITEM_CLASS);
   let layout = this.layout as PanelLayout;
   layout.insertWidget(index, widget);
   Private.nameProperty.set(widget, name);
   return true;
 }

  constructor(model: OutputDiffModel, editorClass: string[],
              rendermime: IRenderMime) {
    super();
    this._rendermime = rendermime;
    let bdata = model.base;
    let rdata = model.remote;
    this.layout = new PanelLayout();
    this.addClass(RENDERED_OUTPUT_CLASS);

    let ci = 0;
    if (bdata) {
      let widget = this.createOutput(bdata, false);
      this.layout.addWidget(widget);
      widget.addClass(editorClass[ci++]);
    }
    if (rdata && rdata !== bdata) {
      let widget = this.createOutput(rdata, false);
      this.layout.addWidget(widget);
      widget.addClass(editorClass[ci++]);
    }
  }

  /**
   * Construct a new tab panel.
   *
   * @param options - The options for initializing the tab panel.
   */
  constructor(options: TabPanel.IOptions = {}) {
    super();
    this.addClass(TAB_PANEL_CLASS);

    // Create the tab bar and stacked panel.
    this._tabBar = new TabBar(options);
    this._tabBar.tabsMovable = true;
    this._tabBar.addClass(TAB_BAR_CLASS);
    this._tabContents = new EventedPanel();
    this._tabContents.addClass(TAB_CONTENTS_CLASS);

    // Connect the tab bar signal handlers.
    this._tabBar.tabMoved.connect(this._onTabMoved, this);
    this._tabBar.currentChanged.connect(this._onCurrentChanged, this);
    this._tabBar.tabCloseRequested.connect(this._onTabCloseRequested, this);

    // Connect the stacked panel signal handlers.
    this._tabContents.widgetRemoved.connect(this._onWidgetRemoved, this);

    // Get the data related to the placement.
    this._tabPlacement = options.tabPlacement || 'top';
    let direction = Private.directionFromPlacement(this._tabPlacement);
    let orientation = Private.orientationFromPlacement(this._tabPlacement);

    // Configure the tab bar for the placement.
    this._tabBar.orientation = orientation;
    this._tabBar.addClass(`p-mod-${this._tabPlacement}`);

    // Create the box layout.
    let layout = new PanelLayout();

    // Add the child widgets to the layout.
    layout.addWidget(this._tabBar);
    layout.addWidget(this._tabContents);

    // Install the layout on the tab panel.
    this.layout = layout;
  }

 /**
  * Remove an item in the toolbar by value.
  *
  *  @param name - The name of the widget to remove from the toolbar.
  */
 removeItem(widget: T): void {
   let layout = this.layout as PanelLayout;
   layout.removeWidget(widget);
 }