Hybrid View

  1. #1
    Sencha User
    Join Date
    Jul 2011
    Posts
    13
    Vote Rating
    0
    chuckie474 is on a distinguished road

      0  

    Default Adding multiple grids to UiBinder

    Adding multiple grids to UiBinder


    Is it possible to add multiple grids to a single uiBinder ui.xml file? For example, I need to do something like this:

    <container:VerticalLayoutContainer>
    <container:child>
    <gxt:ContentPanel ui:field="panel" headingText="Table 1"> <grid:Grid ui:field="grid1" cm="{cm1}" store="{store1}" view="{view1}" /> </gxt:ContentPanel>
    </container:child>
    <container:child>
    <gxt:ContentPanel ui:field="panel" headingText="Table 2"> <grid:Grid ui:field="grid2" cm="{cm2}" store="{store2}" view="{view2}"/> </gxt:ContentPanel>
    <container:child>
    </container:VerticalLayoutContainer>


    And when I try to compile and run, it requires me to add an @UiFactory to initialize the column model, store and view. However I can only initialize one of each. If I initialize them for table 1, then table 2 displays the column model, store and view from table 1. Has anyone done this before and if so, what am I doing wrong?

  2. #2
    Sencha - GXT Dev Team jhickman's Avatar
    Join Date
    Feb 2011
    Location
    Missouri
    Posts
    10
    Vote Rating
    0
    jhickman is on a distinguished road

      0  

    Default


    It is possible to add multiple Grids to a single UiBinder xml file. There are multiple ways this can be done. I've listed 3 below, but I'm sure there are even more ways this can work.

    One approach would be to create the Grid instances in the owner class and use a @UiField(provided = true). This tells UiBinder to use the instances the owner class creates rather than instantiating a new Grid instances. That would look something like this:

    Code:
      @UiField(provided = true)   Grid<Stock> grid1;
      @UiField(provided = true)   Grid<Stock> grid2;
    
      public Widget asWidget() {
        grid1 = new Grid(....);
        grid2 = new Grid(....);
        return uiBinder.createAndBindUi(this);
      }
    The XML would then reference those fields with the ui:field attribute:

    Code:
      <grid:Grid ui:field="grid1" />
      ...
      <grid:Grid ui:field="grid2" />
    If you're wanting more of the Widget creation in the XML, then you can always provide the required Grid constructor parameters in a similar manner.
    Code:
      @UiField(provided = true)   ColumnModel<Stock> columnModel1;
      @UiField(provided = true)   ListStore<Stock> store1;
      @UiField(provided = true)   GridView<Stock> gridView1;
    Then, in the XML, you'll have to use <ui:with> elements.
    Code:
      <ui:with type="com.sencha.gxt.widget.core.client.grid.ColumnModel" field="columnModel1" />
      ....
      <grid:Grid cm="{columnModel1}" store="{store1}" view="{gridView1}" />
    If you want to continue to use the @UiFactory as you described, you'll have to pass some kind of indicator as a method parameter. This can be an enum, boolean, String, or whatever you choose. Here's an example of a @UiFactory for multiple ColumnModel instances using an integer to decide which one to create. (note that using <ui:attributes> inside <ui:with> requires GWT 2.5.0, or if you're using GWT 2.4.0 you would use the uibinder-bridge jar to get this feature)
    Code:
        <ui:with type="com.sencha.gxt.widget.core.client.grid.ColumnModel" field="columnModel1">
            <ui:attributes which="1" />
        </ui:with>
        <ui:with type="com.sencha.gxt.widget.core.client.grid.ColumnModel" field="columnModel2">
             <ui:attributes which="2" />
        </ui:with>
    In the owner class, you'd have the following factory method:

    Code:
      @UiFactory
      public ColumnModel<Stock> createColumnModel(int which) {
      switch(which) {
        case 1:
          ColumnModel cm = ...
          return cm;
        case 2: 
          // alternatively delegate to private methods
          return createColumnModelForGrid2();
      }
      }

  3. #3
    Sencha User
    Join Date
    Jul 2011
    Posts
    13
    Vote Rating
    0
    chuckie474 is on a distinguished road

      0  

    Default


    Thanks! I will try that!

    One way I had worked around it too was to put each grid into its own ui.xml file, so I had TableWidget1.java with its TableWidget1.ui.xml and TableWidget2.java with its TableWidget2.ui.xml and embedded those into my MainWidget.ui.xml. It isn't ideal, but it works.

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar