1. #1
    Sencha User
    Join Date
    Aug 2011
    Posts
    6
    Vote Rating
    0
    david.ln is on a distinguished road

      0  

    Default Unanswered: Treegrid - modify text style for some rows

    Unanswered: Treegrid - modify text style for some rows


    Hello,

    I'm trying to change row style in a treegrid only for some rows.
    Based on some logic, I want to gray the text and/or make it italic.
    I found some posts for background colors but not for text.

    I first tried to override render in TreeGridCellRenderer:

    Code:
    @Override
        public Object render(final ModelData model, String property, final ColumnData config,
                final int rowIndex, final int colIndex, ListStore<ModelData> store, final Grid<ModelData> grid) {
            
    Scheduler.get().scheduleDeferred(new ScheduledCommand() {
                
                @Override
                public void execute() {
                    if(model != null) {
                        
                        Object myBoolean = model.get("myboolean");
                        if(myBoolean != null && ((Boolean)myBoolean)) {
                            grid.getView().getRow(rowIndex).getStyle().setColor("gray");
                            //here I cannot find any way to set the text as italic for the row
                            // I also trid with config.style=".." but it seems to work cell only  for backgroud color           
                        } 
    
                    }
                    
                }
            });
    
            return super.render(model, property, config, rowIndex, colIndex, store, grid);
        }
    This works for the "color" attribute. (note that I had to remove color:black from gxt css for x-tree3-node-text)
    but using the deferred command create a tiny - but visible - latency in style update.

    Then I tried to use a GridViewConfig

    Code:
    tree.getView().setViewConfig(new GridViewConfig(){
    
    StringBuilder sb = new StringBuilder();
            
            if(model != null) {
                
                Object myBoolean = model.get("myboolean");
                if(myBoolean != null && ((Boolean)myBoolean)) {
                    sb.append(" inactive"); // css : .inactive {    color:gray; }
                }
                
                Object myBoolean2 = model.get("myboolean2");
                 if(myBoolean2 != null && ((Boolean)myBoolean2)) {
                    sb.append(" noSelectable"); // .noSelectable {   font-style:italic; }
                }
            }
    });
    
            return super.render(model, property, config, rowIndex, colIndex, store, grid);
    }
    This works better (no latency) for the gray color but still not for italic.
    The style applies on <tr> (in firebug) but seems to be overriden by text style of the cells (?). The computed style is italic for text from row start <div> to the first <td> in which it is normal.

    For this <td> in firebug, if i remove (even just the 11px)

    Code:
    .x-grid3-hd-row .x-grid3-hd, .x-grid3-row .x-grid3-cell, .x-grid3-summary-row .x-grid3-cell {
        font: 11px arial,tahoma,helvetica,sans-serif;
    }
    I got italic on all columns of the required row but not for the tree cell. And the text lose its size ...
    I cannot find any css to remove or add to have the tree cell in italic ...

    I think I saw something about using a widget renderer for the tree cell styling but it makes too much code for a so simple use case. So I didn't try.

    What should I do ? I really miss CSS skill and I guess I'm not so far of the solution ...
    Should I remove the text style for cells (how ?)

    Hope someone will have an idea !

    Regards

    David

  2. #2
    Sencha User
    Join Date
    Aug 2011
    Posts
    6
    Vote Rating
    0
    david.ln is on a distinguished road

      0  

    Default


    Hello,

    I finally managed to change the font style of the row with GridViewConfig but I had to modify the css

    Code:
    .x-grid3-hd-row .x-grid3-hd,.x-grid3-row .x-grid3-cell,.x-grid3-summary-row .x-grid3-cell {
      /*font: normal 11px arial, tahoma, helvetica, sans-serif;*/
      font-size:11px;
    }
    
    .x-tree3-node-text {
        /*font: normal 11px arial, tahoma, helvetica, sans-serif;*/
        /*color: black;*/
    }
    Is there a cleaner way to achieve that ?
    Can I override these styles differently or somewhere else ?

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