Add cookbook style examples

Leaving this comment, just to be completely open. I worked a bit on an example that @oddmax asked for about "level + exp" value changes that should be animated together in a specific way. But I currently lack time and motivation to fully implement it outside of specific context of a real game UI.

I might finish and publish this someday, but for now I can only say that these things stay awkward and annoying, and TinkState doesn't help much here. On the other hand I don't think it creates any obstacles either. :)

So, the example model we're talking about is something like:

class Player {
  public Observable<int> Level;
  public Observable<int> Exp;
}

And the UI in question is your typical "level progress" indicator like this (random picture from google images):

We want to react on both level and exp changes and animate exp progress filling up to the end and starting anew in case of level up.

Something like this would require some kind of animation queueing/orchestrating system that is of course completely out of scope of this library, however the question that might not have an obvious answer to a newcomer is: how to properly get a callback from both observables that will be only called once and give us enough info to proceed with animating.

So, following the idea of "derived" data, we can think of our "level+exp" pair (that we want to handle as one) as yet another case of value, derived from level and exp. This can be naturally represented as an auto-observable like this:

var levelAndExp = Observable.Auto(() => (Level: model.Level.Value, Exp: model.Exp.Value));

Now you can simply bind to this one in your view code an animate the changes as you see fit. Yeah, the animation code will probably be not the nicest still, as you want to manage animation queues, prevent double animations, prevent animating initial value bindings, etc, but at least you don't have to add extra things for that at the model level.

nadako / TinkStateSharp

Add cookbook style examples #25