Sometimes you don't always know you want to encapsulate some
UI functionality as a re-usable user control until after you've already started
defining it on a parent page or control.
For example, we might be working on a form where we want to
enable a user to enter shipping and billing information. We might begin
by creating some UI to encapsulate the address information. To-do this we
could add a <border> control to the page, nest a grid layout panel inside
it (with 2 columns and 4 rows), and then place labels and textbox controls
within it:
After carefully laying it all out, we might
realize "hey - we are going to use the exact same UI for the billing
address as well, maybe we should create a re-usable address user control so
that we can avoid repeating ourselves".
We could use the "add new item"
project template approach to create a blank new user control and then
copy/paste the above UI contents into it.
An even faster trick that we can use within
Blend, though, is to just select the controls we want to encapsulate as a user
control in the designer, and then "right click" and choose the
"Make Control" menu option:
When we select the "Make Control" menu item, Blend
will prompt us for the name of a new user control to create:
We'll name it "AddressUserControl" and hit ok.
This will cause Blend to create a new user control that contains the content we
selected:
When we do a re-build of the project and go back to the
original page, we'll see the same UI as before - except that the address UI is
now encapsulated inside the AddressUserControl:
We could name this first AddressUserControl
"ShippingAddress" and then add a second instance of the user control
to the page to record the billing address (we'll name this second control
instance "BillingAddress"):
And now if we want to change the look of our addresses, we
can do it in a single place and have it apply for both the shipping and billing
information.