Click here to Skip to main content
Click here to Skip to main content

Visualize Data on a Mobile Device using Visual Studio

This article is about displaying data in mobile applications built on the .NET Compact Framework platform. It demonstrates several typical data structures and their visualization on the small display of a mobile device.

Editorial Note

This article is in the Product Showcase section for our sponsors at CodeProject. These reviews are intended to provide you with information on products and services that we consider useful and of value to developers.

Introduction

Choosing an appropriate and readable form of displaying data can be tricky, particularly if you are limited by the display size of a mobile device as well as its relatively slow processor. Resco provides several controls coping with this problem in various scenarios.

A good mobile application has to be easy to handle. The user interface should be as simple as possible, preferably operable with one hand. Whether the user is driving a car or doing other activities, it is annoying if the application needs the attention of two hands at once. All this can be easily achieved with Resco MobileForms Toolkit.

Data in a Form of Table

Whether it is a SQL CE mobile database, DataTable class or any other IList data source object, Resco SmartGrid for .NET is perfect for displaying data in a form of table. Built-in editing capabilities allow you to edit the displayed data. You can even provide your own UserControl-derived object to edit the data in the cell and thus create your own editor. By using an ImageCell, you can display images inside the cells. This may help to provide additional information to the user while saving space on a small display. You can also set SmartGrid to utilize touch scrolling. The user can then scroll using his thumb.

01.png 02.png 03.png

Figure 1

Figure 2

Figure 3

Example 1: products table showing each product’s sales change, corresponding percentage and whether the product is in stock (see Figure 1).

Example 2: filling in the order using the built-in auto-edit capabilities (see Figures 2 and 3).

Data in a Form of List

You can display a one-dimensional list of data easily using Resco AdvancedList for .NET. Thanks to the possibilities of customization that Resco AdvancedList for .NET offers, you can create almost any kind of user interface. Compared to SmartGrid, AdvancedList only has a vertical scroll bar. It is designed in such a way that a horizontal scroll bar is not needed, because all the data can be fit into its width. This simplifies the user interface and brings more comfort to the user, who can operate the list using one hand (there is no need for the stylus).

04.png

Figure 4

Example: customer list showing detailed information about the selected customer. You can also display images and icons within AdvancedList’s rows and thus create a well-arranged list of properties of the customer (see Figure 4).

Tree-like Data Structures

Organizing data into a tree certainly brings the advantages of fast searching and brings the opportunity to put related data together, thus bringing order into the structure. The disadvantages are difficult data manipulation and display. Resco AdvancedTree for .NET puts both disadvantages aside. Filling AdvancedTree for .NET is easy because you can either fill all the branches of the tree yourself, or you can have AdvancedTree fire an event each time it needs the data to be loaded. In the event handler, it informs you which is the parent of the node you are currently adding, as well as what is the level of node you are currently adding. You can choose a different node template for each node and thus graphically differentiate the individual levels of the tree nodes.

05.png

Figure 5

Example: a list of customers showing each customer’s orders and order details at the third level (see Figure 5).

Statistical Data and their Graphical Representation

Charts are very useful for the graphical representation of huge amounts of statistical data. CompactChart for .NET offers 5 different kinds of charts for displaying the data. These include bar chart, line chart, pie chart, area chart and doughnut chart.

06.png 07.png 08.png

Figure 6

Figure 7

Figure 8

Example: bar chart showing a business result of a company in various affiliated companies or a turnaround in individual quarters of the year (see Figures 6-8).

How to Display Date/Time-related Data

Undoubtedly the most common way of displaying a date and time is in a calendar-like UI. However, programming the calendar is time-consuming. Resco Outlook controls (part of the MobileForms Toolkit) are designed for displaying the date/time-related data comfortably – in a calendar. The OutlookWeekCalendar control draws an overview of a week and can also display a time interval.

09.png 10.png

Figure 9

Figure 10

Example: displaying the scheduled business visits, appointments and meetings using several views: day view, week view, month view, year view (see Figures 9 and 10).

Displaying the date and time is one thing; choosing it is another. For this purpose, you can use OutlookDateTimePicker.

11.png 12.png 13.png

Figure 11

Figure 12

Figure 13

Example: setting the date and time of the order, invoice issue, contact’s birthday, ... (see Figures 11-13)

About Resco MobileForms Toolkit

  • More information about Resco MobileForms Toolkit can be found here.
  • You can download the evaluation version of Resco MobileForms Toolkit here.
  • For tutorials on Resco MobileForms Toolkit controls, refer to this webpage.
  • To view sample projects demonstrating the usage of Resco MobileForms Toolkit controls, refer to the following webpage.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

RescoDeveloper.Net
Web Developer
Slovakia Slovakia
Resco is a leading developer of wide range of mobile software products for the Microsoft Windows Mobile software platform. Besides the best selling end-user mobile applications, Resco offers also powerful developer controls and tools as well as enterprise mobile solutions.
 
For further information about Resco MobileForms Toolkit, visit www.resco.net/developer/mobileformstoolkit/
 
For further information abour Resco, visit www.resco.net.

Comments and Discussions

 
-- There are no messages in this forum --
| Advertise | Privacy | Mobile
Web01 | 2.8.140721.1 | Last Updated 30 Apr 2008
Article Copyright 2008 by RescoDeveloper.Net
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid