Another common transition (always remember you should keep an eye on the meaning delivered by the transition to the user, possibly using them to make evident some implied reason a new view is being shown) is the one sliding the new content in front of the user, from right to left when entering the view and the other way around when leaving the view (there's no specific dictation about direction—again, you should fit the meaning of it within the context of your app).
We can start again from a simple TLayout container as the outer component, with its Align property initially set to None. Give TLayout a StyleName (slider) and a size (that is, Width: 400, Height: 400) so you should see it centered in the Style Designer as the following screenshot shows:
Now add another TLayout and name it container, position it at (0,0) coordinates and give it the same size as its parent (slider TLayout). Set its Align property to the...