Update and reorder application columns

CPB/uData.dfm

@@ -174,12 +174,6 @@ object DataModule1: TDataModule1
       end
     end
   end
-  object dxSkinController1: TdxSkinController
-    NativeStyle = False
-    SkinName = 'WXI'
-    Left = 288
-    Top = 84
-  end
   object mdRevenueByIndustry: TdxMemData
     Active = True
     Indexes = <>

CPB/uData.h

@@ -26,7 +26,6 @@ class TDataModule1 : public TDataModule
 	TdxBackendDataConnectionManager *dxBackendDataConnectionManager1;
 	TdxBackendDataSetJSONConnection *RevenueByIndustryConnection;
 	TdxBackendDataSetCollectionItem *RevenueByIndustryConnectionItem1;
-	TdxSkinController *dxSkinController1;
 	TdxMemData *mdRevenueByIndustry;
 	TStringField *mdRevenueByIndustryCity;
 	TStringField *mdRevenueByIndustryIndustry;

CPB/uMainForm.cpp

@@ -40,6 +40,12 @@
 #pragma link "dxAI"
 #pragma link "dxAI.Commands.SmartPaste"
 #pragma link "cxTextEdit"
+#pragma link "cxColorComboBox"
+#pragma link "cxContainer"
+#pragma link "cxDBColorComboBox"
+#pragma link "cxDropDownEdit"
+#pragma link "cxMaskEdit"
+#pragma link "dxLayoutcxEditAdapters"
 #pragma resource "*.dfm"
 TMainForm *MainForm;
 //---------------------------------------------------------------------------

CPB/uMainForm.dfm

@@ -65,16 +65,23 @@ object MainForm: TMainForm
           DataBinding.FieldName = 'RecId'
           Visible = False
         end
-        object gvLayoutsLayout: TcxGridDBColumn
-          Caption = 'Report Layout'
-          DataBinding.FieldName = 'Layout'
-          Options.Editing = False
-        end
         object gvLayoutsName: TcxGridDBColumn
-          Caption = 'Report Name'
+          Caption = 'Dashboard Name'
           DataBinding.FieldName = 'Name'
           PropertiesClassName = 'TcxTextEditProperties'
           Properties.OnValidate = gvLayoutsNamePropertiesValidate
+          Width = 246
+        end
+        object gvLayoutsLayout: TcxGridDBColumn
+          Caption = 'Dashboard Layout'
+          DataBinding.FieldName = 'Layout'
+          Options.Editing = False
+          Width = 275
+        end
+        object gvLayoutsColumn1: TcxGridDBColumn
+          Caption = 'Dashboard State'
+          DataBinding.FieldName = 'State'
+          Width = 269
         end
       end
       object cxGrid2Level1: TcxGridLevel
@@ -178,8 +185,4 @@ object MainForm: TMainForm
       Index = 2
     end
   end
-  object dxReport1: TdxReport
-    Left = 48
-    Top = 88
-  end
 end

CPB/uMainForm.h

@@ -45,6 +45,12 @@
 #include "dxAI.Commands.SmartPaste.hpp"
 #include "dxAI.hpp"
 #include "cxTextEdit.hpp"
+#include "cxColorComboBox.hpp"
+#include "cxContainer.hpp"
+#include "cxDBColorComboBox.hpp"
+#include "cxDropDownEdit.hpp"
+#include "cxMaskEdit.hpp"
+#include "dxLayoutcxEditAdapters.hpp"
 //---------------------------------------------------------------------------
 class TMainForm : public TForm
 {
@@ -67,7 +73,7 @@ class TMainForm : public TForm
 	TdxLayoutItem *liBtnNew;
 	TdxLayoutGroup *lgButtons;
 	TdxLayoutItem *liBtnDelete;
-	TdxReport *dxReport1;
+	TcxGridDBColumn *gvLayoutsState;
 	void __fastcall btnNewDashboardClick(TObject *Sender);
 	void __fastcall btnDeleteClick(TObject *Sender);
 	void __fastcall btnDesignClick(TObject *Sender);

Delphi/uData.dfm

@@ -174,12 +174,6 @@ object DataModule1: TDataModule1
       end
     end
   end
-  object dxSkinController1: TdxSkinController
-    NativeStyle = False
-    SkinName = 'WXI'
-    Left = 288
-    Top = 84
-  end
   object mdRevenueByIndustry: TdxMemData
     Active = True
     Indexes = <>

Delphi/uData.pas

@@ -15,7 +15,6 @@   TDataModule1 = class(TDataModule)
     mdLayoutsLayout: TBlobField;
     mdLayoutsName: TWideStringField;
     dxBackendDataConnectionManager1: TdxBackendDataConnectionManager;
-    dxSkinController1: TdxSkinController;
     mdRevenueByIndustry: TdxMemData;
     mdRevenueByIndustryCity: TStringField;
     mdRevenueByIndustryIndustry: TStringField;

Delphi/uMainForm.dfm

@@ -20,6 +20,8 @@ object MainForm: TMainForm
     Align = alClient
     TabOrder = 0
     AutoSize = True
+    ExplicitWidth = 837
+    ExplicitHeight = 519
     object btnDesign: TcxButton
       Left = 287
       Top = 12
@@ -63,16 +65,23 @@ object MainForm: TMainForm
           DataBinding.FieldName = 'RecId'
           Visible = False
         end
-        object gvLayoutsLayout: TcxGridDBColumn
-          Caption = 'Report Layout'
-          DataBinding.FieldName = 'Layout'
-          Options.Editing = False
-        end
         object gvLayoutsName: TcxGridDBColumn
-          Caption = 'Report Name'
+          Caption = 'Dashboard Name'
           DataBinding.FieldName = 'Name'
           PropertiesClassName = 'TcxTextEditProperties'
           Properties.OnValidate = gvLayoutsNamePropertiesValidate
+          Width = 246
+        end
+        object gvLayoutsLayout: TcxGridDBColumn
+          Caption = 'Dashboard Layout'
+          DataBinding.FieldName = 'Layout'
+          Options.Editing = False
+          Width = 275
+        end
+        object gvLayoutsColumn1: TcxGridDBColumn
+          Caption = 'Dashboard State'
+          DataBinding.FieldName = 'State'
+          Width = 269
         end
       end
       object cxGrid2Level1: TcxGridLevel
@@ -84,7 +93,6 @@ object MainForm: TMainForm
       Top = 184
       Width = 819
       Height = 340
-      Parameters = <>
       TabOrder = 4
       OnLayoutChanged = dxDashboardControl1LayoutChanged
       OnStateChanged = dxDashboardControl1StateChanged
@@ -177,9 +185,4 @@ object MainForm: TMainForm
       Index = 2
     end
   end
-  object dxReport1: TdxReport
-    Parameters = <>
-    Left = 48
-    Top = 88
-  end
 end

Delphi/uMainForm.pas

@@ -16,7 +16,6 @@ interface
 
 type
   TMainForm = class(TForm)
-    dxReport1: TdxReport;
     btnNewDashboard: TcxButton;
     btnDesign: TcxButton;
     btnDelete: TcxButton;
@@ -35,6 +34,7 @@   TMainForm = class(TForm)
     liBtnDelete: TdxLayoutItem;
     liGrid: TdxLayoutItem;
     liDashboardControl: TdxLayoutItem;
+    gvLayoutsColumn1: TcxGridDBColumn;
     procedure btnNewDashboardClick(Sender: TObject);
     procedure btnDesignClick(Sender: TObject);
     procedure btnDeleteClick(Sender: TObject);

README.md

@@ -30,7 +30,7 @@
 1.  Create additional layouts if necessary. 
 1.  Close and restart the app.
     Click on grid records to switch between dashboard layouts you set up previously.
-    Press **Design Dashboard** or **Delete Dashboard** to modify or delete entries. 
+    Click **Design Dashboard** or **Delete Dashboard** to modify or delete entries. 
 
 ![DevExpress Dashboards for Delphi/C++Builder — Store Dashboard Layout Definitions in a Database](./images/vcl-dashboards-store-layout-template-database.gif)
 
@@ -39,7 +39,7 @@
 
 The example stores dashboard layouts using a DevExpress memory-based dataset ([TdxMemData]).
 You can modify the application to use any other [TDataSet] descendant instead.
 To review our data module implementation, see the following file: [uData.pas]/[uData.cpp].
 
 The instructions assume that you start with a Delphi or C++Builder project that already includes
 a configured data source for DevExpress Dashboards.
@@ -118,7 +118,7 @@
 <!-- end-code-block -->
 
 To load a different dashboard in the Dashboard Control, assign a new dashboard name and layout.
-The assigned dashboard replaces the current layout definition and resets the dashboard state.
+The assigned layout definition replaces the current definition and resets the dashboard state.
 
 You can also clear the Dashboard Control using [TdxCustomDashboardControl.Clear].
 
@@ -238,7 +238,7 @@
 
 -   [Introduction to DevExpress Dashboards for Delphi/C++Builder][dashboards-intro]
 -   [Tutorial: Create a dashboard using the Designer Dialog][designer]
--   [Use JSON as a data source for dashboards (as demonstrated in the current example)][json-data-source]
+-   [Reports/Dashboards for Delphi/C++Builder: Supported Database Systems][supported-dbms]
 -   [Save the dashboard layout to file on every change (code example)][save-to-file]
 -   API reference:
     -   [TdxCustomDashboardControl] (used to display a dashboard on an application form)
@@ -256,7 +256,7 @@
 
 [dashboards-intro]: https://docs.devexpress.com/VCL/405642/ExpressDashboards/vcl-dashboards
 [designer]: https://docs.devexpress.com/VCL/405774/ExpressDashboards/getting-started/create-dashboard-using-designer-dialog
-[json-data-source]: https://docs.devexpress.com/VCL/405747/ExpressCrossPlatformLibrary/vcl-backend/database-engines/vcl-backend-memory-based-data-storage
+[supported-dbms]: https://docs.devexpress.com/VCL/405703/ExpressCrossPlatformLibrary/vcl-backend/vcl-backend-supported-database-systems
 [save-to-file]: https://docs.devexpress.com/VCL/dxDashboard.Control.TdxCustomDashboardControl.Layout#save-dashboard-layout-to-file-on-every-change
 [supported-dbms]: https://docs.devexpress.com/VCL/405703/ExpressCrossPlatformLibrary/vcl-backend/vcl-backend-supported-database-systems