55143681 Posted June 4, 2020 Share Posted June 4, 2020 I have a UniDBGrid ,I want to choose a column to add UniProgressBar to display the progress, or draw a Rectangle in the cell with progress position and color to display the progress, How to do that? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 4, 2020 Share Posted June 4, 2020 1 hour ago, 55143681 said: I have a UniDBGrid ,I want to choose a column to add UniProgressBar to display the progress, or draw a Rectangle in the cell with progress position and color to display the progress, How to do that? Hello, Please see this demo: \FMSoft\Framework\uniGUI\Demos\Desktop\Grid - WidgetColumn2 UniDBGrid1.Columns[4].WidgetColumn.Widget = UniProgressbarWidget1 Quote Link to comment Share on other sites More sharing options...
55143681 Posted June 4, 2020 Author Share Posted June 4, 2020 4 hours ago, Sherzod said: Hello, Please see this demo: \FMSoft\Framework\uniGUI\Demos\Desktop\Grid - WidgetColumn2 UniDBGrid1.Columns[4].WidgetColumn.Widget = UniProgressbarWidget1 Good job. Can you tell me how to setup UniProgressbarWidget1 and UniButtonWidget1 's color? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 4, 2020 Share Posted June 4, 2020 9 minutes ago, 55143681 said: Can you tell me how to setup UniProgressbarWidget1 and UniButtonWidget1 's color? Try this: Quote Link to comment Share on other sites More sharing options...
55143681 Posted June 4, 2020 Author Share Posted June 4, 2020 Quote Link to comment Share on other sites More sharing options...
55143681 Posted June 4, 2020 Author Share Posted June 4, 2020 but where to add the code? function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts) { var widgetColIndx = 1; columns[widgetColIndx].onWidgetAttach = function(column, widget, record) { widget.setStyle('border-color', 'green'); widget.setStyle('background-image', 'linear-gradient(lime, green)'); }; } Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 4, 2020 Share Posted June 4, 2020 Well, this is a demo example. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 4, 2020 Share Posted June 4, 2020 1 minute ago, 55143681 said: but where to add the code? function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts) { var widgetColIndx = 1; columns[widgetColIndx].onWidgetAttach = function(column, widget, record) { widget.setStyle('border-color', 'green'); widget.setStyle('background-image', 'linear-gradient(lime, green)'); }; } UniDBGrid.ClientEvents.ExtEvents... Quote Link to comment Share on other sites More sharing options...
55143681 Posted June 4, 2020 Author Share Posted June 4, 2020 1 minute ago, Sherzod said: Well, this is a demo example. Thanks , But where to add the follow code? function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts) { var widgetColIndx = 1; columns[widgetColIndx].onWidgetAttach = function(column, widget, record) { widget.setStyle('border-color', 'green'); widget.setStyle('background-image', 'linear-gradient(lime, green)'); }; } Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 4, 2020 Share Posted June 4, 2020 1 minute ago, 55143681 said: But where to add the follow code? 1 minute ago, Sherzod said: UniDBGrid.ClientEvents.ExtEvents... Quote Link to comment Share on other sites More sharing options...
55143681 Posted June 4, 2020 Author Share Posted June 4, 2020 11 minutes ago, Sherzod said: Thanks,but how to change this UniProgressbarWidget1's color? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 4, 2020 Share Posted June 4, 2020 6 minutes ago, 55143681 said: but how to change this UniProgressbarWidget1's color? I will try to analyze. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted June 4, 2020 Share Posted June 4, 2020 15 minutes ago, 55143681 said: Thanks,but how to change this UniProgressbarWidget1's color? Something like this: function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts) { var widgetColIndx = 4; columns[widgetColIndx].onWidgetAttach = function(column, widget, record) { var me = widget; me.barEl.setStyle( 'background-image', 'linear-gradient(to right, green, lime)' ); me.setStyle( 'border-color', 'green' ); var pText = me.el.select('.x-progress-text.x-progress-text-back').elements[0]; if (pText) { Ext.get(pText).setStyle( 'color', 'green' ) } }; } Quote Link to comment Share on other sites More sharing options...
55143681 Posted June 4, 2020 Author Share Posted June 4, 2020 13 hours ago, Sherzod said: Something like this: function reconfigure(sender, store, columns, oldStore, oldColumns, eOpts) { var widgetColIndx = 4; columns[widgetColIndx].onWidgetAttach = function(column, widget, record) { var me = widget; me.barEl.setStyle( 'background-image', 'linear-gradient(to right, green, lime)' ); me.setStyle( 'border-color', 'green' ); var pText = me.el.select('.x-progress-text.x-progress-text-back').elements[0]; if (pText) { Ext.get(pText).setStyle( 'color', 'green' ) } }; } Ha ha,very good.,works well. I am so sorry that UniDBTreeGrid do not have RowWidget function, How to get it? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.