読者です 読者をやめる 読者になる 読者になる

atelier:mitsuba

i love UI/UX, Blend, XAML, Behavior, P5, oF, Web, Tangible Bits and Physical computing. なにかあればお気軽にご連絡ください。atelier@c-mitsuba.com

その38:Expression BlendでDataStoreを作成する。

連載:0から始めるExpression Blend 4 再入門

Expression Blendを使えばパネルからデータストアを作成することができます。
試しに利用してみましょう。

1.データタブから新しいデータストアを作成します。

2.データストアに名前をつけます。

3.できたデータストアを編集します。

4.名前や初期値、型を設定します。

5.適当にボタンを置いて、ContentにBindingしてみましょう。

6.データフィールドから、Bindingする要素を選択します。

7.ボタンに0が表示されました。


このDataStoreはxamlxaml.csからできています。
DataStore.xaml

<!--
      *********    このファイルを編集しないでください     *********
      このファイルはデザイン ツールにより作成されました。
      このファイルに変更を加えるとエラーが発生する場合があります。
-->
<DataStore:DataStore xmlns:DataStore="clr-namespace:Expression.Blend.DataStore.DataStore" Num="0" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" />

DataStore.xaml.cs

//      *********    このファイルを編集しないでください     *********
//      このファイルはデザイン ツールにより作成されました。
//      このファイルに変更を加えるとエラーが発生する場合があります。
namespace Expression.Blend.DataStore.DataStore
{
	using System;
	using System.Collections.Generic;

	public class DataStoreGlobalStorage
	{
		public static DataStoreGlobalStorage Singleton;
		public bool Loading {get;set;}
		private List<WeakReference> registrar; 

		public DataStoreGlobalStorage()
		{
			this.registrar = new List<WeakReference>();
		}
		
		static DataStoreGlobalStorage()
		{
			Singleton = new DataStoreGlobalStorage();
		}

		public void Register(DataStore dataStore)
		{
			this.registrar.Add(new WeakReference(dataStore));
		}

		public void OnPropertyChanged(string property)
		{
			foreach (WeakReference entry in this.registrar)
			{
				if (!entry.IsAlive)
				{
					continue;
				}
				DataStore dataStore = (DataStore)entry.Target;
				dataStore.FirePropertyChanged(property);
			}
		}
		
		public bool AssignementAllowed
		{
			get
			{
				// Only assign from loading once
				if(this.Loading && this.registrar.Count > 0)
				{
					return false;
				}
				
				return true;
			}
		}

		private double _Num = 0;

		public double Num
		{
			get
			{
				return this._Num;
			}

			set
			{
				if(!this.AssignementAllowed)
				{
					return;
				}
				
				if (this._Num != value)
				{
					this._Num = value;
					this.OnPropertyChanged("Num");
				}
			}
		}
	}

	public class DataStore : System.ComponentModel.INotifyPropertyChanged
	{
		public event System.ComponentModel.PropertyChangedEventHandler PropertyChanged;
		
		public void FirePropertyChanged(string propertyName)
		{
			this.OnPropertyChanged(propertyName);
		}

		protected virtual void OnPropertyChanged(string propertyName)
		{
			if (this.PropertyChanged != null)
			{
				this.PropertyChanged(this, new System.ComponentModel.PropertyChangedEventArgs(propertyName));
			}
		}

		public DataStore()
		{
			try
			{
				System.Uri resourceUri = new System.Uri("/WindowsPhoneApplication23;component/DataStore/DataStore/DataStore.xaml", System.UriKind.Relative);
				if (System.Windows.Application.GetResourceStream(resourceUri) != null)
				{
					DataStoreGlobalStorage.Singleton.Loading = true;
					System.Windows.Application.LoadComponent(this, resourceUri);
					DataStoreGlobalStorage.Singleton.Loading = false;
					DataStoreGlobalStorage.Singleton.Register(this);
				}
			}
			catch (System.Exception)
			{
			}
		}

		private double _Num = 0;

		public double Num
		{
			get
			{
				return DataStoreGlobalStorage.Singleton.Num;
			}

			set
			{
				DataStoreGlobalStorage.Singleton.Num = value;
			}
		}
	}
}


このC#から分かるようにDataStoreをデータパネルから作成すると、DataStoreに対して自動的にOnPropertyChangedやINotiyPropertyChangedが実装されています。

次に、SetDataStoreValueActionを使ってみましょう。
SetDataStoreValueActionをボタンに設置します。

クリックされたらDataStoreのNumを1増やすように設定します。
Incrementにチェックをいれるとその分値を増やすビヘイビアになります。

実行してみましょう。
ボタンを押すたびに値が増えていくことが確認できます。