CHAPTER 15 WPF 4.0 AND SILVERLIGHT 3.0 370 Design Time Data Binding You can now define a new data source setting that is used just in design view. This could be useful to allow designers to see how formatting changes would look. At the time of writing I have no information on this feature. New Image Picker A new image picker dialog has been added that allows you to easily select images and will take care of formatting the returned path for you (see Figure 15-6). Figure 15-6. New image picker Improved Grid Designer VS2010 adds a new option to the DataGrid control to allow you to easily define how columns and rows should be sized. This window will appear when you define columns and rows and then hover over it. The menu allows you to choose the following options: Fixed (e.g. 200), Star (* weighted proportion), or Auto (where the size is determined by the contents). See Figure 15-7. CHAPTER 15 WPF 4.0 AND SILVERLIGHT 3.0 371 Figure 15-7. New grid designer feature Improved Error Handling for User Controls In VS2008, if you added a control to a page that contained an error, it would not appear and you would be left with no clue about what the error could be. This improves in VS2010 because the editor will now give you a detailed exception message allowing you to easily debug the problem (see Figure 15-8). Note that until the exception is fixed, the designer will be read only. CHAPTER 15 WPF 4.0 AND SILVERLIGHT 3.0 372 Figure 15-8. Improved error handling for user controls Static Resource and Designer Fix Previously, if a static resource was declared in app.xaml, you could not use it in the designer. In VS2010, you can. Drag-and-Drop Data Binding I’m not a big fan of drag-and-drop data binding and I think it’s fair to say that most programmers will rightly scorn such functionality. However, this type of feature can be very useful for quickly putting together simple data entry forms and prototyping applications. VS2010 includes new functionality to easily create data forms and creates some pretty clean XAML. It seems likely that Microsoft might have brought in this feature to encourage some winforms developers to move over. You will now learn about this feature by creating a simple master detail form. 1. Select Data Show Data Sources. 2. Click the Add New Data Source button on the Data Sources window, and the Choose a Data Source Type window will appear (see Figure 15-9). CHAPTER 15 WPF 4.0 AND SILVERLIGHT 3.0 373 Figure 15-9. Choose a Data Source Type dialog 3. Select Database and then click Next. The Choose a Database Model screen will appear (see Figure 15-10). Figure 15-10. Choose a Database Model dialog 4. Select Dataset (you could also use an entity data model for this feature) and then click Next. CHAPTER 15 WPF 4.0 AND SILVERLIGHT 3.0 374 5. In the next screen, select the connection to the example database connection (or create it if you haven’t already) and then click Next. 6. A new screen (similar to Figure 15-11) will now appear, allowing you to select the objects you want to use. Figure 15-11. Choose your poison (sorry) database objects 7. Select the Tables node to select all the tables and change the dataset name to Chapter15Dataset before clicking Finish. 8. You now have the data source set up and if you look over to the Data Sources window (see Figure 15-12), you will see all the tables and their fields. Figure 15-12. Data Sources window after configuring the data source CHAPTER 15 WPF 4.0 AND SILVERLIGHT 3.0 375 9. You will now create a data grid to show all the films. You don’t want the field FilmID to appear, so click the FilmID beneath the Film table node. A drop-down menu will then appear, allowing you to select different types of UI to be generated for the field. In this case, you don’t want it to appear, so select None. 10. Now drag the Film table node onto the designer surface to create a DataGrid of films (see Figure 15-13). If you run your project now, you will find a fully working DataGrid. However, you’re not done yet; VS2010 also supports the ability to easily create master detail forms. Figure 15-13. Data grid linked to Data source 11. You will now create a details panel to show more details of the film. Click FilmID (beneath the Film node) and change the type to Textbox. 12. Now click the Film node itself and on the drop-down menu change it to Details before dragging it to the right of the data grid (you might want to reposition the grid). 13. You also want to display all the film showings, so click the FilmShowing node and change the drop-down menu to List, and then drag it to the page beneath the grid. 14. Now press F5 to run your application and you will have a fully functional master details view similar to Figure 15-14. CHAPTER 15 WPF 4.0 AND SILVERLIGHT 3.0 376 Figure 15-14. The final product of the drag-and-drop binding Improved XAML Intellisense XAML Intellisense has been tweaked. Now when you enter the curly bracket for a binding expression, Intellisense will add the other curly bracket for you and pop up a dialog with available options (see Figure 15-15). It seems a shame the team didn’t go further with this feature and show you different objects you could bind to. Figure 15-15. Improved XAML intellisense . Figure 15- 10. Choose a Database Model dialog 4. Select Dataset (you could also use an entity data model for this feature) and then click Next. CHAPTER 15 WPF 4. 0 AND SILVERLIGHT 3 .0 3 74 5 14. Now press F5 to run your application and you will have a fully functional master details view similar to Figure 15- 14. CHAPTER 15 WPF 4. 0 AND SILVERLIGHT 3 .0 376 Figure 15- 14. . options: Fixed (e.g. 200 ), Star (* weighted proportion), or Auto (where the size is determined by the contents). See Figure 15-7. CHAPTER 15 WPF 4. 0 AND SILVERLIGHT 3 .0 371 Figure 15-7.