Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
Hi Derrell, thanks a lot for this example. It works fine! It seems easy if you know how to do :-) best regards Hansjoerg Derrell Lipman wrote: > > On Fri, Feb 5, 2010 at 03:55, Qoodary wrote: > >> >> Hi Derrell, >> >> I have a question to your playground example. >> As I understand, the cellrenderer checks the value for the column AFTER >> all >> rows are build. >> <> >> How can you do it, if you do not want to show any value in the >> corresponding >> column? >> Example: >> My table is build via PHP request. The data comes from a MySQL DB. >> The first column is "State" which should show only a different color >> without >> an value. >> For this column, I can receive from the request either the color value >> (in >> hex) or an ID. >> But I do not want to show the ID or color value in the column, only the >> background-color. >> >> How can you do this? >> > > You mean like this? > > http://demo.qooxdoo.org/devel/playground/#%7B%22code%22%3A%20%22qx.Class.define%28%2522custom.MyCellRenderer%2522%252C%250A%257B%250A%2520%2520extend%2520%253A%2520qx.ui.table.cellrenderer.Default%252C%250A%2520%2520%250A%2520%2520members%2520%253A%250A%2520%2520%257B%250A%2520%2520%2520%2520_getCellStyle%2520%253A%2520function%28cellInfo%29%250A%2520%2520%2520%2520%257B%250A%2520%2520%2520%2520%2520%2520var%2520color%2520%253D%2520cellInfo.value%253B%250A%2520%2520%2520%2520%2520%2520return%2520this.base%28arguments%252C%2520cellInfo%29%2520%252B%2520%2522background-color%253A%2522%2520%252B%2520color%2520%252B%2520%2522%253B%2522%253B%250A%2520%2520%2520%2520%257D%252C%250A%2520%2520%2520%2520%250A%2520%2520%2520%2520_getContentHtml%2520%253A%2520function%28cellInfo%29%250A%2520%2520%2520%2520%257B%250A%2520%2520%2520%2520%2520%2520return%2520%2522%2522%253B%250A%2520%2520%2520%2520%257D%250A%2520%2520%257D%250A%257D%29%253B%250A%250Afunction%2520createRandomRows%28rowCount%29%2520%257B%250A%2520%2520var%2520rowData%2520%253D%2520%255B%255D%253B%250A%2520%2520var%2520now%2520%253D%2520new%2520Date%28%29.getTime%28%29%253B%250A%2520%2520var%2520dateRange%2520%253D%2520400%2520*%252024%2520*%252060%2520*%252060%2520*%25201000%253B%2520%252F%252F%2520400%2520days%250A%2520%2520var%2520nextId%2520%253D%25200%253B%250A%2520%2520for%2520%28var%2520row%2520%253D%25200%253B%2520row%2520%253C%2520rowCount%253B%2520row%252B%252B%29%2520%257B%250A%2520%2520%2520%2520var%2520date%2520%253D%2520new%2520Date%28now%2520%252B%2520Math.random%28%29%2520*%2520dateRange%2520-%2520dateRange%2520%252F%25202%29%253B%250A%2520%2520%2520%2520rowData.push%28%255B%2520nextId%252B%252B%252C%2520%250A%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520row%2520%2525%25202%2520%253D%253D%25201%2520%253F%2520%2522cyan%2522%2520%253A%2520%2522white%2522%252C%250A%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520date%252C%250A%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%28Math.random%28%29%2520%253E%25200.5%29%2520%255D%29%253B%250A%2520%2520%257D%250A%2520%2520return%2520rowData%253B%250A%257D%250A%250A%250A%252F%252F%2520window%250Avar%2520win%2520%253D%2520new%2520qx.ui.window.Window%28%2522Table%2522%29.set%28%257B%250A%2520%2520layout%2520%253A%2520new%2520qx.ui.layout.Grow%28%29%252C%250A%2520%2520allowClose%253A%2520false%252C%250A%2520%2520allowMinimize%253A%2520false%252C%250A%2520%2520contentPadding%253A%25200%250A%257D%29%253B%250Athis.getRoot%28%29.add%28win%29%253B%250Awin.moveTo%2830%252C%252040%29%253B%250Awin.open%28%29%253B%250A%250A%252F%252F%2520table%2520model%250Avar%2520tableModel%2520%253D%2520new%2520qx.ui.table.model.Simple%28%29%253B%250AtableModel.setColumns%28%255B%2520%2522ID%2522%252C%2520%2522A%2520color%2522%252C%2520%2522A%2520date%2522%252C%2520%2522Boolean%2522%2520%255D%29%253B%250AtableModel.setData%28createRandomRows%281000%29%29%253B%250A%250A%252F%252F%2520make%2520second%2520column%2520editable%250AtableModel.setColumnEditable%281%252C%2520true%29%253B%250A%250A%252F%252F%2520table%250Avar%2520table%2520%253D%2520new%2520qx.ui.table.Table%28tableModel%29.set%28%257B%250A%2520%2520decorator%253A%2520null%250A%257D%29%250Awin.add%28table%29%253B%250A%250Avar%2520tcm%2520%253D%2520table.getTableColumnModel%28%29%253B%250A%250A%252F%252F%2520Display%2520a%2520checkbox%2520in%2520column%25203%250Atcm.setDataCellRenderer%283%252C%2520new%2520qx.ui.table.cellrenderer.Boolean%28%29%29%253B%250A%250A%252F%252F%2520Use%2520the%2520custom%2520cell%2520renderer%2520for%2520column%25201%250Atcm.setDataCellRenderer%281%252C%2520new%2520custom.MyCellRenderer%28%29%29%253B%250A%250A%252F%252F%2520use%2520a%2520different%2520header%2520renderer%250Atcm.setHeaderCellRenderer%282%252C%2520new%2520qx.ui.table.headerrenderer.Icon%28%2522icon%252F16%252Fapps%252Foffice-calendar.png%2522%252C%2520%2522A%2520date%2522%29%29%253B%250A%22%7D > > --
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
On Fri, Feb 5, 2010 at 03:55, Qoodary wrote: > > Hi Derrell, > > I have a question to your playground example. > As I understand, the cellrenderer checks the value for the column AFTER all > rows are build. > < > How can you do it, if you do not want to show any value in the > corresponding > column? > Example: > My table is build via PHP request. The data comes from a MySQL DB. > The first column is "State" which should show only a different color > without > an value. > For this column, I can receive from the request either the color value (in > hex) or an ID. > But I do not want to show the ID or color value in the column, only the > background-color. > > How can you do this? > You mean like this? http://demo.qooxdoo.org/devel/playground/#%7B%22code%22%3A%20%22qx.Class.define%28%2522custom.MyCellRenderer%2522%252C%250A%257B%250A%2520%2520extend%2520%253A%2520qx.ui.table.cellrenderer.Default%252C%250A%2520%2520%250A%2520%2520members%2520%253A%250A%2520%2520%257B%250A%2520%2520%2520%2520_getCellStyle%2520%253A%2520function%28cellInfo%29%250A%2520%2520%2520%2520%257B%250A%2520%2520%2520%2520%2520%2520var%2520color%2520%253D%2520cellInfo.value%253B%250A%2520%2520%2520%2520%2520%2520return%2520this.base%28arguments%252C%2520cellInfo%29%2520%252B%2520%2522background-color%253A%2522%2520%252B%2520color%2520%252B%2520%2522%253B%2522%253B%250A%2520%2520%2520%2520%257D%252C%250A%2520%2520%2520%2520%250A%2520%2520%2520%2520_getContentHtml%2520%253A%2520function%28cellInfo%29%250A%2520%2520%2520%2520%257B%250A%2520%2520%2520%2520%2520%2520return%2520%2522%2522%253B%250A%2520%2520%2520%2520%257D%250A%2520%2520%257D%250A%257D%29%253B%250A%250Afunction%2520createRandomRows%28rowCount%29%2520%257B%250A%2520%2520var%2520rowData%2520%253D%2520%255B%255D%253B%250A%2520%2520var%2520now%2520%253D%2520new%2520Date%28%29.getTime%28%29%253B%250A%2520%2520var%2520dateRange%2520%253D%2520400%2520*%252024%2520*%252060%2520*%252060%2520*%25201000%253B%2520%252F%252F%2520400%2520days%250A%2520%2520var%2520nextId%2520%253D%25200%253B%250A%2520%2520for%2520%28var%2520row%2520%253D%25200%253B%2520row%2520%253C%2520rowCount%253B%2520row%252B%252B%29%2520%257B%250A%2520%2520%2520%2520var%2520date%2520%253D%2520new%2520Date%28now%2520%252B%2520Math.random%28%29%2520*%2520dateRange%2520-%2520dateRange%2520%252F%25202%29%253B%250A%2520%2520%2520%2520rowData.push%28%255B%2520nextId%252B%252B%252C%2520%250A%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520row%2520%2525%25202%2520%253D%253D%25201%2520%253F%2520%2522cyan%2522%2520%253A%2520%2522white%2522%252C%250A%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520date%252C%250A%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%2520%28Math.random%28%29%2520%253E%25200.5%29%2520%255D%29%253B%250A%2520%2520%257D%250A%2520%2520return%2520rowData%253B%250A%257D%250A%250A%250A%252F%252F%2520window%250Avar%2520win%2520%253D%2520new%2520qx.ui.window.Window%28%2522Table%2522%29.set%28%257B%250A%2520%2520layout%2520%253A%2520new%2520qx.ui.layout.Grow%28%29%252C%250A%2520%2520allowClose%253A%2520false%252C%250A%2520%2520allowMinimize%253A%2520false%252C%250A%2520%2520contentPadding%253A%25200%250A%257D%29%253B%250Athis.getRoot%28%29.add%28win%29%253B%250Awin.moveTo%2830%252C%252040%29%253B%250Awin.open%28%29%253B%250A%250A%252F%252F%2520table%2520model%250Avar%2520tableModel%2520%253D%2520new%2520qx.ui.table.model.Simple%28%29%253B%250AtableModel.setColumns%28%255B%2520%2522ID%2522%252C%2520%2522A%2520color%2522%252C%2520%2522A%2520date%2522%252C%2520%2522Boolean%2522%2520%255D%29%253B%250AtableModel.setData%28createRandomRows%281000%29%29%253B%250A%250A%252F%252F%2520make%2520second%2520column%2520editable%250AtableModel.setColumnEditable%281%252C%2520true%29%253B%250A%250A%252F%252F%2520table%250Avar%2520table%2520%253D%2520new%2520qx.ui.table.Table%28tableModel%29.set%28%257B%250A%2520%2520decorator%253A%2520null%250A%257D%29%250Awin.add%28table%29%253B%250A%250Avar%2520tcm%2520%253D%2520table.getTableColumnModel%28%29%253B%250A%250A%252F%252F%2520Display%2520a%2520checkbox%2520in%2520column%25203%250Atcm.setDataCellRenderer%283%252C%2520new%2520qx.ui.table.cellrenderer.Boolean%28%29%29%253B%250A%250A%252F%252F%2520Use%2520the%2520custom%2520cell%2520renderer%2520for%2520column%25201%250Atcm.setDataCellRenderer%281%252C%2520new%2520custom.MyCellRenderer%28%29%29%253B%250A%250A%252F%252F%2520use%2520a%2520different%2520header%2520renderer%250Atcm.setHeaderCellRenderer%282%252C%2520new%2520qx.ui.table.headerrenderer.Icon%28%2522icon%252F16%252Fapps%252Foffice-calendar.png%2522%252C%2520%2522A%2520date%2522%29%29%253B%250A%22%7D -- The Planet: dedicated and managed hosting, cloud storage, colocation Stay online with enterprise data centers and the best network in the business Choose flexible plans
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
Hi Derrell, I have a question to your playground example. As I understand, the cellrenderer checks the value for the column AFTER all rows are build. < > On Thu, Feb 4, 2010 at 03:58, Fritz Zaucker > wrote: > >> Hi, >> >> I have a table with say 5 columns. I'd like to have a different >> background >> color in one of these columns (e.g. column 3). >> >> As far as I could figure out the background color is set in the >> RowRenderer, >> but for the whole row. So the next obvious choice would be the >> CellRenderer. >> However, it is not clear to me how the two might interfere in this >> respect. >> >> And (similar) issue arises if I'd like to set a different background >> color >> for a specific cell, e.g. similar to the Conditional CellRenderer (which >> unfortunately only let's me specify styles for the cell content). >> >> I'd appreciate any hints on how to implement something like that. >> > > Here's an example of doing what you ask: > > http://demo.qooxdoo.org/devel/playground/#%7B%22code%22%3A%20%22qx.Class.define%28%2522custom.MyCellRenderer%2522%252C%250A%257B%250A%2520%2520extend%2520%253A%2520qx.ui.table.cellrenderer.Default%252C%250A%2520%2520%250A%2520%2520members%2520%253A%250A%2520%2520%257B%250A%2520%2520%2520%2520_getCellStyle%2520%253A%2520function%28cellInfo%29%250A%2520%2520%2520%2520%257B%250A%2520%2520%2520%2520%2520%2520var%2520color%2520%253D%2520%28cellInfo.row%2520%2525%25202%2520%253D%253D%25201%2520%253F%2520%2522cyan%2522%2520%253A%2520%2522white%2522%29%253B%250A%2520%2520%2520%2520%2520%2520return%2520this.base%28arguments%252C%2520cellInfo%29%2520%252B%2520%2522background-color%253A%2522%2520%252B%2520color%2520%252B%2520%2522%253B%2522%253B%250A%2520%2520%2520%2520%257D%250A%2520%2520%257D%250A%257D%29%253B%250A%250Afunction%2520createRandomRows%28rowCount%29%2520%257B%250A%2520%2520var%2520rowData%2520%253D%2520%255B%255D%253B%250A%2520%2520var%2520now%2520%253D%2520new%2520Date%28%29.getTime%28%29%253B%250A%2520%2520var%2520dateRange%2520%253D%2520400%2520*%252024%2520*%252060%2520*%252060%2520*%25201000%253B%2520%252F%252F%2520400%2520days%250A%2520%2520var%2520nextId%2520%253D%25200%253B%250A%2520%2520for%2520%28var%2520row%2520%253D%25200%253B%2520row%2520%253C%2520rowCount%253B%2520row%252B%252B%29%2520%257B%250A%2520%2520%2520%2520var%2520date%2520%253D%2520new%2520Date%28now%2520%252B%2520Math.random%28%29%2520*%2520dateRange%2520-%2520dateRange%2520%252F%25202%29%253B%250A%2520%2520%2520%2520rowData.push%28%255B%2520nextId%252B%252B%252C%2520Math.random%28%29%2520*%25201%252C%2520date%252C%2520%28Math.random%28%29%2520%253E%25200.5%29%2520%255D%29%253B%250A%2520%2520%257D%250A%2520%2520return%2520rowData%253B%250A%257D%250A%250A%250A%252F%252F%2520window%250Avar%2520win%2520%253D%2520new%2520qx.ui.window.Window%28%2522Table%2522%29.set%28%257B%250A%2520%2520layout%2520%253A%2520new%2520qx.ui.layout.Grow%28%29%252C%250A%2520%2520allowClose%253A%2520false%252C%250A%2520%2520allowMinimize%253A%2520false%252C%250A%2520%2520contentPadding%253A%25200%250A%257D%29%253B%250Athis.getRoot%28%29.add%28win%29%253B%250Awin.moveTo%2830%252C%252040%29%253B%250Awin.open%28%29%253B%250A%250A%252F%252F%2520table%2520model%250Avar%2520tableModel%2520%253D%2520new%2520qx.ui.table.model.Simple%28%29%253B%250AtableModel.setColumns%28%255B%2520%2522ID%2522%252C%2520%2522A%2520number%2522%252C%2520%2522A%2520date%2522%252C%2520%2522Boolean%2522%2520%255D%29%253B%250AtableModel.setData%28createRandomRows%281000%29%29%253B%250A%250A%252F%252F%2520make%2520second%2520column%2520editable%250AtableModel.setColumnEditable%281%252C%2520true%29%253B%250A%250A%252F%252F%2520table%250Avar%2520table%2520%253D%2520new%2520qx.ui.table.Table%28tableModel%29.set%28%257B%250A%2520%2520decorator%253A%2520null%250A%257D%29%250Awin.add%28table%29%253B%250A%250Avar%2520tcm%2520%253D%2520table.getTableColumnModel%28%29%253B%250A%250A%252F%252F%2520Display%2520a%2520checkbox%2520in%2520column%25203%250Atcm.setDataCellRenderer%283%252C%2520new%2520qx.ui.table.cellrenderer.Boolean%28%29%29%253B%250A%250A%252F%252F%2520Use%2520the%2520custom%2520cell%2520renderer%2520for%2520column%25201%250Atcm.setDataCellRenderer%281%252C%2520new%2520custom.MyCellRenderer%28%29%29%253B%250A%250A%252F%252F%2520use%2520a%2520different%2520header%2520renderer%250Atcm.setHeaderCellRenderer%282%252C%2520new%2520qx.ui.table.headerrenderer.Icon%28%2522icon%252F16%252Fapps%252Foffice-calendar.png%2522%252C%2520%2522A%2520date%2522%29%29%253B%250A%22%7D > > Cheers, > > Derrell > > -- > The Planet: dedicated and managed hosting, cloud storage, colocation > Stay online with enterprise data centers and the best network in the > business > Choose flexible plans and management services without long-term contracts > Personal 24x7 support from experience hosting pros just a phone call away. > http://p.sf.net/sfu/theplanet-com > ___
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
On Thu, 4 Feb 2010, Derrell Lipman wrote: > On Thu, Feb 4, 2010 at 10:22, Fritz Zaucker wrote: > >> As follow up question: my table uses a DynamicCellRenderer with a >> cellRendererFactory supplying the actual cellRenderer. So the column in >> question actually uses different cellRenderers in different rows. In this >> case I can/must implement custom cellRenderers for the various data types >> with the modification you suggested. Or is there a short cut I don't see? > > You could probably create a wrapper cell renderer to which you provide the > actual cell renderer. The wrapper would add its own styles to the styles > provided by the actual renderer, but otherwise be a "pass through". Yes, of course ... > Depending on how many cell renderer classes you're talking about, it's > likely easier to extend each of them as previously shown and use the > subclass everyplace. If there are a huge number of cell renderers, then > the wrapper may be easier. It's just three ... so I'll go with the first suggestion ... I guess by the time I'll get the full picture of qx.ui.table and friends all will be re-implemented as virtual ... hopefully that will be easier ... ;-) Cheers, Fritz -- Oetiker+Partner AG tel: +41 62 775 9903 (direct) Fritz Zaucker+41 62 775 9900 (switch board) Aarweg 15+41 79 675 0630 (mobile) CH-4600 Olten fax: +41 62 775 9905 Schweiz web: www.oetiker.ch -- The Planet: dedicated and managed hosting, cloud storage, colocation Stay online with enterprise data centers and the best network in the business Choose flexible plans and management services without long-term contracts Personal 24x7 support from experience hosting pros just a phone call away. http://p.sf.net/sfu/theplanet-com ___ qooxdoo-devel mailing list [email protected] https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
On Thu, Feb 4, 2010 at 10:22, Fritz Zaucker wrote: > As follow up question: my table uses a DynamicCellRenderer with a > cellRendererFactory supplying the actual cellRenderer. So the column in > question actually uses different cellRenderers in different rows. In this > case I can/must implement custom cellRenderers for the various data types > with the modification you suggested. Or is there a short cut I don't see? > You could probably create a wrapper cell renderer to which you provide the actual cell renderer. The wrapper would add its own styles to the styles provided by the actual renderer, but otherwise be a "pass through". Depending on how many cell renderer classes you're talking about, it's likely easier to extend each of them as previously shown and use the subclass everyplace. If there are a huge number of cell renderers, then the wrapper may be easier. Cheers, Derrell -- The Planet: dedicated and managed hosting, cloud storage, colocation Stay online with enterprise data centers and the best network in the business Choose flexible plans and management services without long-term contracts Personal 24x7 support from experience hosting pros just a phone call away. http://p.sf.net/sfu/theplanet-com___ qooxdoo-devel mailing list [email protected] https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
On Thu, 4 Feb 2010, Derrell Lipman wrote: > On Thu, Feb 4, 2010 at 09:41, Fritz Zaucker wrote: > >> >> The good news is that cellRenderer style seems to win over rowRenderer >> style (which makes sense, I think). > > > If you think about how it might be implemented (and it really is > implemented this way! :-) ), each row is a and each cell within that > row is its own within the row . Therefore row styles cascade > down to cells, but cells can easily override the row's styles. Of course ... It even makes sense without knowing the implementation details, as the row is in a sense the "generalization" of all the cells ... As follow up question: my table uses a DynamicCellRenderer with a cellRendererFactory supplying the actual cellRenderer. So the column in question actually uses different cellRenderers in different rows. In this case I can/must implement custom cellRenderers for the various data types with the modification you suggested. Or is there a short cut I don't see? Thanks again, Fritz -- Oetiker+Partner AG tel: +41 62 775 9903 (direct) Fritz Zaucker+41 62 775 9900 (switch board) Aarweg 15+41 79 675 0630 (mobile) CH-4600 Olten fax: +41 62 775 9905 Schweiz web: www.oetiker.ch -- The Planet: dedicated and managed hosting, cloud storage, colocation Stay online with enterprise data centers and the best network in the business Choose flexible plans and management services without long-term contracts Personal 24x7 support from experience hosting pros just a phone call away. http://p.sf.net/sfu/theplanet-com ___ qooxdoo-devel mailing list [email protected] https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
On Thu, Feb 4, 2010 at 09:41, Fritz Zaucker wrote: > > The good news is that cellRenderer style seems to win over rowRenderer > style > (which makes sense, I think). > If you think about how it might be implemented (and it really is implemented this way! :-) ), each row is a and each cell within that row is its own within the row . Therefore row styles cascade down to cells, but cells can easily override the row's styles. Cheers, Derrell -- The Planet: dedicated and managed hosting, cloud storage, colocation Stay online with enterprise data centers and the best network in the business Choose flexible plans and management services without long-term contracts Personal 24x7 support from experience hosting pros just a phone call away. http://p.sf.net/sfu/theplanet-com___ qooxdoo-devel mailing list [email protected] https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
Hi Stefan, thanks for your suggestion. Possibly Derrell's playground example might be useful for your use case as well. The good news is that cellRenderer style seems to win over rowRenderer style (which makes sense, I think). Cheers, Fritz On Thu, 4 Feb 2010, Stefan Volbers wrote: > Hi Fritz, > > I had the same case in the end of 2008 and solved it by writing my own > cellrenderer. > > I then copied several parts of cellrenderer.Conditional, because I had to > change the behaviour for my needs anyway , and set > > style["background-color"] = this.conditions[i][1]; > > on occasion. I haven't touched it since then as it works, but, looking at > Conditional's source right now, it might work out for you to extend > Conditional and just override __applyFormatting and _getCellStyle to support > "background-color" too. Well, I'd suggest you to head that way. > Certainly, developers like Derrell or others might come up with more adequate > solutions. > > HTH, else write if you need more info, > greetings, > Stefan > > > On 04.02.2010 09:58, Fritz Zaucker wrote: >> Hi, >> >> I have a table with say 5 columns. I'd like to have a different background >> color in one of these columns (e.g. column 3). >> >> As far as I could figure out the background color is set in the >> RowRenderer, >> but for the whole row. So the next obvious choice would be the >> CellRenderer. >> However, it is not clear to me how the two might interfere in this respect. >> >> And (similar) issue arises if I'd like to set a different background color >> for a specific cell, e.g. similar to the Conditional CellRenderer (which >> unfortunately only let's me specify styles for the cell content). >> >> I'd appreciate any hints on how to implement something like that. >> >> Thanks and best regards, >> Fritz >> > > -- Oetiker+Partner AG tel: +41 62 775 9903 (direct) Fritz Zaucker+41 62 775 9900 (switch board) Aarweg 15+41 79 675 0630 (mobile) CH-4600 Olten fax: +41 62 775 9905 Schweiz web: www.oetiker.ch -- The Planet: dedicated and managed hosting, cloud storage, colocation Stay online with enterprise data centers and the best network in the business Choose flexible plans and management services without long-term contracts Personal 24x7 support from experience hosting pros just a phone call away. http://p.sf.net/sfu/theplanet-com ___ qooxdoo-devel mailing list [email protected] https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
Hi Stefan,
I am interested to this post too, because I am playing arround with nearly
same condition.
I know, for me as a beginner this is not the correct way to learn Qooxdoo
:-)
If I read the Apiviewer :
addNumericCondition(String condition, Integer value1, String align, String
color, String style, String weight, String target)
..
style = The style to format the cell with if the condition matches.
But I never saw an example here where the "style" is used.
It was always NULL
newRenderer.addNumericCondition(">", 0, null, "#FF", null, null);
So my question is:
What string or syntax is allowed for using "style"?
I understand style as CSS syntax.
Can I fill in for "style" like "background-color = "#ff6655"" ?
And: why we have here 4 conditions (align, color, style, weight)
normally align, color, weight and other could be used in style?
In the Conditional.js I found this:
..
var style =
{
"text-align": this.__defaultTextAlign,
"color": this.__defaultColor,
"font-style": this.__defaultFontStyle,
"font-weight": this.__defaultFontWeight
};
Is it possible to add
"background-color": this.__defaultBackgroundColor ?
best regards
Hansjoerg
Stefan Volbers wrote:
>
> Hi Fritz,
>
> I had the same case in the end of 2008 and solved it by writing my own
> cellrenderer.
>
> I then copied several parts of cellrenderer.Conditional, because I had
> to change the behaviour for my needs anyway , and set
>
> style["background-color"] = this.conditions[i][1];
>
> on occasion. I haven't touched it since then as it works, but, looking
> at Conditional's source right now, it might work out for you to extend
> Conditional and just override __applyFormatting and _getCellStyle to
> support "background-color" too. Well, I'd suggest you to head that way.
> Certainly, developers like Derrell or others might come up with more
> adequate solutions.
>
> HTH, else write if you need more info,
> greetings,
> Stefan
>
>
> On 04.02.2010 09:58, Fritz Zaucker wrote:
>> Hi,
>>
>> I have a table with say 5 columns. I'd like to have a different
>> background
>> color in one of these columns (e.g. column 3).
>>
>> As far as I could figure out the background color is set in the
>> RowRenderer,
>> but for the whole row. So the next obvious choice would be the
>> CellRenderer.
>> However, it is not clear to me how the two might interfere in this
>> respect.
>>
>> And (similar) issue arises if I'd like to set a different background
>> color
>> for a specific cell, e.g. similar to the Conditional CellRenderer (which
>> unfortunately only let's me specify styles for the cell content).
>>
>> I'd appreciate any hints on how to implement something like that.
>>
>> Thanks and best regards,
>> Fritz
>>
>
> --
> The Planet: dedicated and managed hosting, cloud storage, colocation
> Stay online with enterprise data centers and the best network in the
> business
> Choose flexible plans and management services without long-term contracts
> Personal 24x7 support from experience hosting pros just a phone call away.
> http://p.sf.net/sfu/theplanet-com
> ___
> qooxdoo-devel mailing list
> [email protected]
> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>
>
--
View this message in context:
http://old.nabble.com/Different-background-color-in-column-cell-of-qx.ui.table.Table-tp27449521p27452206.html
Sent from the qooxdoo-devel mailing list archive at Nabble.com.
--
The Planet: dedicated and managed hosting, cloud storage, colocation
Stay online with enterprise data centers and the best network in the business
Choose flexible plans and management services without long-term contracts
Personal 24x7 support from experience hosting pros just a phone call away.
http://p.sf.net/sfu/theplanet-com
___
qooxdoo-devel mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
On Thu, 4 Feb 2010, Derrell Lipman wrote: > On Thu, Feb 4, 2010 at 03:58, Fritz Zaucker wrote: > >> Hi, >> >> I have a table with say 5 columns. I'd like to have a different background >> color in one of these columns (e.g. column 3). >> >> As far as I could figure out the background color is set in the >> RowRenderer, >> but for the whole row. So the next obvious choice would be the >> CellRenderer. >> However, it is not clear to me how the two might interfere in this respect. >> >> And (similar) issue arises if I'd like to set a different background color >> for a specific cell, e.g. similar to the Conditional CellRenderer (which >> unfortunately only let's me specify styles for the cell content). >> >> I'd appreciate any hints on how to implement something like that. >> > > Here's an example of doing what you ask: Cool! It's so simple if you know how to do it ... Thanks and cheers, Fritz -- Oetiker+Partner AG tel: +41 62 775 9903 (direct) Fritz Zaucker+41 62 775 9900 (switch board) Aarweg 15+41 79 675 0630 (mobile) CH-4600 Olten fax: +41 62 775 9905 Schweiz web: www.oetiker.ch -- The Planet: dedicated and managed hosting, cloud storage, colocation Stay online with enterprise data centers and the best network in the business Choose flexible plans and management services without long-term contracts Personal 24x7 support from experience hosting pros just a phone call away. http://p.sf.net/sfu/theplanet-com ___ qooxdoo-devel mailing list [email protected] https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
On Thu, Feb 4, 2010 at 03:58, Fritz Zaucker wrote: > Hi, > > I have a table with say 5 columns. I'd like to have a different background > color in one of these columns (e.g. column 3). > > As far as I could figure out the background color is set in the > RowRenderer, > but for the whole row. So the next obvious choice would be the > CellRenderer. > However, it is not clear to me how the two might interfere in this respect. > > And (similar) issue arises if I'd like to set a different background color > for a specific cell, e.g. similar to the Conditional CellRenderer (which > unfortunately only let's me specify styles for the cell content). > > I'd appreciate any hints on how to implement something like that. > Here's an example of doing what you ask: http://demo.qooxdoo.org/devel/playground/#%7B%22code%22%3A%20%22qx.Class.define%28%2522custom.MyCellRenderer%2522%252C%250A%257B%250A%2520%2520extend%2520%253A%2520qx.ui.table.cellrenderer.Default%252C%250A%2520%2520%250A%2520%2520members%2520%253A%250A%2520%2520%257B%250A%2520%2520%2520%2520_getCellStyle%2520%253A%2520function%28cellInfo%29%250A%2520%2520%2520%2520%257B%250A%2520%2520%2520%2520%2520%2520var%2520color%2520%253D%2520%28cellInfo.row%2520%2525%25202%2520%253D%253D%25201%2520%253F%2520%2522cyan%2522%2520%253A%2520%2522white%2522%29%253B%250A%2520%2520%2520%2520%2520%2520return%2520this.base%28arguments%252C%2520cellInfo%29%2520%252B%2520%2522background-color%253A%2522%2520%252B%2520color%2520%252B%2520%2522%253B%2522%253B%250A%2520%2520%2520%2520%257D%250A%2520%2520%257D%250A%257D%29%253B%250A%250Afunction%2520createRandomRows%28rowCount%29%2520%257B%250A%2520%2520var%2520rowData%2520%253D%2520%255B%255D%253B%250A%2520%2520var%2520now%2520%253D%2520new%2520Date%28%29.getTime%28%29%253B%250A%2520%2520var%2520dateRange%2520%253D%2520400%2520*%252024%2520*%252060%2520*%252060%2520*%25201000%253B%2520%252F%252F%2520400%2520days%250A%2520%2520var%2520nextId%2520%253D%25200%253B%250A%2520%2520for%2520%28var%2520row%2520%253D%25200%253B%2520row%2520%253C%2520rowCount%253B%2520row%252B%252B%29%2520%257B%250A%2520%2520%2520%2520var%2520date%2520%253D%2520new%2520Date%28now%2520%252B%2520Math.random%28%29%2520*%2520dateRange%2520-%2520dateRange%2520%252F%25202%29%253B%250A%2520%2520%2520%2520rowData.push%28%255B%2520nextId%252B%252B%252C%2520Math.random%28%29%2520*%25201%252C%2520date%252C%2520%28Math.random%28%29%2520%253E%25200.5%29%2520%255D%29%253B%250A%2520%2520%257D%250A%2520%2520return%2520rowData%253B%250A%257D%250A%250A%250A%252F%252F%2520window%250Avar%2520win%2520%253D%2520new%2520qx.ui.window.Window%28%2522Table%2522%29.set%28%257B%250A%2520%2520layout%2520%253A%2520new%2520qx.ui.layout.Grow%28%29%252C%250A%2520%2520allowClose%253A%2520false%252C%250A%2520%2520allowMinimize%253A%2520false%252C%250A%2520%2520contentPadding%253A%25200%250A%257D%29%253B%250Athis.getRoot%28%29.add%28win%29%253B%250Awin.moveTo%2830%252C%252040%29%253B%250Awin.open%28%29%253B%250A%250A%252F%252F%2520table%2520model%250Avar%2520tableModel%2520%253D%2520new%2520qx.ui.table.model.Simple%28%29%253B%250AtableModel.setColumns%28%255B%2520%2522ID%2522%252C%2520%2522A%2520number%2522%252C%2520%2522A%2520date%2522%252C%2520%2522Boolean%2522%2520%255D%29%253B%250AtableModel.setData%28createRandomRows%281000%29%29%253B%250A%250A%252F%252F%2520make%2520second%2520column%2520editable%250AtableModel.setColumnEditable%281%252C%2520true%29%253B%250A%250A%252F%252F%2520table%250Avar%2520table%2520%253D%2520new%2520qx.ui.table.Table%28tableModel%29.set%28%257B%250A%2520%2520decorator%253A%2520null%250A%257D%29%250Awin.add%28table%29%253B%250A%250Avar%2520tcm%2520%253D%2520table.getTableColumnModel%28%29%253B%250A%250A%252F%252F%2520Display%2520a%2520checkbox%2520in%2520column%25203%250Atcm.setDataCellRenderer%283%252C%2520new%2520qx.ui.table.cellrenderer.Boolean%28%29%29%253B%250A%250A%252F%252F%2520Use%2520the%2520custom%2520cell%2520renderer%2520for%2520column%25201%250Atcm.setDataCellRenderer%281%252C%2520new%2520custom.MyCellRenderer%28%29%29%253B%250A%250A%252F%252F%2520use%2520a%2520different%2520header%2520renderer%250Atcm.setHeaderCellRenderer%282%252C%2520new%2520qx.ui.table.headerrenderer.Icon%28%2522icon%252F16%252Fapps%252Foffice-calendar.png%2522%252C%2520%2522A%2520date%2522%29%29%253B%250A%22%7D Cheers, Derrell -- The Planet: dedicated and managed hosting, cloud storage, colocation Stay online with enterprise data centers and the best network in the business Choose flexible plans and management services without long-term contracts Personal 24x7 support from experience hosting pros just a phone call away. http://p.sf.net/sfu/theplanet-com___ qooxdoo-devel mailing list [email protected] https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
Re: [qooxdoo-devel] Different background color in column/cell of qx.ui.table.Table
Hi Fritz, I had the same case in the end of 2008 and solved it by writing my own cellrenderer. I then copied several parts of cellrenderer.Conditional, because I had to change the behaviour for my needs anyway , and set style["background-color"] = this.conditions[i][1]; on occasion. I haven't touched it since then as it works, but, looking at Conditional's source right now, it might work out for you to extend Conditional and just override __applyFormatting and _getCellStyle to support "background-color" too. Well, I'd suggest you to head that way. Certainly, developers like Derrell or others might come up with more adequate solutions. HTH, else write if you need more info, greetings, Stefan On 04.02.2010 09:58, Fritz Zaucker wrote: > Hi, > > I have a table with say 5 columns. I'd like to have a different background > color in one of these columns (e.g. column 3). > > As far as I could figure out the background color is set in the RowRenderer, > but for the whole row. So the next obvious choice would be the CellRenderer. > However, it is not clear to me how the two might interfere in this respect. > > And (similar) issue arises if I'd like to set a different background color > for a specific cell, e.g. similar to the Conditional CellRenderer (which > unfortunately only let's me specify styles for the cell content). > > I'd appreciate any hints on how to implement something like that. > > Thanks and best regards, > Fritz > -- The Planet: dedicated and managed hosting, cloud storage, colocation Stay online with enterprise data centers and the best network in the business Choose flexible plans and management services without long-term contracts Personal 24x7 support from experience hosting pros just a phone call away. http://p.sf.net/sfu/theplanet-com ___ qooxdoo-devel mailing list [email protected] https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
