Grid control on .NET Compact Framework

In this article I will show some typical issues one can encounter when developing mobile applications and how to solve them using a grid control that was designed for mobile devices from the scratch.

There are many differences between .NET Framework and .NET Compact Framework, yet many developers port their desktop applications to mobile platforms as if they were the same. Microsoft did some great work by creating the .NET Framework and the .NET Compact Framework which made the porting much easier. Still there are many peculiarities of the .NET Compact Framework which a good developer must consider. Taking a desktop solution, removing the unsupported methods and recompiling for Compact Framework often works, but leads to applications that don't look good (often because of the removed unsupported methods), are difficult to control (because they were designed to be used on a desktop which relies on a mouse) and are slow (simply because the processor speed is 5 times or even slower than on a desktop).

Let's have a look at standard Visual Studio DataGrid - a popular control among .NET developers which can be used to display data in tabular form. The problem with the compact version of DataGrid is that it was designed for desktop environment and then just dropped into the .NET CF. In this article I will show some typical issues one can encounter when developing mobile applications and how to solve them using a grid control that was designed for mobile devices from the scratch.

Data loading

DataGrid is a fine control when working with ADO.NET. However, ADO.NET is not very useful on .NET CF, because it copies the entire database into memory which is both slow and memory consuming. Furthermore, there is no simple way to manually insert new rows of data into the DataGrid instead of using data binding. Resco SmartGrid for .NET CF does not only provide a simple way of adding new rows of data, but most importantly ease of manipulation and customization that can be implemented using Visual Studio's designer. Adding data rows means adding Row objects to the SmartGrid's collection of rows.

Graphics capabilities

Whereas on a desktop computer the user can still quite comfortably view a 20 column grid, on a mobile device showing even 4 columns can pose a problem. On a mobile device each pixel is precious and potentially useful to render data. Plain text is very universal for describing various data types, but is also space consuming. To make the most of every pixel on the screen, using the graphics helps a lot.

Imagine that we have a database table containing the names of products, the monthly sales volumes in USD, the percentage of increase or decrease compared to the previous month and stocking information. Such information can be described using text (which is the only option when using DataGrid) or it can be graphically depicted as seen on Figure 1. The color of numbers in monthly sales already tells the user whether there was an increase or a decrease. The arrow icons are therefore not even necessary but they improve the user's ability to quickly tell the increased products from the decreased ones. The checkbox is also a much more convenient indicator of stock availability than plain True/False text strings or 1/0 numbers. The shopping-cart icon can provide even more information on readiness of the product for sale. Developers can easily handle the click on the shopping-cart icon and perform a meaningful action such as displaying an ordering form.

SmartGrid_01.png

Delayed Load

One of the big concerns of mobile device application development is speed. If the database table contains many rows, it may take a long time to load and display the data. However, this is not true with Resco SmartGrid for .NET CF, because of its Delayed Load technology. When this feature is engaged, the SmartGrid only loads the data currently visible and loads the additional ones on demand. The feature causes the application to show a grid form in a second no matter how many rows the underlying table contains. In cases where a mobile application is connected online to a remote database the Delayed Load makes the application more responsive and also places less load on the database server.

Built-in auto editing

Although the grid control is mostly used for displaying data, there are situations when it is convenient to use it also for data editing. For this purpose Resco SmartGrid supports the built-in auto edit. This feature allows the developers to set the SmartGrid's column so it automatically shows a suitable control allowing the user to edit column data. It's possible to use TextBox, CheckBox, or any other existing custom control to edit data. Figure 2 shows the Resco SmartGrid used in an ordering form.

SmartGrid_02.png  

SmartGrid_03.png

Conclusion

To optimally port an application from desktop computer to a mobile device can be tricky. Choosing appropriate controls brings certainly more satisfactory results in the sense of application's speed, professional look and comfort in its use. Resco SmartGrid is a .NET Compact Framework control designed specifically for mobile devices. Except of its numerous advanced features (such as touch scrolling, delayed load, XML serialization), it is a powerful substitute for the standard Visual Studio DataGrid control.

Resco SmartGrid control is part of Resco MobileForms Toolkit. You can find more information about Resco MobileForms Toolkit here.