Codejock Grid with ProgressBar
From DataFlex Wiki
Jump to navigationJump to search
Author and origin
This example code was written by Peter Bragg and comes from the following post at the forum:
https://support.dataaccess.com/Forums/showthread.php?62699-cDBCJGrid-with-ProgressBar
cDBCJGrid with ProgressBar
Here's how to do this.
First, we have the following mixin class (with included use statements and defines etc):
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 | Define clHexOffice_Turquoise for '#1abc9c' //TurquoiseDefine clHexOffice_DrkTurquoise for '#16a085' //GreenSeaDefine clHexOffice_Green for '#2ecc71' //Emerald Define clHexOffice_LightGreen for '#7ee2a8'Define clHexOffice_DrkGreen for '#27ae60' //NephritisDefine clHexOffice_BrightBlue for '#3498db' //PeterRiverDefine clHexOffice_Blue for '#2980b9' //BelizeHoleDefine clHexOffice_Purple for '#9b59b6' //AmethystDefine clHexOffice_DrkPurple for '#8e44ad' //WisteriaDefine clHexOffice_DrkBlue for '#34495e' //WetAsphaltDefine clHexOffice_MidnightBlue for '#2c3e50' //MidnightBlueDefine clHexOffice_BrightYellow for '#f1c40f' //SunflowerDefine clHexOffice_Yellow for '#f39c12' //OrangeDefine clHexOffice_Orange for '#e67e22' //Carrot Define clHexOffice_DrkOrange for '#d35400' //PumpkinDefine clHexOffice_Red for '#e74c3c' //AlizarinDefine clHexOffice_DrkRed for '#c0392b' //Pomegranate Define clHexOffice_White for '#ecf0f1' //Clouds Define clHexOffice_Silver for '#bdc3c7' //SilverDefine clHexOffice_Grey for '#95a5a6' //ConcreteDefine clHexOffice_DrkGrey for '#7f8c8d' //AsbestosEnum_List Define eProgressStyle_Normal Define eProgressStyle_TrafficLightEnd_Enum_ListClass mixin_cCJGridProgressBar is a Mixin Procedure Define_cCJGridProgressBar_Properties {Category="Appearance" InitialValue=False} Property Boolean pbProgress False {Category="Appearance" InitialValue=True} Property Boolean pbProgressLabel True {Category="Appearance" EnumList="eProgressStyle_Normal,eProgressStyle_TrafficLight" InitialValue=eProgressStyle_Normal} Property Integer peProgressStyle eProgressStyle_Normal End_Procedure {MethodType=Event} Procedure OnSetProgressBarValue Boolean ByRef bVisible String ByRef sLabel Number ByRef nPercentage Integer iRow End_Procedure {Visibility=Private} Function DisplayProgress Number nPercentageValue Returns String Number nPercentage nWidth nProgress Integer iPercentage eStyle iRow String sProgress sXAML sColor sColorBorder sLightColor sLabel sGBPSymbol Boolean bProgress bVisible If (num_arguments>0) Begin Move nPercentageValue to nPercentage End Get pbProgress to bProgress If (bProgress) Begin Send OnSetProgressBarValue (&bVisible) (&sLabel) (&nPercentage) If (bVisible) Begin Get peProgressStyle to eStyle // Compose XAML string // We need to know the width of the cell Get ComWidth to nWidth Subtract 6 from nWidth // Margin // Calculate length of progressbar: Move (nWidth * (nPercentage / 100)) to nProgress // If you want to use colors, you'll need to use Hexadecimal colors. Move clHexOffice_Grey to sColorBorder Case Begin Case ((nProgress<33.3) and (eStyle=eProgressStyle_TrafficLight)) Move clHexOffice_Red to sColor Move clHexOffice_Red to sLightColor Case Break Case ((nProgress<66.6) and (eStyle=eProgressStyle_TrafficLight)) Move clHexOffice_Orange to sColor Move clHexOffice_Red to sLightColor Case Break Case (nProgress<100) Move clHexOffice_Green to sColor Move clHexOffice_LightGreen to sLightColor Case Break Case Else Move clHexOffice_DrkGreen to sColor Move clHexOffice_Green to sLightColor Case End Move (Integer(nPercentage)) to iPercentage // Compose XAML string Move "<Grid><Border BorderBrush='%2' BorderThickness='1' CornerRadius='5' Height='13' Width='%4'> " to sXAML Add " <Border.Background><LinearGradientBrush StartPoint='0, 0' EndPoint='1,0'> <GradientStop Color='#C0CBDF' />" to sXAML Add " <GradientStop Color='#DCE9FA' Offset='1'/></LinearGradientBrush></Border.Background>" to sXAML Add " <Border HorizontalAlignment='Left' CornerRadius='5,0,0,5' Background='%3'" to sXAML Add " Width='%5'><Border.Background><LinearGradientBrush StartPoint='0, 0' EndPoint='1,0'>" to sXAML Add " <GradientStop Color='#658C4B' Offset='1'/><GradientStop Color='#A4DB64'/></LinearGradientBrush>" to sXAML Add " </Border.Background></Border></Border><TextBlock VerticalAlignment='Center'" to sXAML Add " HorizontalAlignment='Center' Text='%1'></TextBlock></Grid>" to sXAML If (pbProgressLabel(Self) and Trim(sLabel)='') Begin Move (String(iPercentage)-'%') to sLabel End Move (SFormat(sXAML,sLabel,sColorBorder,sColor,String(nWidth),String(nProgress),sLightColor)) to sXAML Move sXAML to sProgress End End Function_Return sProgress End_Function End_Class |
We then incorporate that into a subclass of the cDbCJGridColumn class as follows:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | Class cDemoDbCJGridColumn is a cDbCJGridColumn Import_Class_Protocol mixin_cCJGridProgressBar Procedure Construct_Object Forward Send Construct_Object Send Define_cCJGridProgressBar_Properties End_Procedure Procedure OnCreateColumn Boolean bProgress Forward Send OnCreateColumn Get pbProgress to bProgress If bProgress Begin Delegate Set ComEnableMarkup to True End End_Procedure Procedure OnSetCalculatedValue String ByRef sValue Boolean bProgress Get pbProgress to bProgress If (bProgress) Begin Get DisplayProgress to sValue End Forward Send OnSetCalculatedValue (&sValue) End_Procedure End_Class |
And then you can use this, just as in the Order Entry view, as follows:
Inside the oOrderDtl_Grid object, replace the oInvt_Description column with...
1 2 3 4 5 6 7 8 9 10 11 12 13 | Object oProgressBar is a cDemoDbCJGridColumn Set piWidth to 213 Set psCaption to "Progress" Set pbProgress to True Procedure OnSetProgressBarValue Boolean ByRef bVisible String ByRef sLabel Number ByRef nPercentage Move (OrderHea.Order_Total>0) to bVisible If bVisible Begin Move (((OrderDtl.Price*OrderDtl.Qty_Ordered)/OrderHea.Order_Total)*100) to nPercentage Move (String(nPercentage)+"%") to sLabel End End_Procedure End_Object |
You can set the label to anything you want - here (above) I've simply set it to show the percentage value, so that you can see it is dynamic. You just have to make sure that it is encoded correctly.
cCJGrid and progressbar
Ok, so same mixin class as before, but this time we use it in a cCjGridColumn (not a cDbCjGridColumn)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | Class cDemoCJGridColumn is a cCJGridColumn Import_Class_Protocol mixin_cCJGridProgressBar Procedure Construct_Object Forward Send Construct_Object Send Define_cCJGridProgressBar_Properties End_Procedure Procedure OnCreateColumn Boolean bProgress Forward Send OnCreateColumn Get pbProgress to bProgress If bProgress Begin Delegate Set ComEnableMarkup to True End End_ProcedureEnd_Class |
And then we can use this inside an example view. Here I've taken the example for a cCjGrid (from the help) but I've added an additional column to show a progress bar
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 | Object oCustomerGrid is a cCJGrid Set Size to 200 300 Set peAnchors to anAll Set pbReadOnly to True Set pbSelectionEnable to True Object oCustomer_Customer_Number is a cCJGridColumn Set piWidth to 71 Set psCaption to "Number" Set peDataType to Mask_Numeric_Window Set psMask to "######" End_Object Object oCustomer_Name is a cCJGridColumn Set piWidth to 257 Set psCaption to "Customer Name" End_Object Object oCustomer_Status is a cCJGridColumn Set piWidth to 66 Set psCaption to "Status" Set pbCheckbox to True Set psCheckboxTrue to "Y" Set psCheckboxFalse to "N" End_Object Object oProgressBar_Column is a cDemoCJGridColumn Set piWidth to 206 Set psCaption to "Progress" Set pbProgress to True // Here you will need to determine what values to use. Typically this might be a global buffer value Procedure OnSetProgressBarValue Boolean ByRef bVisible String ByRef sLabel Number ByRef nPercentage Integer iRecs Move True to bVisible Move "Example" to sLabel Get_Attribute DF_FILE_RECORDS_USED of (RefTable(Customer)) to iRecs Move ((Customer.Customer_Number/iRecs)*100) to nPercentage End_Procedure End_Object Procedure LoadData Handle hoDataSource tDataSourceRow[] TheData Boolean bFound Integer iRows iNum iName iStatus iProgress Get phoDataSource to hoDataSource // Get the datasource indexes of the various columns Get piColumnId of oCustomer_Customer_Number to iNum Get piColumnId of oCustomer_Name to iName Get piColumnId of oCustomer_Status to iStatus Get piColumnId of oProgressBar_Column to iProgress // Load all data into the datasource array Clear Customer Find ge Customer by 1 Move (Found) to bFound While (bFound) Move Customer.Customer_Number to TheData[iRows].sValue[iNum] Move Customer.Name to TheData[iRows].sValue[iName] Move Customer.Status to TheData[iRows].sValue[iStatus] Get DisplayProgress of oProgressBar_Column to TheData[iRows].sValue[iProgress] Find gt Customer by 1 Move (Found) to bFound Increment iRows Loop // Initialize Grid with new data Send InitializeData TheData Send MovetoFirstRow End_Procedure |
Obviously this is just a silly example in which I'm calculating a progress value based on the customer number and total number of customer records, but you get the point.
