Hybrid View

  1. #1
    Ext User
    Join Date
    Oct 2008
    Posts
    35
    Vote Rating
    0
    sbarkdull is on a distinguished road

      0  

    Default [1.1.4, 1.1.3]Grid in ContentPanel shows large blank space at bottom of grid

    [1.1.4, 1.1.3]Grid in ContentPanel shows large blank space at bottom of grid


    I have a UI that consists of a Viewport, with a borderLayout(), using just the North and Center areas. In those 2 areas I place a grid. The grids display a 50-100 pixel tall blank area at the base of each grid. I can't figure out what is causing this, and I would like to make them (the blank space) go away. (See attached image.)
    Code is below:

    package snb.client;

    import java.util.ArrayList;
    import java.util.List;

    import snb.client.bean.Stock;

    import com.extjs.gxt.ui.client.Style.HorizontalAlignment;
    import com.extjs.gxt.ui.client.Style.LayoutRegion;
    import com.extjs.gxt.ui.client.store.ListStore;
    import com.extjs.gxt.ui.client.util.Margins;
    import com.extjs.gxt.ui.client.widget.ContentPanel;
    import com.extjs.gxt.ui.client.widget.Viewport;
    import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;
    import com.extjs.gxt.ui.client.widget.grid.ColumnModel;
    import com.extjs.gxt.ui.client.widget.grid.Grid;
    import com.extjs.gxt.ui.client.widget.layout.BorderLayout;
    import com.extjs.gxt.ui.client.widget.layout.BorderLayoutData;
    import com.extjs.gxt.ui.client.widget.layout.FitLayout;
    import com.google.gwt.core.client.EntryPoint;
    import com.google.gwt.i18n.client.DateTimeFormat;
    import com.google.gwt.user.client.ui.RootPanel;

    /**
    * Entry point classes define <code>onModuleLoad()</code>.
    */
    public class MinTestResize implements EntryPoint {

    /**
    * This is the entry point method.
    */
    public void onModuleLoad() {

    Viewport vp = new Viewport();
    BorderLayout bLayout = new BorderLayout();
    vp.setLayout(bLayout);

    BorderLayoutData northData = new BorderLayoutData(LayoutRegion.NORTH );
    northData.setSplit(true);
    northData.setMargins( new Margins( 0) );

    BorderLayoutData centerData = new BorderLayoutData(LayoutRegion.CENTER );
    centerData.setSplit(true);
    centerData.setMargins( new Margins( 0) );


    ContentPanel cpNorth = new ContentPanel(new FitLayout());
    ContentPanel cpCenter = new ContentPanel(new FitLayout());

    cpNorth.setFrame( true );
    cpNorth.setFooter( false );
    cpCenter.setFrame( true );
    cpCenter.setFooter( false );

    final Grid<Stock> grid1 = makeGrid();
    final Grid<Stock> grid2 = makeGrid();
    grid2.setHideHeaders( false );

    cpNorth.add(grid1);
    cpCenter.add(grid2);

    vp.add( cpNorth, northData );
    vp.add( cpCenter, centerData );

    RootPanel.get().add(vp);
    }

    private Grid<Stock> makeGrid() {

    ListStore<Stock> store = new ListStore<Stock>();

    List<Stock> l = new ArrayList<Stock>();
    for ( int ii=0; ii<200; ++ii ) {
    Stock m = new Stock();
    m.set( "name", ((String)m.get( "name" )) + ii );
    l.add( m );
    }
    store.add(l);

    List<ColumnConfig> configs = new ArrayList<ColumnConfig>();

    ColumnConfig column = new ColumnConfig();
    column.setId("name");
    column.setHeader("Company");
    column.setWidth(100);
    configs.add(column);

    column = new ColumnConfig();
    column.setId("symbol");
    column.setHeader("Symbol");
    column.setWidth(100);
    configs.add(column);

    column = new ColumnConfig();
    column.setId("last");
    column.setHeader("Last");
    column.setAlignment(HorizontalAlignment.RIGHT);
    column.setWidth(75);
    configs.add(column);

    column = new ColumnConfig("change", "Change", 100);
    column.setAlignment(HorizontalAlignment.RIGHT);
    configs.add(column);

    column = new ColumnConfig("date", "Last Updated", 100);
    column.setAlignment(HorizontalAlignment.RIGHT);
    column.setDateTimeFormat(DateTimeFormat.getShortDateFormat());
    configs.add(column);

    ColumnModel cm = new ColumnModel(configs);

    Grid<Stock> grid = new Grid<Stock>(store, cm);
    grid.setLoadMask( true );
    grid.getView().setAutoFill( true );
    grid.setBorders(true);
    grid.setStripeRows( true );
    grid.setAutoExpandMax( 400 );
    return grid;
    }
    }


    /*
    * Ext GWT - Ext for GWT
    * Copyright(c) 2007, 2008, Ext JS, LLC.
    * licensing@extjs.com
    *
    * http://extjs.com/license
    */
    package snb.client.bean;

    import java.util.Date;

    import com.extjs.gxt.ui.client.data.BaseModel;
    import com.google.gwt.i18n.client.DateTimeFormat;

    public class Stock extends BaseModel {

    private static DateTimeFormat format = DateTimeFormat.getFormat("M/d h:mma");

    public Stock() {
    set("name", "Citrix ");
    set("symbol", "CTX");
    set("open", 3);
    set("last", 5);
    set("date", new Date());
    set("change", 2);
    }

    public Stock(String name, String symbol, double open, double last) {
    set("name", name);
    set("symbol", symbol);
    set("open", open);
    set("last", last);
    set("date", new Date());
    set("change", last - open);
    }

    public Stock(String name, double open, double change, double pctChange, String date, String industry) {
    set("name", name);
    set("open", open);
    set("change", change);
    set("percentChange", pctChange);
    set("date", format.parse(date));
    set("industry", industry);
    }

    public String getIndustry() {
    return get("industry");
    }

    public void setIndustry(String industry) {
    set("industry", industry);
    }

    public Date getLastTrans() {
    return (Date) get("date");
    }

    public String getName() {
    return (String) get("name");
    }

    public String getSymbol() {
    return (String) get("symbol");
    }

    public double getOpen() {
    Double open = (Double) get("open");
    return open.doubleValue();
    }

    public double getLast() {
    Double open = (Double) get("last");
    return open.doubleValue();
    }

    public double getChange() {
    return getLast() - getOpen();
    }

    public double getPercentChange() {
    return getChange() / getOpen();
    }

    public String toString() {
    return getName();
    }

    }
    Attached Images
    Last edited by sbarkdull; 26 Nov 2008 at 5:10 PM. Reason: add more information

  2. #2
    Sencha - GXT Dev Team darrellmeyer's Avatar
    Join Date
    May 2007
    Location
    Washington, DC
    Posts
    2,241
    Vote Rating
    2
    darrellmeyer is on a distinguished road

      0  

    Default


    The code you posted works as expected for me. I tested in Safari windows and mac. The screenshot you posted is not from the code you posted. Are you having issue with the test code?

  3. #3
    Ext User
    Join Date
    Oct 2008
    Posts
    35
    Vote Rating
    0
    sbarkdull is on a distinguished road

      0  

    Default Correct Image, doh!

    Correct Image, doh!


    Oops, I am posting the correct image of the app. See the blank area under the text "How do I get rid of this blank area under the text".
    Attached Images

  4. #4
    Sencha User
    Join Date
    Mar 2011
    Posts
    1
    Vote Rating
    0
    yih579 is on a distinguished road

      0  

    Default


    Quote Originally Posted by sbarkdull View Post
    Oops, I am posting the correct image of the app. See the blank area under the text "How do I get rid of this blank area under the text".
    Hi, did you ever find a fix for this, I'm seeing the same problem?

    Thanks.

  5. #5
    Sencha User poojagarg89's Avatar
    Join Date
    Sep 2011
    Location
    Ahmedabad,India
    Posts
    213
    Vote Rating
    0
    poojagarg89 is on a distinguished road

      0  

    Default Use viewConfig

    Use viewConfig


    dont specify the size of GridPanel
    and use

    Code:
    layout: 'fit',
    viewConfig: {
                forceFit: true
            },
    in GridPanel inspite of giving width and height...!
    u'll get rid of that empty space

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