Account assistant for Windows Phone Project Practice

Preface

I always wanted to create a windows phone application and a complete application, including design, coding, and testing. I used some small examples and tips in my previous blog. So I will share my experiences in developing windows phone applications with a specific project, I hope this will be helpful for your future WP7 journey.

I. Database preparation

The account assistant can also be an account (Money) management system. What is the first word that comes to mind in the management system? Is it a word like "Information Management System" or "Database"? Yes, we need to use a database in our account assistant. Since there is no built-in database support in the current Windows Phone (Mango update will provide SQL-CE support), we can only use third-party class libraries. Chenkai of the blog Park gave a good introduction to the use of databases on the Windows Phone 7 platform. Here I use winphone7db.
It is from the winphone7db project.
 
The implementation method is to store data using xml. I don't know if you have any idea about the DataTable and DataSet in. Net 2.0. I used to be familiar with these two things. In fact, they are also based on XML. Next, we will write a simple helper class to operate winphone7db and use Windows Phone 7 to isolate the storage space resource manager to view what the stored data looks like.

Then we place a button on the interface. The Button clicking event inserts data into the database. The Code is as follows:
 
After running, let's take a look at what's more in the app isolated bucket (for details about Windows Phone 7 isolated bucket Resource Manager, refer to my blog)
 
Right-click AccountHelper. wp7Db. Model. Money and Select Download. Open it using UltraEdit or another text editor and you will find that the content is actually an xml file, as shown below:
 
Note: NULL is auto generated by isolatedstorage explorer...
Source code download for winphone7db test project
What should I prepare next when the database is ready? By the way, it's a program framework! What is the best way to use the Shenma framework for windows phone applications? My answer is MVVM Light... maybe it is different for you.
Ii. MVVM knowledge preparation

2.1 Introduction to MVVM
MVVM introduction has many resources on the Internet, so I will not repeat it. I will share my understanding with you. MVVM, full name of letters (Model-View-ViewModel ). One thing I want to note here is that MVVM generally uses a class to bind the DataContext of the entire page, this class will be instantiated before the page constructor calls (so we can do some initialization ...).
2.2 Introduction to MvvmLight
There are many MVVM frameworks, such as the most common Prism of WPF and MvvmLight used in our project.

The MVVM Light Toolkit is a set of components helping people to get started in the Model-View-ViewModel pattern in Silverlight and WPF. it is a light and pragmatic framework that contains only the essential components needed.

MvvmLight is an open-source project. We can view its source code. MvvmLight is based on the MIT protocol and can be modified at will. MvvmLight also provides Visual Studio and Expression Blend templates to simplify our development.
PS: the source code of MvvmLight is in its directory GalaSoft. MvvmLight (NET35 ).

2.3 Command of MvvmLight

Command is one of the important features of WPF and Silverlight. However, it is unfriendly to Command support in silverlight for windows phone. Therefore, we need to use the existing framework to implement Command. Friends familiar with WPF and Silverlight should know the important use of ICommand. The Command in MvvmLight also implements this interface.

It is the initial implementation method of Command in MvvmLight. We can see that there are two classes: A common Command and a generic Command. They have CanExecute (whether to Execute this command, which is usually used to restrict the conditions for command execution) and Execute (Execute this command ). RaiseCanExecuteChanged (whether the conditions for command execution are changed) and RelayCommand (constructor ).
The third class graph is an extended Button, that is, attaching Command and CommandParameter to the Button. (Attachment attribute is a "terrible" technology, which is quite amazing ).

This class is used to convert events into commands if they are used in subsequent projects.

2.4 MvvmLight Messenger

I used MSN. The full name of MSN is actually Messenger. I used MSN as my God horse, not QQ. A foreign friend said that foreigners generally use MSN. The role of Messenger in MvvmLight is used for communication between View and ViewModel. Some children's shoes will ask, isn't View and ViewModel communicated through data binding? Binding is not omnipotent. In some cases, binding may even affect the program performance, because direct assignment is definitely faster than assigning a value through the binding engine. Messenger can Register (Register) an "Account (token)" In View or ViewModel and delegate the processing (usually operations on objects in View or ViewModel ), then Send a message to the ViewModel or View. After receiving the message, the code in the delegate will be executed. You can think of the time bomb in the csgame. I buried a bomb in your house, and then I can use the remote control to control whether the bomb has exploded... let's see how it works. It's the Messenger class structure.
 
Another use of Messenger is to use MessageBox in ViewModel...

PS: At first, I really didn't understand why to use Messenger. I had some usage experiences and had a little understanding after reading the comments in the source code. If you are interested, you can look at the source code and think about the truth.

Conclusion 2.5

MvvmLight is a lightweight MvvmLight framework that is easy to use and powerful. It is a must-have tool for home travel and WP7 development.

3. Expression Blend knowledge preparation

Blend is a powerful tool for interface processing. It facilitates the generation of XAML code. I have compiled an Expression Blend knowledge set for your reference. The use of Expression Blend is omitted for space reasons. In addition, the Blend series of foreign cool sorting is also very good, you can go to see the http://www.kirupa.com/blend_wpf/index.htm

Iv. Requirement Analysis and Logic Design 4.1 Requirement Analysis
Before giving a detailed description of how to implement this program, it is necessary to explain why account Assistant (that is, Requirement Analysis in software engineering, which is very important) should be implemented ). I used to write a ledger, that is, how much I spent and where I spent. There is a good software, a ledger (JZben), doing a very good job. However, because the memory is not very good, you may not be able to figure out where to spend money today or how much money you spent a few days ago... Because the program is installed on a computer, you may only be able to operate it for a certain period of time. This is why you need to implement similar software on Windows Phone, let you record your funds anytime, anywhere (the Funds seem a little exaggerated ...) . Because it is a simple record, I want to keep it as simple as possible. For example, there are only two types of income and expenditure types. In fact, there are still many situations, such as transfers and loans.
OK. The requirement analysis is simple and definite. We need to do this software, and there are not many requirements. Just sort it out:
1. Record where it is spent
2. Record it anytime, anywhere (this is Over, windows phone is always with you)
3. Number of total monthly income, total monthly expenditure, and total monthly income
4. It would be better to have a chart.
5. Easy to use and elegant (this may be what the software requires)

Okay, my AccountHelper is basically implemented according to the above requirements.

4.2 logical design

The main task of most programmers is to implement the software logically. In many cases, our programmers are dealing with logic problems. So we need to figure out the logic before writing the Code, or the code written will be useless! The flowchart of AccountHelper is as follows:

The flowchart is ready. In the project, which controls do we choose to present our data, or what are our pages? For details, see:

V. Coding

In software engineering, Coding accounts for a small proportion. But in actual development, many people often spend 70%-80% of their time on Coding. Most people think that they can design and code at the same time. This kind of thinking will make you get twice the result with half the effort! I remember when I said a word, "under the labor, in the labor, in the labor ". Although many programmers claim to be doing mental activities, they actually do labor work. They often don't want to spend time on thinking, but on hands-on: look at the entire project here. After reading a little bit, I thought I understood it, and I thought I would like to draw pictures from the gourd... Oh, Dear .... I have a similar idea before. I have never eaten pork, have I ever seen a pig run... "Give me a Demo, and I can create 10 similar demos for you "..... It's no wonder that Shanzhai is so popular in China ....

Amount. In the above section, we will focus more on the importance of demand analysis and logical design. If your logic is wrong, the software can be corrected. If your requirements are wrong, most of the software can only be retried... Okay: In the following Coding phase, I try to explain the rough Coding process in the most concise language. If I don't understand it, I can chat with you on Weibo, haha.

Right, we need a total of these pages: MainView (home page), SettingView (set page), NewChargeView (new page), and ChartView (Chart page ). Let's take it one by one. (Note: I will only introduce the general idea, not the detailed process)

5.1 Project Construction

 
For example, it is the general framework of the main project. We put classes of different roles in different namespaces for future management convenience. The main View is the same as the design drawing above. Of course, some namespaces need to be introduced here. As shown in:
 

5.2 homepage implementation

The home page is a panoramic view control with four items: menu items, expenditure list, income list, and personal data page. The general effect is as follows:
 
The income and cost list are actually two listboxes. There is no difficulty. As long as the data is properly bound, the data can be displayed normally. The only difference is that your ListBox is pretty (P.S is not good at art, the list is not very beautiful, hey ).
Next, let's take a look at how menu items are implemented. We can see that there are six menus in the menu items. Here we use bindings to implement these menus, that is, initialize these menus in ViewModel, in addition, the commands of these menus are bound to the same one. If we want to distinguish which menu the user clicks? We know that Command can pass parameters. Yes, it is implemented through CommandParameter. Is the XAML code of the Panorama project:
 
We can see that it is implemented using an existing turnstile, which inherits from ItemsControl, so these menus are actually ItemsControl one by one. Another template, TuenstileItemTemplate, is written in the template as binding and Command:

 

The front-end XAML code is ready. We need to prepare the corresponding attributes in the corresponding ViewModel. From the XAML, we can see that the Menu data source is a stuff named MenuList. What if this is a magic horse? Here we use the collection ObservableCollection in MVVM.

We instantiate the attribute in ViewModel and initialize the attribute. The following code is the initialization menu:

 
The corresponding Command processes the code. We execute the corresponding menu commands Based on the passed Type respectively.
 
Careful friends can find that we used Messenger in the above Code, so who should we send the message? It seems that I want to achieve page Jump in ViewModel. Let's see where Messenger was registered. We need to register this Messenger in the Post-code of MainView to achieve page Jump.
 
I believe you can understand the detailed notes above. Let's take a look at the implementation of my document page. Amount and expenditure are all written in disorder... we define a global variable in the Post-code of the App to record the information of the current user, such as the user name, monthly income, and monthly expenditure, and declare an attribute.
Public static UserInfo CurrentUser {get; set ;}
Then, instantiate and load in the constructor.
 
As for the Income and Expenditure lists, there are two listboxes. We will not introduce them. The constructor of MainViewModel is given below:
 

5.3 create a page

The new page is a standard PhoneApplicationPage with some text boxes that can be entered, allowing users to enter information and an ApplicationBar, allowing users to save data.
 

5.4 settings page implementation

The setting interface is not implemented ~~~ I am sorry ~~~~~

Vi. Room for Improvement

Due to the Demo and limited time and energy, many functions are not used. The source code is just a general framework, which may have many problems. Of course, if you want to continue to improve this Demo, you can proceed with the following convenience:

6.1. Support for multiple accounts
I originally wanted to implement the multi-account function, but it is also a small job for everyone, in fact, it is just to store them separately. In addition, when starting the program, determine whether there is an account currently. If not, you need to pop up the interface to create an account. If there are multiple accounts, take the account in the current setting.

6.2. multi-currency support
6.3. multiclass classification (only income and expenditure are available now)
In real life, it is certainly not only revenue and expenditure, but also can be subdivided into many categories, such as focus and borrowing. You can classify income and expenditure into shopping expenses, food expenses, wage income, bonus income, and so on. Of course, you need to add a lot of things. If you are interested, you can try it yourself.
6.4. Tombstone Processing
There is no tombstone processing in current projects. This is definitely not true. In actual projects, we must perform the tombstone processing: We use ready-made class libraries for processing, you can also write your own code.
6.5 Exception Handling

Postscript

I wrote this long article for the first time (so I especially admire the gay dedicated to writing long articles in the garden ).... I was excited when I saw "" last night... so I took the time to complete the article and demo this morning. Of course, there are many problems in it, because you need to improve it...

Updated: account assistant for Windows Phone project practice upgrading and happy tech salon technology sharing

Source code download: