There’s lots of data features in Blend to provide food for future posts but this post is about the data store that showed up in Blend 4.

This is a fairly simple idea and I suspect that I’d use it more in the realm of a SketchFlow application than I would in a real application as I tend to see it as a way for a designer to store something outside of the underlying object model that they’re data-bound to and I’m not sure I’d want that to happen in a real application.

Say I’m sketching a simple login screen and I’ve sketched out this UI;

and I only want that red text to be visible when the prototype user has got their password wrong 3 times.

It’s easy enough to define a couple of states for this UI – one where the red text is visible and one where it’s not. But how do I drive the state transition when the user has done something 3 times and, especially, if I’m just prototyping and I don’t yet have some underlying data to bind to that does this for me?

Enter the data-store. On the data tab I can define a new data-store;

and I can define that data store in the project using the dialog and name it giving me;

and then I can use the little + button to add 2 more properties, rename them and then use this highlighted button;

in order to edit my values and to change their data type;

Ok, so now I’ve got my 3 values. I now need to ensure that when the Button is clicked, I set up a SetDataStoreValueAction;

and I can tell this action (via its properties) to increment my RetryCount;

note that this is set to increment the value by 1.

But I only want this to happen under particular circumstances (when the username/password is wrong) so I can go over to the properties for the action and set that up to use conditional behaviours (new in Blend 4);

I’ve set up 2 conditions there on this action which essentially say;

If the DataStore.UserName is not equal to the Text property of the UserName control or the DataStore.Password is not equal to the Password property of the Password control

so we will only increment the DataStore.RetryCount under those conditions (note that I’ve no logic anywhere to reset it to 0 if you get your credentials correct).

That’s “great” but when this RetryCount hits the value of 3 I still have a bit of a problem in that nothing anywhere is driving the state transition on my UI to display the error text.

I’d already defined 2 simple UI states;

So I need to use a GoToStateAction which I can do;

and I can set up its properties and use a Trigger;

note that this Trigger is firing when the DataStore changes and so I can configure that up;

and I’m in business. Here’s my fabulous UI running where I’ve failed to log in 3 times;

you might notice that I added a ProgressBar here. I wanted to be able to visualise the RetryCount property to aid “debugging” and so I dropped that ProgressBar on the UI and data-bound it to the RetryCount;