Package com.extjs.gxt.ui.client.widget

Examples of com.extjs.gxt.ui.client.widget.ContentPanel


  public MailItemPanel() {
    setHeaderVisible(false);
    setLayout(new FitLayout());

    content = new ContentPanel();
    content.setBodyBorder(false);
    content.setHeaderVisible(false);
    content.setScrollMode(Scroll.AUTO);

    header = new Html();
View Full Code Here


    setLayout(new BorderLayout());

    LayoutContainer north = new LayoutContainer();
    BorderLayoutData northData = new BorderLayoutData(LayoutRegion.NORTH, 30);

    ContentPanel west = new ContentPanel();
    west.setBodyBorder(false);
    west.setHeading("West");
    west.setLayout(new AccordionLayout());

    ContentPanel nav = new ContentPanel();
    nav.setHeading("Navigation");
    nav.setBorders(false);
    nav.setBodyStyle("fontSize: 12px; padding: 6px");
    nav.addText(TestData.DUMMY_TEXT_SHORT);
    west.add(nav);

    ContentPanel settings = new ContentPanel();
    settings.setHeading("Settings");
    settings.setBorders(false);
    west.add(settings);

    BorderLayoutData westData = new BorderLayoutData(LayoutRegion.WEST, 200, 100, 300);
    westData.setMargins(new Margins(5, 0, 5, 5));
    westData.setCollapsible(true);
View Full Code Here

    person.setKids(kids);

    VerticalPanel vp = new VerticalPanel();
    vp.setSpacing(10);

    final ContentPanel panel = new ContentPanel();
    panel.setHeading("Basic Template");
    panel.setWidth(300);
    panel.setBodyStyleName("pad-text");

    ToolBar toolbar = new ToolBar();
    Button apply = new Button("Apply Template");
    apply.addSelectionListener(new SelectionListener<ButtonEvent>() {
      @Override
      public void componentSelected(ButtonEvent ce) {
        Template template = new Template(getBasicTemplate());
        template.overwrite(panel.getBody().dom, Util.getJsObject(person));
      }
    });
    toolbar.add(apply);
    panel.setTopComponent(toolbar);

    final ContentPanel xpanel = new ContentPanel();
    xpanel.setHeading("XTemplate Playground");
    xpanel.setWidth(300);
    xpanel.setBodyStyleName("pad-text");

    ToolBar toolBar = new ToolBar();
    toolBar.add(new Button("Apply Template", new SelectionListener<ButtonEvent>() {
      @Override
      public void componentSelected(ButtonEvent ce) {
        XTemplate tpl = XTemplate.create(getTemplate());
        xpanel.removeAll();
        xpanel.addText(tpl.applyTemplate(Util.getJsObject(person, 3)));
        xpanel.layout();
      }
    }));
    xpanel.setTopComponent(toolBar);
   
    final ContentPanel cpanel = new ContentPanel();
    cpanel.setHeading("XTemplate Test");
    cpanel.setWidth(500);
    cpanel.setBodyStyleName("pad-text");
   
    final Html html = new Html();
    html.setStyleName("pad-text");

    final TextArea area = new TextArea();
    area.setSize(485, 150);
   
    toolBar = new ToolBar();
    toolBar.add(new Button("Apply Template", new SelectionListener<ButtonEvent>() {
      @Override
      public void componentSelected(ButtonEvent ce) {
        String template = area.getValue();
        XTemplate tpl = XTemplate.create(template);
        tpl.overwrite(html.getElement(), Util.getJsObject(person, 3));
      }
    }));
    cpanel.setTopComponent(toolBar);
   
    StringBuilder sb = new StringBuilder();
    sb.append("<p>Name: {name}</p>\r\n");
    sb.append("<p>Company: {company}</p>\r\n");
    sb.append("<p>Location: {location}</p>\r\n");
    sb.append("<p>Salary: {income:currency}</p>\r\n");
    sb.append("<p>Kids:</p>\r\n");
    sb.append("<tpl for=\"kids\" if=\"name==\'Darrell Meyer\'\">\r\n");
    sb.append("<tpl if=\"age &gt; 1\"><p>{#}. {parent.name}\'s kid - {name} - {bday:date(\"M/d/yyyy\")}</p></tpl>");
    sb.append("</tpl>\r\n");
   

    area.setValue(sb.toString());
    cpanel.add(area);
    cpanel.add(html);

    vp.add(panel);
    vp.add(xpanel);
    vp.add(cpanel);
    add(vp);
View Full Code Here

    ListStore<Stock> store = new ListStore<Stock>();
    store.add(stocks);

    ColumnModel cm = new ColumnModel(configs);

    ContentPanel cp = new ContentPanel();
    cp.setHeading("Framed with Checkbox Selection and Horizontal Scrolling");
    cp.setFrame(true);
    cp.setIcon(Resources.ICONS.table());
    cp.setLayout(new FitLayout());
    cp.setSize(600, 300);

    Grid<Stock> grid = new Grid<Stock>(store, cm);
    grid.setSelectionModel(sm);
    grid.setBorders(true);
    grid.setColumnReordering(true);
    grid.getAriaSupport().setLabelledBy(cp.getHeader().getId() + "-label");
    grid.addPlugin(sm);
   
    ToolBar toolBar = new ToolBar();
    toolBar.getAriaSupport().setLabel("Grid Options");
    toolBar.add(new LabelToolItem("Selection Mode: "));
    final SimpleComboBox<String> type = new SimpleComboBox<String>();
    type.setTriggerAction(TriggerAction.ALL);
    type.setEditable(false);
    type.setFireChangeEventOnSetValue(true);
    type.setWidth(100);
    type.add("Multi");
    type.add("Simple");
    type.setSimpleValue("Multi");
    type.addListener(Events.Change, new Listener<FieldEvent>() {
      public void handleEvent(FieldEvent be) {
        boolean simple = type.getSimpleValue().equals("Simple");
        sm.deselectAll();
        sm.setSelectionMode(simple ? SelectionMode.SIMPLE : SelectionMode.MULTI);
      }
    });

    toolBar.add(type);
    toolBar.add(new SeparatorToolItem());
    cp.setTopComponent(toolBar);

    cp.add(grid);
    panel.add(cp);
  }
View Full Code Here

    ListStore<Stock> store = new ListStore<Stock>();
    store.add(stocks);

    ColumnModel cm = new ColumnModel(configs);

    ContentPanel cp = new ContentPanel();
    cp.setHeading("Expander Rows, Collapse and Auto Fill");
    cp.setIcon(Resources.ICONS.table());
    cp.setAnimCollapse(false);
    cp.setCollapsible(true);
    cp.setLayout(new FitLayout());
    cp.setSize(600, 300);

    Grid<Stock> grid = new Grid<Stock>(store, cm);
    grid.addPlugin(expander);
    grid.setColumnReordering(true);
    grid.getView().setAutoFill(true);
    grid.getAriaSupport().setLabelledBy(cp.getHeader().getId() + "-label");
    cp.add(grid);

    panel.add(cp);
  }
View Full Code Here

    ListStore<Stock> store = new ListStore<Stock>();
    store.add(stocks);

    ColumnModel cm = new ColumnModel(configs);

    ContentPanel cp = new ContentPanel();
    cp.setHeading("Support for standard Panel features such as framing, buttons and toolbars");
    cp.setFrame(true);
    cp.setIcon(Resources.ICONS.table());
    cp.addButton(new Button("Save"));
    cp.addButton(new Button("Cancel"));
    cp.setButtonAlign(HorizontalAlignment.CENTER);
    cp.setLayout(new FitLayout());
    cp.setSize(600, 300);

    ToolBar toolBar = new ToolBar();
    toolBar.getAriaSupport().setLabel("Grid Options");
    toolBar.add(new Button("Add", Resources.ICONS.add()));
    toolBar.add(new SeparatorToolItem());
    toolBar.add(new Button("Remove", Resources.ICONS.delete()));
    toolBar.add(new SeparatorToolItem());
    toolBar.add(new Button("Configure", Resources.ICONS.plugin()));
    cp.setTopComponent(toolBar);

    Grid<Stock> grid = new Grid<Stock>(store, cm);
    grid.setSelectionModel(sm);
    grid.setAutoExpandColumn("name");
    grid.setColumnReordering(true);
    grid.setBorders(true);
    grid.addPlugin(sm);
    grid.getAriaSupport().setLabelledBy(cp.getHeader().getId() + "-label");
    cp.add(grid);
    panel.add(cp);
  }
View Full Code Here

      }

    });
    btn.setIcon(Resources.ICONS.delete());

    ContentPanel cp = new ContentPanel();
    cp.setHeading("Grid with Numbered Rows and Force Fit");
    cp.setIcon(Resources.ICONS.table());
    cp.setLayout(new FitLayout());
    cp.setSize(600, 300);
    cp.add(grid);
    cp.addButton(btn);
    grid.getAriaSupport().setLabelledBy(cp.getHeader().getId() + "-label");
    panel.add(cp);
  }
View Full Code Here

          }
        }
      }
    });

    ContentPanel main = new ContentPanel();
    main.setBorders(true);
    main.setBodyBorder(false);
    main.setLayout(new FitLayout());
    main.setHeaderVisible(false);

    ToolBar bar = new ToolBar();
    bar.add(new LabelToolItem("Filter:"));

    StoreFilterField<BeanModel> field = new StoreFilterField<BeanModel>() {
      @Override
      protected boolean doSelect(Store<BeanModel> store, BeanModel parent, BeanModel record, String property,
          String filter) {
        Photo photo = record.getBean();
        String name = photo.getName().toLowerCase();
        if (name.indexOf(filter.toLowerCase()) != -1) {
          return true;
        }
        return false;
      }

      @Override
      protected void onFilter() {
        super.onFilter();
        view.getSelectionModel().select(0, false);
      }

    };
    field.setWidth(100);
    field.bind(store);

    bar.add(field);
    bar.add(new SeparatorToolItem());
    bar.add(new LabelToolItem("Sort By:"));

    sort = new SimpleComboBox<String>();
    sort.setTriggerAction(TriggerAction.ALL);
    sort.setEditable(false);
    sort.setForceSelection(true);
    sort.setWidth(90);
    sort.add("Name");
    sort.add("File Size");
    sort.add("Last Modified");
    sort.setSimpleValue("Name");
    sort.addListener(Events.Select, new Listener<FieldEvent>() {
      public void handleEvent(FieldEvent be) {
        sort();
      }
    });

    bar.add(sort);

    main.setTopComponent(bar);

    view = new ListView<BeanModel>() {
      @Override
      protected BeanModel prepareData(BeanModel model) {
        Photo photo = model.getBean();
        long size = photo.getSize() / 1000;
        model.set("shortName", Format.ellipse(photo.getName(), 15));
        model.set("sizeString", NumberFormat.getFormat("#0").format(size) + "k");
        model.set("dateString", DateTimeFormat.getMediumDateTimeFormat().format(photo.getDate()));
        model.set("modPath", GWT.getHostPageBaseURL() + photo.getPath());
        return model;
      }
    };
    view.setId("img-chooser-view");
    view.setTemplate(getTemplate());
    view.setBorders(false);
    view.setStore(store);
    view.setItemSelector("div.thumb-wrap");
    view.getSelectionModel().setSelectionMode(SelectionMode.SINGLE);
    view.getSelectionModel().addListener(Events.SelectionChange, new Listener<SelectionChangedEvent<BeanModel>>() {
      public void handleEvent(SelectionChangedEvent<BeanModel> be) {
        onSelectionChange(be);
      }
    });
    main.add(view);

    details = new LayoutContainer();
    details.setBorders(true);
    details.setStyleAttribute("backgroundColor", "white");
View Full Code Here

    ListLoader<ListLoadResult<Photo>> loader = new BaseListLoader<ListLoadResult<Photo>>(
        proxy, new BeanModelReader());
    ListStore<BeanModel> store = new ListStore<BeanModel>(loader);
    loader.load();

    final ContentPanel panel = new ContentPanel();
    panel.setCollapsible(true);
    panel.setAnimCollapse(false);
    panel.setFrame(true);
    panel.setHeading("CheckBox ListView (0 items selected)");
    panel.setWidth(300);
    panel.setAutoHeight(true);
    panel.setBodyBorder(false);

    final CheckBoxListView<BeanModel> view = new CheckBoxListView<BeanModel>() {
      @Override
      protected BeanModel prepareData(BeanModel model) {
        String s = model.get("name");
        model.set("shortName", Format.ellipse(s, 15));
        return model;
      }

    };

    view.setStore(store);
    view.setDisplayProperty("name");
    view.getSelectionModel().addListener(Events.SelectionChange,
        new Listener<SelectionChangedEvent<BeanModel>>() {

          public void handleEvent(SelectionChangedEvent<BeanModel> be) {
            panel.setHeading("CheckBox ListView (" + be.getSelection().size()
                + " items selected)");
          }

        });
    panel.add(view);

    panel.addButton(new Button("get checked items", new SelectionListener<ButtonEvent>() {

      @Override
      public void componentSelected(ButtonEvent ce) {
        Info.display("Checked Items", "There are " + view.getChecked().size()
            + " items checked!");
View Full Code Here

    });
    grid.setLoadMask(true);
    grid.setBorders(true);
    grid.setAutoExpandColumn("forum");

    ContentPanel panel = new ContentPanel();
    panel.setFrame(true);
    panel.setCollapsible(true);
    panel.setAnimCollapse(false);
    panel.setIcon(Resources.ICONS.table());
    panel.setHeading("Paging Grid");
    panel.setLayout(new FitLayout());
    panel.add(grid);
    panel.setSize(600, 350);
    panel.setBottomComponent(toolBar);
    grid.getAriaSupport().setLabelledBy(panel.getId());
    add(panel);
  }
View Full Code Here

TOP

Related Classes of com.extjs.gxt.ui.client.widget.ContentPanel

Copyright © 2018 www.massapicom. All rights reserved.
All source code are property of their respective owners. Java is a trademark of Sun Microsystems, Inc and owned by ORACLE Inc. Contact coftware#gmail.com.