1. #1
    Ext User
    Join Date
    Aug 2009
    Posts
    4
    Vote Rating
    0
    matthias.schuldner is on a distinguished road

      0  

    Question Truncated ContextMenu after adding menuitem on the fly

    Truncated ContextMenu after adding menuitem on the fly


    Hello,

    if I extend a contextmenu with a new menuitem on a grid just before rendering the menu the menu will render only the first time correctly. I attached two screenshots to demonstrate my problem. the contextmenu is truncated after extending.

    I' running GWT 1.7.1 and GXT 2.0.1, Firefox 3.0.11, Ubuntu 9.04.

    Same behaviour with Windows XP SP 2 and Firefox. Internet explorer 7 and hosted mode under Windows works fine.

    Thanks,

    Matthias

    My Demo App:

    Code:
    package com.test.client;
    
    import java.io.Serializable;
    import java.util.ArrayList;
    import java.util.List;
    
    import com.extjs.gxt.ui.client.Style.HorizontalAlignment;
    import com.extjs.gxt.ui.client.data.BaseModel;
    import com.extjs.gxt.ui.client.event.Events;
    import com.extjs.gxt.ui.client.event.GridEvent;
    import com.extjs.gxt.ui.client.event.Listener;
    import com.extjs.gxt.ui.client.store.ListStore;
    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.menu.Menu;
    import com.extjs.gxt.ui.client.widget.menu.MenuItem;
    import com.google.gwt.core.client.EntryPoint;
    import com.google.gwt.user.client.ui.RootPanel;
    
    public class GridExamples implements EntryPoint {
    
        public void onModuleLoad() {
            
            ArrayList<CarModel> cars = addcars();
    
            ListStore<CarModel> store = new ListStore<CarModel>();
            store.add(cars);
    
            List<ColumnConfig> col = new ArrayList<ColumnConfig>();
    
            ColumnConfig column = new ColumnConfig();
            column.setId("car_make");
            column.setHeader("Make");
            column.setWidth(500);
            col.add(column);
    
            column = new ColumnConfig();
            column.setId("car_model");
            column.setHeader("Model");
            column.setWidth(500);
            col.add(column);
    
            column = new ColumnConfig();
            column.setId("car_year");
            column.setHeader("Year");
            column.setWidth(50);
            column.setAlignment(HorizontalAlignment.RIGHT);
            col.add(column);
    
            ColumnModel cm = new ColumnModel(col);
    
            Grid<CarModel> lGrid = new Grid<CarModel>(store, cm);
            lGrid.setBorders(false);
            lGrid.setHeight(300);
    
            MyMenu lMyMenu = new MyMenu();
            lGrid.setContextMenu(lMyMenu);
    
            lGrid.addListener(Events.ContextMenu, new RowClickListener(lMyMenu));
    
            RootPanel.get().add(lGrid);
        }
    
        public class RowClickListener implements Listener<GridEvent> {
            MyMenu _menu;
    
            public RowClickListener(MyMenu pMyMenu) {
                _menu = pMyMenu;
            }
    
            public void handleEvent(final GridEvent pGridEvent) {
                _menu.prepare();
            }
        }
    
        private static class MyMenu extends Menu {
            public void prepare() {
                MenuItem lAnotherMenuItem = new MenuItem();
                lAnotherMenuItem.setText("Another entry (on the fly)");
                add(lAnotherMenuItem);
                layout();
            }
    
            public MyMenu() {
                super();
                MenuItem lFirstMenuItem = new MenuItem();
                lFirstMenuItem.setText("entry 1");
                add(lFirstMenuItem);
    
                MenuItem lSecondMenuItem = new MenuItem();
                lSecondMenuItem.setText("entry 2");
                add(lSecondMenuItem);
    
            }
        }
    
        private ArrayList<CarModel> addcars() {
            ArrayList<CarModel> cars = new ArrayList<CarModel>();
            cars.add(new CarModel("SAAB", "9000", 1994, 3550.50));
            cars.add(new CarModel("SAAB", "93", 2001, 12450.00));
            cars.add(new CarModel("BMW", "318i", 1999, 13440.10));
            cars.add(new CarModel("BMW", "X5", 2005, 46020.50));
            cars.add(new CarModel("VW", "GOLF", 2001, 16200.60));
            cars.add(new CarModel("VW", "PASSAT", 2007, 67400.00));
            cars.add(new CarModel("Peugeot", "307", 2001, 13200.00));
            cars.add(new CarModel("Peugeot", "205 GTI", 1986, 5430.15));
            cars.add(new CarModel("Lexus", "ES 300", 2001, 32100.80));
            return cars;
        }
    
        public class CarModel extends BaseModel implements Serializable {
            private static final long serialVersionUID = 1L;
    
            public CarModel(String mk, String ml, Integer y) {
                set("car_make", mk);
                set("car_model", ml);
                set("car_year", y);
            }
    
            public CarModel(String mk, String ml, Integer y, Double v) {
                this(mk, ml, y);
                set("car_value", v);
            }
    
            public String getMake() {
                return (String) get("car_make");
            }
    
            public Integer getYear() {
                return (Integer) get("car_year");
            }
        }
    }
    Edit:
    Further debugging shows that the calculation of the width fails in method MenuLayout.doAutoSize().
    Perhaps move issue to bugs?
    Attached Images

  2. #2
    Software Architect
    Join Date
    Sep 2007
    Posts
    13,966
    Vote Rating
    130
    sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light

      0  

    Default


    There was a small issue that already got fixed in SVN and was part of GXT 2.0.2

  3. #3
    Ext GWT Premium Member
    Join Date
    Oct 2009
    Location
    Bremen, Germany
    Posts
    30
    Vote Rating
    0
    jahrens is on a distinguished road

      0  

    Default Problem still exists!

    Problem still exists!


    Greetings, It looks like this problem still exists within gxt 2.1.3. We have an contextmenu where we make items invisble/invisible just before rendering (like in the above code the adding). If the first time the menu is rendered the longest entry is not visible it will be truncated when it becomes visible later (only happens in firefox). If it is visible the first time the menu is rendered everything is fine. Same problem does apply when we remove the invisible items and add the visible ones (which we've done earlier). regards, Jürgen

  4. #4
    Software Architect
    Join Date
    Sep 2007
    Posts
    13,966
    Vote Rating
    130
    sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light

      0  

    Default


    Can you please post a fully working testcase that implements EntryPoint and shows your problem? The sample code above works fine for me against GXT 2.2.0

  5. #5
    Ext GWT Premium Member
    Join Date
    Oct 2009
    Location
    Bremen, Germany
    Posts
    30
    Vote Rating
    0
    jahrens is on a distinguished road

      0  

    Default


    It looks like the problem originates in the css-entry a.x-menu-item: it contains the following: white-spaces : nowrap (gxt-all.css, line 3834).

    regards,
    Jürgen

  6. #6
    Ext GWT Premium Member
    Join Date
    Oct 2009
    Location
    Bremen, Germany
    Posts
    30
    Vote Rating
    0
    jahrens is on a distinguished road

      0  

    Default


    I've modified the above Code to show our problem:
    If the usage of the gxt-all.css is necessary.

    Code:
    package com.test.client;
    
    import java.io.Serializable;
    import java.util.ArrayList;
    import java.util.List;
    
    import com.extjs.gxt.ui.client.Style.HorizontalAlignment;
    import com.extjs.gxt.ui.client.data.BaseModel;
    import com.extjs.gxt.ui.client.event.Events;
    import com.extjs.gxt.ui.client.event.GridEvent;
    import com.extjs.gxt.ui.client.event.Listener;
    import com.extjs.gxt.ui.client.store.ListStore;
    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.menu.Menu;
    import com.extjs.gxt.ui.client.widget.menu.MenuItem;
    import com.google.gwt.core.client.EntryPoint;
    import com.google.gwt.user.client.ui.RootPanel;
    
    public class GridExamples implements EntryPoint {
    
        public void onModuleLoad() {
    
            ArrayList<CarModel> cars = addcars();
    
            ListStore<CarModel> store = new ListStore<CarModel>();
            store.add(cars);
    
            List<ColumnConfig> col = new ArrayList<ColumnConfig>();
    
            ColumnConfig column = new ColumnConfig();
            column.setId("car_make");
            column.setHeader("Make");
            column.setWidth(500);
            col.add(column);
    
            column = new ColumnConfig();
            column.setId("car_model");
            column.setHeader("Model");
            column.setWidth(500);
            col.add(column);
    
            column = new ColumnConfig();
            column.setId("car_year");
            column.setHeader("Year");
            column.setWidth(50);
            column.setAlignment(HorizontalAlignment.RIGHT);
            col.add(column);
    
            ColumnModel cm = new ColumnModel(col);
    
            Grid<CarModel> lGrid = new Grid<CarModel>(store, cm);
            lGrid.setBorders(false);
            lGrid.setHeight(300);
    
            MyMenu lMyMenu = new MyMenu();
            lGrid.setContextMenu(lMyMenu);
    
            lGrid.addListener(Events.ContextMenu, new RowClickListener(lMyMenu));
    
            RootPanel.get().add(lGrid);
        }
    
        public class RowClickListener implements Listener<GridEvent> {
            MyMenu _menu;
            boolean toogle = true;
            public RowClickListener(MyMenu pMyMenu) {
                _menu = pMyMenu;
            }
    
            public void handleEvent(final GridEvent pGridEvent) {
                _menu.prepare(toogle);
                toogle = !toogle;
            }
        }
    
        private static class MyMenu extends Menu {
          private static final boolean USE_REMOVE = false;
          private MenuItem item_1;
          private MenuItem item_2;
          private MenuItem item_3;
            public void prepare(boolean toogle) {
              if(USE_REMOVE) {
                this.removeAll();
                if(toogle) {
                  add(item_1);
                }
                else {
                  add(item_2);
                }
                add(item_3);
              }
              else {
                item_1.setVisible(toogle);
                item_2.setVisible(!toogle);
              }
              layout();
            }
            private MenuItem createItem(String text) {
              final MenuItem rVal = new MenuItem();
              rVal.setText(text);
              add(rVal);
              return rVal;
            }
    
    
            public MyMenu() {
                super();
                this.item_1 = createItem("First Item");
                this.item_2 = createItem("Second Item (with very long name)");
                this.item_3 = createItem("Last Item");
            }
        }
    
        private ArrayList<CarModel> addcars() {
            ArrayList<CarModel> cars = new ArrayList<CarModel>();
            cars.add(new CarModel("SAAB", "9000", 1994, 3550.50));
            cars.add(new CarModel("SAAB", "93", 2001, 12450.00));
            cars.add(new CarModel("BMW", "318i", 1999, 13440.10));
            cars.add(new CarModel("BMW", "X5", 2005, 46020.50));
            cars.add(new CarModel("VW", "GOLF", 2001, 16200.60));
            cars.add(new CarModel("VW", "PASSAT", 2007, 67400.00));
            cars.add(new CarModel("Peugeot", "307", 2001, 13200.00));
            cars.add(new CarModel("Peugeot", "205 GTI", 1986, 5430.15));
            cars.add(new CarModel("Lexus", "ES 300", 2001, 32100.80));
            return cars;
        }
    
        public class CarModel extends BaseModel implements Serializable {
            private static final long serialVersionUID = 1L;
    
            public CarModel(String mk, String ml, Integer y) {
                set("car_make", mk);
                set("car_model", ml);
                set("car_year", y);
            }
    
            public CarModel(String mk, String ml, Integer y, Double v) {
                this(mk, ml, y);
                set("car_value", v);
            }
    
            public String getMake() {
                return (String) get("car_make");
            }
    
            public Integer getYear() {
                return (Integer) get("car_year");
            }
        }
    }

  7. #7
    Software Architect
    Join Date
    Sep 2007
    Posts
    13,966
    Vote Rating
    130
    sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light sven is a glorious beacon of light

      0  

    Default


    Thanks for reporting this. I will look into it.

  8. #8
    Sencha Premium Member
    Join Date
    Nov 2010
    Posts
    42
    Vote Rating
    0
    ravikiran1226 is on a distinguished road

      0  

    Default


    This problem still exists in the following GXT ver#2.2.5

    Sven do you have any update on it

  9. #9
    Sencha Premium Member
    Join Date
    May 2010
    Posts
    16
    Vote Rating
    0
    KeanuLee is on a distinguished road

      0  

    Default


    Hi Sven,
    I also found this issue when I added menu item to a button menu dynamically,
    The menu width won't be adjusted automatically whenever new item is added.
    BTW, like ravikiran1226 mentioned, it still happens in GXT 2.2.5 .

    Updated [workaround]:
    To update menu size whenever new menu item is added.
    Using TextMetrics to calculate menu item width according to it's text, then compare to menu width and updated it when item width is large than menu

    The way to calculate menu width (that's the same way in Menu:doAutoSize())
    menu.getLayoutTarget().getWidth() + menu.el().getFrameWidth("lr")

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