What’s New in Visual Studio for C++...
Transcript of What’s New in Visual Studio for C++...
What’s New in Visual Studio for C++ Developers ---
Overview In this lab, you will take a quick look at some of what’s new in Visual Studio 2013 for C++ developers.
This includes the ability to create and better debug Windows 8.1 apps, IDE improvements that make
your life as a developer easier and more productive, new REST libraries that make connecting to services
much easier, and even some extensions that bring rename refactoring support and the ability to quickly
create a project file from a PDB to Visual Studio 2013.
This will not be a comprehensive look at all new features, but you will be able to follow provided links to
learn more when appropriate.
Objectives In this hands-on lab, you will learn how to do the following:
- Create a Windows Store app using C++ and the new Hub App project template
- Debug asynchronous tasks
- Utilize IDE improvements
- Get started adding push notifications to a Windows Store app
- Use the Visual C++ Refactoring extension to rename a function
- Use the PbdProject for Visual Studio 2013 extension to create a project file from a PDB file
Prerequisites The following are required to complete this hands-on lab:
- Windows 8.1
- Microsoft Visual Studio 2013 (with Update 2 RC applied)
Note: You must be an Administrator on the machine where you run this lab in order to install a
developer license.
Notes Estimated time to complete this lab: 30 minutes.
Note: You can log into the virtual machine with user name “User” and password “P2ssw0rd”.
Note: This lab may make references to code and other assets that are needed to complete the exercises.
You can find these assets on the desktop in a folder named TechEd 2014. Within that folder, you will
find additional folders that match the name of the lab you are working on.
Exercise 1: What’s New in Visual Studio for C++ Developers In this exercise, you will take a look at a number of new and improved features and capabilities provided
with Visual Studio 2013.
Task 1: Create a new Windows Store app using C++ In this task, you will create a new Windows Store app based on the new Hub App (XAML) project
template.
1. Open Visual Studio 2013.
2. Select File | New | Project.
3. Under Templates | Visual C++ | Store Apps | Windows Apps category and select the Hub App
(Windows) template.
Note: The Hub App template is new in Visual Studio 2013.
4. Enter HubApp in the Name field and then click the OK button to create the solution.
5. If you do not have a developer license for Windows 8.1 installed yet, you will be prompted to agree
to the terms and then install a license. Click the “I Agree” button if you agree with the terms. You
may also need to click Yes in the User Account Control dialog box that appears.
Note: Developer licenses are needed for each machine that you develop or test on, and are free to
obtain and use
6. If you are installing a developer license, you may also need to sign in with your Microsoft account.
Go ahead and sign in to finish the developer license installation.
7. After installing a developer license using a Microsoft account, you will be given 30 days before it
expires. Click the Close button.
8. Double-click on HubPage.xaml to load it with the XAML designer.
9. The Hub App template makes use of the new Hub control provided with Windows 8.1.
Additional XAML controls introduced with Windows 8.1 include:
- AppBar controls
- CommandBar
- DatePicker
- Flyout
- Hyperlink
- MenuFlyout
- SettingsFlyout
- TimePicker
Updates to XAML controls include:
- FlipView updates
- Headers for ComboBox, DatePicker, TimePicker, Slider, Edit controls
- Placeholder text
10. In the XAML pane for HubPage.xaml, scroll down and take note that the hub app that you created
does indeed use the new Hub control and defines a number of hub sections on the page to get
started with.
Note: The hub template uses updated Microsoft design principles that help you create great looking
apps with improved usability and additional flexibility.
11. In the Quick Launch bar at the top-right corner of Visual Studio, search for “document outline” to
locate the Document Outline window, and then click on the shortcut link to open it.
12. In the Document Outline window, right-click on the BottomAppBar node and select Add
CommandBar.
13. The CommandBar control, new with Windows 8.1, lets you easily create properly designed app bars
by providing automatic layout of commands and automatic resizing of the app bar when the app size
changes.
14. Expand the new CommandBar node in the Document Outline window to expose the nodes for
PrimaryCommands and SecondaryCommands.
15. Right-click on PrimaryCommands node and select Add AppBarButton. This adds a new button to
the app bar in the bottom-right corner of the design surface.
16. To see how easy it is to create a great looking app bar, replace the contents of the <CommandBar>
control with the following XAML.
XAML <AppBarToggleButton Icon="Shuffle" Label="Shuffle" /> <AppBarToggleButton Icon="RepeatAll" Label="Repeat" /> <AppBarSeparator/> <AppBarButton Icon="Back" Label="Back" /> <AppBarButton Icon="Stop" Label="Stop" /> <AppBarButton Icon="Play" Label="Play" /> <AppBarButton Icon="Forward" Label="Forward" /> <CommandBar.SecondaryCommands> <AppBarButton Icon="Like" Label="Like" /> <AppBarButton Icon="Dislike" Label="Dislike" /> </CommandBar.SecondaryCommands>
Note: If you need to do more custom work in the app bar beyond using the provided AppBarButton,
AppBarToggleButton, and AppBarSeparator, you will need to use an AppBar control instead of the
CommandBar.
17. Right-click on the Icon property for the first AppBarToggleButton and then select Go To Definition.
This is new in Visual Studio 2013.
18. Since the property is defined in metadata, the Object Browser will open to show the definition.
19. Close the Object Browser window.
Note: Additional additions and improvements to the XAML code editor include IntelliSense for data
binding expressions and resources, code snippets, and better commenting support. To learn more,
please see this article from the Visual Studio blog.
Note: Additional additions and improvements to the XAML designer include rulers and dynamic
guides (to help better position controls) and improved overall performance. To learn more, please
see this article from the Visual Studio blog.
Task 2: Debugging Asynchronous Tasks In this task, you will learn about improvements made to the Call Stack and Tasks windows that provide
additional debugging information when working with asynchronous tasks.
1. Open HubPage.xaml.cpp (right-click somewhere within the designer and select View Code).
2. Add the following code to the beginning of the HubPage constructor. This creates a few
asynchronous tasks that you will use to learn about the new asynchronous debugging features
found in Visual Studio 2013.
Note: The updates to Visual Studio 2013 described in this task depend upon features first introduced
in Windows 8.1.
Note: Asynchronous tasks in C++ are implemented in the Parallel Patterns Library, which is included
by default for Windows Store applications created using the project templates that come with Visual
Studio 2013 (ppltasks.h is included in the pch.h file).
C++ create_task([] { std::array<task<void>, 3> tasks = { create_task([] { unsigned i = 0; while (i < 100) { i++; } }), create_task([] { unsigned i = 0; while (i < UINT_MAX) { i++; } }), create_task([] { while (true); }) }; });
3. Set a breakpoint on the line that creates the first worker task, as shown in the screenshot below.
Note: Prior to Visual Studio 2013 and Windows 8.1, developers were unable to use the Call Stack
window to determine how an application got to the current location when debugging asynchronous
code. Since tasks are created on new threads, the Call Stack window did not contain information
about the call stack that existed when it was scheduled and, therefore, had no information about
the code sequence leading up to its execution.
4. With Visual Studio 2013 and Windows 8.1, developers will now see some additional stack frames
added when debugging asynchronous code that aids in understanding how the program reached a
location inside an asynchronous function. The additional frame(s) represent the call stack when the
task was first created and are added below the task’s actual call stack, with an annotated frame
named [Async Call].
5. Press F5 to start debugging the application.
Note: You may be prompted to build the project whenever it is out of date. For the remainder of this
lab, go ahead and click Yes each time you are prompted, or alternatively select the checkbox labeled
“Do not show this dialog again” and then click Yes.
6. The debugger should break right at the beginning of the lambda function that represents the
asynchronous task.
7. Take a closer look at the Call Stack window (Debug | Windows | Call Stack) and note that in
addition to the current call stack, you can see the annotated frame [Async Call] and the frame from
when the task was first created.
Note: If you were to select the stack frame just below the [Async Call], you would be taken to the
location in code, but you will not have access to local variables and other stack information. The
main benefit to the additional frame is traceability.
8. Another new debugging feature enabled for C++ developers in Visual Studio 2013 is Just My Code. If
you are familiar with any .NET Framework languages, you should already know that this debugging
feature steps over system, framework, and other non-user calls and collapses those calls in the call
stack windows.
9. To see what the Call Stack window would look like without the Just My Code feature enabled, right-
click somewhere within the Call Stack window and select the Show External Code option.
10. As you can see, this presents more noise than you would typically need to see during a typical
debugging session, and certainly makes it more difficult to locate the frames representing your
code.
11. Right-click within the Call Stack window and de-select the option to Show External Code.
Note: You can enable or disable the global Just My Code setting for Visual Studio (for all projects in
all languages) in the Debugging / General node of the Options window.
Note: C++ Just My Code is different than .NET Framework and JavaScript Just My Code because the
stepping behavior is independent of the call stack behavior. For more information, please see this
MSDN documentation.
12. Now take a look at the Tasks window (Debug | Windows | Tasks). The Tasks window resembles the
Threads window, except that it shows information about task_handle objects instead of each
thread. Like threads, tasks represent asynchronous operations that can run concurrently; however,
multiple tasks may run on the same thread.
Note: The Tasks window was formerly named the Parallel Tasks window when it was first introduced
in Visual Studio 2010, and was renamed for Visual Studio 2013. In addition to the rename, it has
been upgraded to aid Windows developers in understanding the state of all tasks and promises (in
the case of JavaScript) running in their application.
13. You can use the Tasks window to help debug hung and excessively long tasks when you work with
the concurrency runtime and task groups, parallel algorithms, asynchronous agents, and lightweight
tasks. For more information about tasks in native code, please see the MSDN documentation on the
Concurrency Runtime.
14. Note the new fields that show current Status, Start Time (relative to the start app), and Duration.
You should see that the currently selected task is in the Active state, and perhaps another task is in
the Scheduled state (completed tasks are not displayed).
15. If you hover over the Location column it will show a tooltip view of the call stack (which is
navigable).
16. If you would also like to see which thread has been assigned to each active task, you can right-click
within the Tasks window and select the Columns | Thread Assignment option.
17. In the case that you have a lot of Tasks in the application, you can also take advantage of grouping.
Right-click within the Tasks window and select the Group By | Status option.
18. Press Shift+F5 to stop debugging the application.
19. Visual Studio 2013 also introduces the Performance and Diagnostics Hub, which brings together
new and existing tools into one location, and makes it easier to see what tools are available for the
current project based on current language, application type, or platform. Future updates will also be
surface here, increasing the discoverability for testers and developers. To take a quick look at the
hub, select Debug | Performance and Diagnostics.
20. The startup project for the solution is automatically selected as the Analysis Target, and the tools
currently available are shown.
21. Select the Show All Tools link to view all of the tools included in the hub.
22. Note that all tools are now shown, although some are currently disabled.
23. Some of the tools shown here are not new in Visual Studio 2012 and 2013, but have simply been
moved into the hub. These include the Performance Wizard and JavaScript Function Timing tools.
New tools since Visual Studio 2012 include CPU Sampling, JavaScript Memory, and HTML UI
Responsiveness (some were introduced in product updates). New tools since Visual Studio 2013
include XAML UI Responsiveness and Energy Consumption.
Note: If you are interested in learning more about the new performance and diagnostic tools, please
take a look at this blog post by Dan Taylor. If you would like to dig in even more, you can also walk
through the New Visual Studio 2013 Diagnostic Tools hands-on-lab.
Task 3: Quick Look at IDE Improvements In this task, you will take a quick look at some of the miscellaneous improvements made in the IDE.
1. Open the IDE_Demo.sln solution file found in the lab’s Source\IDE_Demo folder.
2. Open App.xaml.cpp from the IDE_Demo project.
3. It is now possible for C++ developers to add event handlers using the same “+=” helper that .NET
developers have enjoyed for years. In the App constructor, add a Resuming event handler just
underneath the existing Suspending handler. To do this, type “Resuming +=” and then press the Tab
key twice to automatically stub out a handler and wire it up to the event.
Note: You need to wait until the project is fully opened and processed by Visual Studio before this
will work. Wait until the blue status bar near the bottom of Visual Studio shows “Ready”.
4. You will automatically be taken to the OnResuming stub method, where you would then provide an
implementation. For the purposes of this lab, we will leave the stub in place as-is.
5. It is now easier to fix up code formatting for C++ based on your preferences. Take a look at the
Helper class (towards the bottom of App.xaml.cpp) and note that it places opening braces on the
same line as the type and function definitions.
6. Assuming that the developer or team prefers to have open braces on a new line, you will now use
the IDE to specify your formatting preferences and then use that to re-format code on demand. In
the Quick Launch window in the top-right corner of Visual Studio, enter “new lines” and then select
the option related to new line formatting for C/C++.
7. In the Options window, modify the “Position of open braces for types”, “Position of open braces
for functions”, and “Position of open braces for control blocks” options to “Move to a new line”
and then click OK.
Note: The Options window is now re-sizeable.
8. Highlight all lines of the Helper class (towards the bottom of App.xaml.cpp) and then select Edit |
Advanced | Format Selection.
9. Moving lines of code around is now easier to do. Scroll to the top of App.xaml.cpp and place the
cursor on the line from the App constructor where the Resuming event handler is setup.
10. Move the line up above the Suspending event handler by pressing Alt+Up a few times.
11. In addition to Go To Definition, developers can now take a peek at the definition using the Peek
Definition feature, without the need to open a new code editor tab. Right-click on the call to the
InitializeComponent function and then select the Peek Definition option (or press Alt+F12).
12. Press Escape to close the peek view.
13. One more IDE improvement that makes navigating source code easier is the enhanced scrollbar. To
enable the enhanced scroll bar, right-click on the current scrollbar from a code editor window and
select Scroll Bar Options.
14. In the Options window for Scroll Bars, select the option to “Use map mode for vertical scroll bar”
and the option to use the Medium source overview, and then click OK.
15. The larger scroll bar using map mode provides an at-a-glance view of the code structure, unsaved
changes, breakpoints, and so on.
Task 4: Adding Push Notifications In this task, you will learn about how easy it is to add push notifications to your Windows Store app in
Visual Studio 2013. Visual Studio 2013 makes it easier to update your app tiles using mobile services,
send push notifications to your Windows Store apps, and access Azure mobile services backend
capabilities through integrated VS tools and a new C++ library for Azure mobile services.
1. Open the XamlSpiro.sln solution file found in the lab’s Source\XamlSpiro folder.
2. The XamlSpiro Windows Store app is a sample that shows one way to combine the use of DirectX
and XAML. In addition, it has integrated the use of Windows Azure Mobile Services and the
Windows Push Notification service to add a toast notification on app startup and each time the user
makes a selection and submits a string to the service.
3. Although the work involved in setting up a service and wiring up push notifications has already been
performed ahead of time, go ahead and select Project | Add Push Notification to view the new
wizard that is new to Visual Studio 2013.
4. The first screen of the Add Push Notification wizard describes the tasks that can be walked through
using this new wizard. This wizard makes it much easier to complete some of the tedious legwork
and plumbing code that was previously necessary.
5. In case it is tough to read the text in the screenshot of the wizard start screen above, it states that
the following tasks will be accomplished by completing this wizard:
- Your app will be associated with the Windows Store to acquire a push notification channel
URI.
- Code will be added to your project for sending the push notification channel URI to your
Windows Azure Mobile Service.
- Your Windows Azure Mobile Service will be modified to enable it to push notifications to
your app through the Windows Notification Service.
- To enable support for Live Connect sign-on, the redirect domain URI value of your Windows
Azure Mobile Service will be transferred to the Live Connect Developer Center.
6. Click the Cancel button.
7. Open the pushtechreadyserviceMobileService.cpp file from the XamlSpiro project (in
services\mobile services\pushtechreadyservice folder). This code returns a client instance for the
mobile service, which in turn utilizes C++ Azure Mobile SDK that is shipped with Visual Studio 2013.
Note: A working mobile service URI and application key are already filled in for you.
8. Now open the pushtechreadyservicePush.cpp file from the XamlSpiro project. This code is
responsible for setting up the push notification channel through which the app receives notifications
from the Windows Push Notification Service (WNS). It is also responsible for sending a test string
selected by the user to the mobile service, which in turn will send out a push notification to the app
with a message that includes the test string.
9. Press F5 to start the application.
10. The application will show a message asking you to load some photos.
11. When the application first loads, the push notification channel is setup and within a few seconds you
should see a toast notification appear in the top-right corner of the screen that says “Welcome!”
12. Right-click to open the bottom app bar and then click the Load Images button.
13. Navigate to the lab’s Source\XamlSpiro\Pictures folder and then click the Select All link.
14. Click the Open button to use the selected pictures.
15. Once the pictures have been opened, you should see one of the selected images shown in the app.
All of the selected images are being rendered in a 3D wheel using DirectX. Hold the mouse over the
left or right side of the screen to show the controls that can be used for animating the wheel
rotation, and then click to spin.
16. After the wheel stop spinning, one of the images should be selected (mostly centered and visible on
the screen). Right-click to show the bottom app bar once again, and then click the Accept button.
17. The text that is shown in the selected image will be sent to the mobile service, which in turn will
push out a notification to the app.
18. Close the app by pressing Alt+F4. To return to the Desktop, either press Win+D or select the
Desktop tile on the Start screen.
19. The C++ Azure Mobile SDK provides a set of REST APIs that are used to access and change table data
and retrieve authenticated login information. These REST APIs are implemented using the C++ REST
SDK, which provides an asynchronous, cross-platform way to send HTTP requests and handle
responses, work with JSON, and asynchronously work with streams and stream buffers. The latest
version of the C++ REST SDK, which also goes by the codename “Casablanca”, can be found on
CodePlex at casablanca.codeplex.com, or by searching for the latest NuGet package.
20. If you are interested in learning more about creating and working with mobile services, adding push
notifications, and authentication for C++ apps, please see this documentation on MSDN.
Task 5: Visual C++ Rename Refactoring In this task, you will install the Visual C++ Refactoring extension from the Visual Studio Gallery and then
perform a simple rename refactoring operation.
1. Download and install the Visual C++ Refactoring extension from the Visual Studio Gallery. Open
Tools->Extensions and Updates and search online for the extension.
Note: this extension was created by the Visual C++ IDE team from Microsoft.
2. After successfully installing the extension, you might need to restart Visual Studio.
2.3. oOpen the RenameDemo.sln solution file found in the lab’s Source\RenameDemo folder.
3.4. Open the MyClass.cpp source file and note that it has a function named DoSomething. This is not a
very descriptive name. Right-click on the function name and then select Refactor | Rename.
Formatted: Font: Bold
4.5. In the C++ Rename dialog box, enter a new name of ShowMessage and then click OK.
5.6. Once you are satisfied with the preview of changes, click Apply.
6.7. Select Build | Rebuild Solution to make sure that the project builds as expected.
Task 6: PdbProject for Visual Studio 2013 In this task, you will install the PdbProject for Visual Studio 2013 extension from the Visual Studio
Gallery and then walk through the process of constructing a project file from a .pdb file plus source
code.
1. Download and install the PdbProject for Visual Studio 2013 extension from the Visual Studio Gallery.
Note: this extension was created by the Visual C++ IDE team from Microsoft and can currently only
handle native sources.
2. Again, you might be asked to restart Visual Studio.
2.3. Many C++ projects aren’t built using Visual Studio and vcxproj files, but rather by using a legacy build
tool. In this case, the only way to utilize features such as tag browsing, IntelliSense, and object
browsing is to create a new project from existing code and then manually add the source.
3.4. Launch a new instance of Visual Studio 2013.
4.5. Select File | Open | Project/Solution.
5.6. Navigate to the lab’s Source\Legacy folder and change the extension dropdown to search for just
PDB Project files (*.pdb). Click the Open button.
6.7. After selecting the PDB file, the PDB Conversion Wizard window will open. This window is used to
map source referenced found in the PDB file back to source code.
7.8. Notice that Visual Studio SDK paths are automatically resolved, as they match the local machine
paths exactly.
8.9. There are also a number of unresolved paths for source files as the machine you are working on
does not have the same paths used when the executable was originally built. In this case, we need
to do a manual folder mapping to resolve. Select the ellipses button in the Browse column for the
original folder that includes the legacy folder at the end of the path.
9.10. In the PDB Generator dialog box, navigate to the lab’s Source\Repository folder and click Select
Folder.
10.11. With the manual folder mapping in place, the original filenames from the selected PDB file
should automatically be resolved by name to their selected location.
11.12. Click the Finish button.
12.13. In the Save As dialog box, click Save to save the project file.
13.14. The new project should now be opened in Visual Studio.
14.15. Although it will not build as-is, you can now navigate the source and use some of the IDE
features like IntelliSense. Open Lecacy.cpp and then hold the mouse over the call to Function().
15.16. To continue learning about all of the improvements and updates made in 2013 for C++
developers, please see this MSDN article. This article highlights all of the compiler and language
improvements, breaking changes to be aware of, library enhancements, C++ application
performance improvements, diagnostics enhancements, and more.