<p> WinForms Grid - Save and Restore Grid Customizations</p><p>The XtraGrid supports saving and restoring custom views and grid layouts created during runtime. In this video, I’ll demonstrate how to customize a grid’s view by applying user-filters, and then we’ll go over the steps on how to save and reload the customizations.</p><p>1. I’ll start off with a new WinForms project.</p><p>2. I drop a button and dock it to the top of the form.</p><p>3. I’ll set its caption to “Save Layout”.</p><p>4. I’ll add a second button and dock it to the bottom.</p><p>5. This one, let it be called “Restore Layout”.</p><p>6. Finally, I’ll add an XtraGrid control and make it fill the available client area.</p><p>7. I’ll bind the grid to a data source by invoking its smart tag and clicking the “Add Project Data </p><p>Source” link.</p><p>8. I’ll use an existing Connection String for the CarsDB database.</p><p>9. I click “Next” and select the “Cars” Table that will supply data to the grid. 10. Click finish to complete the wizard.</p><p>11. Now, I’ll run the Grid’s Designer.</p><p>12. I switch to the Columns page, highlight the extra fields… and remove them.</p><p>13. I’m now done with column customization so I close the designer.</p><p>14. Next, I’m going to enable the Filter Editor button in the footer of the grid.</p><p>15. To do this, I select the GridView, expand its “OptionsView” property and set the </p><p>“ShowFilterPanelMode” property to “ShowAlways”. 16. Now I need to add some code to enable saving and restoring the grid layout.</p><p>17. Double-click on the “Save Layout” button to create an event handler for its Click Event.</p><p>18. I will add the following code to save the grid’s layout.</p><p>19. Note that I am creating a new XML file in the application directory, called “layout.xml”.</p><p>20. Then I write the current layout to the stream by using the SaveLayoutToStream method of the </p><p>GridView.</p><p>21. Finally, when the view settings have been written to the XML file, I close the stream.</p><p>22. Switch back to Design view.</p><p>23. I am now going to add a line of code to the “Restore Layout” button’s Click Event.</p><p>24. Double-click the button and add the following code to its event handler.</p><p>25. I will use the “RestoreLayoutFromXml” method to load the view settings from the XML file.</p><p>26. And I’m done!</p><p>27. I run the application to see the results.</p><p>28. I invoke the filter editor by clicking the “Edit Filter” button. 29. Let’s create a filter to display cars that have engines with 6 or more cylinders.</p><p>30. I apply the filter condition and close the editor. 31. Next, I’m going to change the view even more by grouping the data by specific columns.</p><p>32. Now that I have customized the view, I am going to save it by clicking the “Save Layout” button. 33. First, let’s see what the content of this XML file looks like.</p><p>34. I locate the “layout.xml” file in my application folder and open it.</p><p>35. You can see the GridView properties listed as “property” nodes.</p><p>36. Additionally, our custom filter is also saved in the “ActiveFilterString” property.</p><p>37. Let’s return to our application.</p><p>38. I’m going to clear the filter criteria and the column groupings.</p><p>39. I click the “Restore Layout” button and the custom view settings, including the user filter </p><p> criteria, are read back from the xml file and applied to the grid!</p><p>For more information, please refer to the XtraGrid’s Documentation (http://devexpress.com/Help/? document=XtraGrid). </p><p>Thanks for watching and thank you for choosing DevExpress!</p>