Visual Studio 2012 introduces another great feature for creating a user control out of the existing code. Till now we used to create different User controls and use it in main page. Now, with the introduction of Visual Studio 2012, we are developing the pages and generate the User controls from the existing page design.

For our sample, I used the default ASP.Net web application created by the Visual Studio. The Default.aspx page looks like the below.

Let us create our new User Control from the ordered list specified in the Default.aspx. Select the Code Snippet and right click to open the Context Menu.  

From the Context Menu, select “Extract to User Control” option. This will open the “Save as” window, where we need to specify the User Control name and select OK.

Now, Visual Studio will create the new “MyUserControl” user control and modify the Default.aspx page to utilize the same.   

MyUserControl is generated using the selected ordered list code as shown below.

Notice the changes in the Default.aspx page. Register tag for registering the user control is added on top of the page. Selected code snippet [in our case ordered list code] is replaced by the user control declaration.

Note: Visual Studio will copy only the designer code; it won’t copy the corresponding code behind code like the event handlers associated with the code snippet.