「家の予算」を作成しています。 パート1

この記事は、WP7の家の予算を最初から便利に管理するためのアプリケーションを作成するプロセスを説明する潜在的なシリーズの最初の部分です。 同時に、カバレッジを最大化するために、さまざまなAPIとプラットフォーム機能が開発で使用されます。 同時に、プログラムは完全に使用可能になり（少なくとも1人の永続ユーザーが含まれます）、学術目的のみに使用されるごみはありません。



アプリケーションの種類の選択は、市場で最初に購入したプログラムが予算だけだったという事実によるものですが、その計画はなく、いくつかの有用な機能（SkyDriveへの自動バックアップなど）があります。

開発原則

機能は10〜14日間続く小さな反復で徐々に増加し、そのうち3〜5日間は前のバージョンでの実行に、1日間はブレインストーミングに、残りは計画の実装、テスト、および記事の設計に割り当てられます。



同様のユーティリティの代わりに、作成したアプリケーションを毎日使用する予定なので、機能は正確に必要なものでなければならず、書くのが簡単なものではありません。

最初の反復：計画

まず、トランザクションを追加し、少なくとも基本的なカテゴリを作成する必要があります。そうしないと、使用の1週間で小さなゴミ箱ができてしまいます。

この記事では、データベースの作成プロセスとカテゴリの追加プロセスを詳細に（おそらく多すぎる）見ていきます。 トランザクションを追加するプロセスは、カテゴリの操作とほぼ100％類似しており、その考慮が記事を非常に大きなサイズに膨らませるため、考慮しません。 また、カテゴリを編集するプロセスは考慮しませんが、使用する作業のモデルを考えると、+-10分かかります。

必要に応じて、これらのトピックは次の記事で簡単に説明するか、スキップできます。



したがって、次のような質問を検討します。

• WP7開発の基礎
• Metroの基本 ^[1]
• SQLCEデータベースを操作し、コードファーストの原則に基づいてモデルを作成する

前提条件

• .NETおよびC＃の基本的な知識
• Windows Phone SDK 7.1
• Silverlight for Windows Phoneツールキット （ 2011年11月版）
• マンゴー用に更新されたPrism for Phone ^[2]

開発：データベースの作成

誰かがこの記事をレッスンとして使用したい場合は、論理的に完了した重要度の高い段階ごとに、結果を含むアーカイブへのリンクが表示されます。 SkyDriveのすべてのソース 。 削減の場合、個別のファイルがpastebinに表示されます 。



アプリケーションの構造を選択するとき、私は主にプロジェクトによって実行される機能の論理的な分離に焦点を合わせます。 これらの考慮事項に基づいて、データベースとすべての種類のデータの説明を作成するために、エンティティと呼ばれる別のプロジェクトを作成します。System.Data.LinqおよびMicrosoft.Practices.PrismをReferencesに追加することを忘れないでください。 解決策はこちら 。



すぐに予約を行います-トランザクションの概念により、データベース内のトランザクションではなく、金融トランザクションを意味します。

データベースを作成するときは、コードファーストアプローチ^[3]を使用します今日のタスクでは、トランザクションとカテゴリという2つのテーブル全体に満足しています。 2つの空のテーブルを作成し、それらをデータベースに追加します。



Transaction.cs

[Table(Name = "Transactions")] public class Transaction : NotificationObject
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

Category.cs

 [Table(Name = "Categories")] public class Category : NotificationObject
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

Database.cs

 public class Database : DataContext { private static string DBConnectionString = "Data Source=isostore:/Database.sdf"; public Database() : base(Database.DBConnectionString) { this.DeferredLoadingEnabled = true; } public Table<Bick.Budget.Entities.Categories.Category> Categories; public Table<Bick.Budget.Entities.Transactions.Transaction> Transactions; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

フィールドではなく、データベースプロパティにテーブルを作成することさえ考えないでください。 プロパティを一般向けに使用するという文体的な習慣のため、データベースがまったく機能しない理由を理解しようとして約1時間殺しました。

ここで、トランザクションとカテゴリは、将来のUIとの通常の対話のためにPrismで定義されたNotificationObjectを継承します。 ところで、開発時にはMVVMパターンを使用します。

データベースコンストラクターで、DefferedLoadingEnabledフラグを設定して、データベースからの関連オブジェクトの自動読み込みを無効にします。 必要になります-別途指定します。

テーブルの内容の形成に進みます。 その結果、次のようになります。



Transaction.csのハイライト ：

 [Column(IsPrimaryKey = true)] public Guid ID { ... } ... private EntityRef<Categories.Category> category; [Association(Name = "FK_Transactions_Category", Storage = "category", ThisKey = "CategoryID", IsForeignKey = true)] public Categories.Category Category { get { return this.category.Entity; } set { Categories.Category previousValue = this.category.Entity; if (((previousValue != value) || (this.category.HasLoadedOrAssignedValue == false))) { if ((previousValue != null)) { this.category.Entity = null; previousValue.Transactions.Remove(this); } this.category.Entity = value; if ((value != null)) { if ((value.AddedTransactions == null) || (!value.AddedTransactions.Contains(this))) { value.Transactions.Add(this); } this.CategoryID = value.ID; } else { this.category = new EntityRef<Categories.Category>(); } this.RaisePropertyChanged(() => this.Category); } } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

IDパラメーターは、テーブル列と主キーです。 残りの列もColumn属性で指定されます。 msdnの属性ベースのマッピングの詳細を読むことができます。

CategoryとCategoryIDは、トランザクションをカテゴリにバインドする役割を果たします。この例では、外部キーFK_Transactions_Categoryを作成しました。 肥大化したセッターの理由は、トランザクションを親カテゴリに割り当てるときに、以前の親カテゴリからトランザクションを削除し、新しいトランザクションに追加する必要があるためです。 大まかに言えば-EFのナビゲーションプロパティ。 カテゴリは、これを実装するために最小限のコードを使用します。



Category.cs ：

 public EntitySet<Transactions.Transaction> Transactions { get { if (this.transactions == null) { this.transactions = new EntitySet<Transactions.Transaction>(); this.transactions.CollectionChanged += new System.Collections.Specialized.NotifyCollectionChangedEventHandler(this.OnTransactionsChanged); } return this.transactions; } ... } ... private void OnTransactionsChanged(object sender, System.Collections.Specialized.NotifyCollectionChangedEventArgs e) { this.AddedTransactions = e.NewItems; foreach (Transactions.Transaction t in e.NewItems) { t.Category = this; } this.AddedTransactions = null; this.RaisePropertyChanged(() => this.Transactions); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

実際、Categoryでは、カテゴリがトランザクションに割り当てられていないが、新しい要素がカテゴリ内のトランザクションのリストに追加される状況をキャッチします。

ベースの準備ができました。 SkyDriveのソリューション 。

開発：UIを作成する

Windows Phoneアプリケーションとして作成したシェルプロジェクト。つまり、この段階では、ピボット/パノラマなどのコントロールは使用しません。 アプリケーションとのユーザーの対話は、おおよそ次のスキームに従って行われます。



作成するために、Expression BlendとSketchFlow（無料SDKには含まれていません）およびWP7のスケッチフローテンプレート（ CodePlex ）を使用しました



これらの画面を次のビューに分割します。新規/トランザクションの編集、カテゴリの新規/編集、カテゴリリスト、トランザクションリスト、トランザクションの処理を担当する部分は別のプロジェクトに転送されます。 SkyDriveのソリューション 。



まず、カテゴリのリストを表示し、カテゴリを追加する機能を実装する必要があります。 これについて特別なことは何もありませんが、パフォーマンスに焦点を合わせようとしているため、データベースを少し改良する必要があります。 実際のところ、カテゴリのリストを表示するときには何も編集しません。できるだけ早くカテゴリのリストを取得するだけです。 これを行うために、 Database.csでそのような修正を行います 。

 public Database(bool isReadOnly = false) : base(Database.DBConnectionString) { if (!this.DatabaseExists()) { this.CreateDatabase(); } this.DeferredLoadingEnabled = true; this.ObjectTrackingEnabled = !isReadOnly; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

したがって、isReadOnly == trueの場合、コンテキストオブジェクトの変更の追跡をオフにします。これにより、単純な読み取りの速度が平均で10倍以上向上します。



UIを作成するとき、私たちが直面している問題の1つは、任意のBehaviorをApplicationBarButtonにアタッチできないことです（コマンドにバインドするためにこれが必要です）。 Prism.InteractionsにはDependencyProperty ApplicationBarButtonCommandがありますが、何らかの理由で機能しませんでした。 したがって、非常に便利なAppBarUtilsライブラリを使用する必要がありました。

CategoriesView.xamlからの興味深い瞬間 ：

 <phone:PhoneApplicationPage xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" xmlns:appbar="clr-namespace:AppBarUtils;assembly=AppBarUtils"> … <phone:PhoneApplicationPage.ApplicationBar> <shell:ApplicationBar IsVisible="True" IsMenuEnabled="False" Mode="Default"> <shell:ApplicationBarIconButton IconUri="/icons/appbar.add.rest.png" Text="add new"/> </shell:ApplicationBar> </phone:PhoneApplicationPage.ApplicationBar> <i:Interaction.Behaviors> <appbar:AppBarItemCommand Id="add new" Command="{Binding Path=AddCategoryCommand}"/> </i:Interaction.Behaviors>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ほとんどの場合、ボタンのアクションはアプリケーションの他のページへの遷移であり、ViewModelからのナビゲーションを操作するための便利なメカニズムを作成する必要があります。 便利で比較的馴染みのある（私はかつてデスクトップMVVMを同様の方法で使用していました）、この方法をここで説明します 。 ApplicationControllerクラスを作成して、Commonプロジェクトに同様の原則を実装します。 また、すべてのビューは、KnownPages静的クラスで定義されます。

 public static class KnownPages { public const string AddCategory = "/Views/CategoryAddEditView.xaml?mode=Add"; public const string EditCategory = "/Views/CategoryAddEditView.xaml?mode=Edit&id={0}"; public const string ListCategories = "/Views/CategoriesView.xaml"; public const string CategoryDetails = "/Views/CategoryDetailsView.xaml?id={0}"; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

、ApplicationControllerからのNavigateTo（）（元のものはあまり残っていません）は次のようになります。

 public void NavigateTo(string url, params object[] data) { Uri address = new Uri(String.Format(url, data), UriKind.Relative); PhoneApplicationFrame root = Application.Current.RootVisual as PhoneApplicationFrame; root.Navigate(address); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ここで、パラメータmode = AddをAddEditページに渡すため、ViewModelでナビゲーションイベントをキャッチし、文字列からデータを取得する必要があります。 残念ながら、現時点では、CodeBehind'eでOnNavigatedToメソッドをオーバーライドし、ViewModelで対応するメソッドを呼び出すオプションを決定しました。

CategoryAddEditView.xaml.cs ：

 protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e) { base.OnNavigatedTo(e); ((CategoryAddEditViewModel)this.DataContext).OnNavigatedTo(this.NavigationContext, this.NavigationService.BackStack.First()); }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

コードからわかるように、ナビゲーションコンテキスト（ページアドレスからパラメーターを引き出すのに便利な場所）だけでなく、現在のページに切り替えたページも送信します。

次に、カテゴリを追加するプロセスを実装する番です。 プレーンビューとプレーンビューモデル。 しかし、2つあります。 まず、モードパラメーターを取得して処理するNavigationContextから、それぞれ同じMV-VMをカテゴリの編集に使用します（宿題になります）。 2番目は、TextBoxのWP7では、要素がフォーカスを失ったときにのみプロパティ値の変更が発生することです。 ネイティブの方法では、これは実装されていないため、Prism（CategoryAddEditView.xamlファイル）を使用します。

 xmlns:prism="clr-namespace:Microsoft.Practices.Prism.Interactivity;assembly=Microsoft.Practices.Prism.Interactivity" ... <TextBox TextWrapping="Wrap" Text="{Binding Path=Category.Name, Mode=TwoWay}"> <i:Interaction.Behaviors> <prism:UpdateTextBindingOnPropertyChanged /> </i:Interaction.Behaviors> </TextBox>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

カテゴリを保存するプロセスは次のようになります。

CategoryAddEditViewMode.cs

 public void SaveCategory() { if (!this.isEditMode) { this.model.AddCategory(this.Category); ApplicationController.Default.GoBack(); } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

注意すべき点-CategoriesViewページには移動せず、前のページに戻ります。 ユーザーが[戻る]ボタンをクリックした後、期待した場所で途方に暮れていないように、アプリケーション内のこのような遷移に注意する価値があります。

CategoryAddEditModel.csでは、保存は次のようになります。

 public void AddCategory(Category cat) { using (Database db = new Database()) { db.Categories.InsertOnSubmit(cat); db.SubmitChanges(); } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

チェックと検証は行われていないことがわかりますが、これは悪いことです。 しかし、最初の記事では既にかなりの量の資料がありますが、今では主要な機能を終了してプログラムの使用を開始することがより重要です-記事間または以下で残りを行います。

カテゴリのリストに戻るとき、ViewとViewModelは再割り当てされないため、リストページから追加ページに切り替えるとき、IsReloadPendingフラグを設定し、それを処理して、戻り時にリセットします。

CategoriesViewModel.cs ：

 private void AddCategory() { this.isReloadPending = true; ApplicationController.Default.NavigateTo(KnownPages.AddCategory); } public void OnNavigatedTo(NavigationContext context, JournalEntry lastPage) { if (this.isReloadPending) { this.isReloadPending = false; this.Categories = this.model.GetCategoriesList(); } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

まとめ

今日、WP7での作業に必要なすべてのツールを入手し、データベースでの動作をテストし、Windows Phoneのプログラムと学習プログラミングテクノロジのさらなる開発の準備を整えました。 また、いくつかの妨害（ApplicationBar、TextBox）に遭遇し、それらを克服しました。

はい-プログラムを使用する準備ができていませんでした（データコレクターとして）が、この段階から約1〜2時間かかります。 誰が気にする-彼らは自分でそれを試してみます。 SkyDriveのソリューション 。



同時に、C＃に精通している人は、Microsoftのモバイルプラットフォームは非常に簡単に習得でき、独立して簡単に習得できることを理解しているはずです。



同時に、同様の記事を書くのに時間がかかることに気付きました。 この記事は、アプリケーションの作成と並行して、日記形式で作成されました。

今後の計画

次の記事では、検討したいと思います。

• 二次タイル作成プロセス
• アプリケーション起動の最適化
• SketchFlowでのアプリケーションのプロトタイピング

文学

1. WP7 UI / UXノート
2. Microsoft Prism開発者ガイド
3. プログラミングガイド（LINQ to SQL）