• DaveDev

    Windows Phone 7 Tip - How to automatically sync your OneNote documents to the Cloud

    • 12 Comments

    OneNote for Windows Phone 7

    OneNote is one of my favorite Microsoft Office applications and an amazing note taking tool.  I use it constantly to take screen shots of websites or applications, quick dictation, to-do lists, and even some sketching/doodles (via my Tablet’s pen).  One of the goals of the OneNote Team was to bring that note taking application to all three screens (PC, Cloud and Phone).  With the release of Windows Phone 7 that goal became a reality and we can now sync notes between all three screens.  Changes made on the phone will be available on our desktop and changes made on our desktop will show up in a web browser.  If you haven’t checked out the free Office Web Applications yet you owe it to yourself to take a peek.  Office Web Applications are part of SharePoint, are available when editing or viewing any Office document on your Skydrive as well as through other services like Docs.com and Office Live Workspace.

    Four Easy Steps to Cloud Sync

    What I don’t think we have done a good job of is actually exposing this functionality on Windows Phone 7 easily.  I had a conversation just last night with someone who was adamant about Windows Phone 7 not being able to cloud sync One Note Documents yet.  This prompted me to write this blog post in hopes I can make it easier for you as well. 

    Step 1 – Open Microsoft Office Hub

    When we first open up the Office Hub we are presented with a list of shortcuts to our most recently used OneNote Documents.  You can also tap and hold on these shortcuts to pin them to your start experience on the phone (I use this for quick to-do or shopping lists).  What is not obvious at first is you need to hit the All icon to get to the rest of your documents and open up the syncing option. In the below screenshot you will notice I have just created a quick OneNote document called DaveDev and I am now going to click on the All icon.

     

    Main Menu - Click ALL

    Step 2  - Click on Refresh icon on the Application Bar

    This will take you to a list of Pages in your current Notebook.  Windows Phone 7 only has one Notebook by default where all of your Pages will be stored.  When we enable syncing however we will start to pull down all Notebooks from the Cloud.  This means we can select these other Notebooks and create Pages in them right on the phone.  So while we cannot create Notebooks directly on the phone we can integrate with them existing ones.  If we bring up the full Application Bar we will notice a Refresh icon.  Go ahead and click that now.

    Document ListDocument List

     

    Step 3 – Confirm that you want to start syncing your documents with Skydrive

    You will be asked to confirm that you want to begin syncing OneNote with your Skydrive.  What Skydrive would that happen to be?  When you created/entered your Windows Live ID into the phone you were automatically given 25 gigabytes of free storage in the cloud (what a nice present eh?).  Office Documents on Windows Phone 7 are integrated with your Windows Live ID so it will take care of everything for you.  Exactly the same way the Zune Marketplace and X-Box Live integration works.  Go ahead and confirm that you want to enable Skydrive sync.

    SkyDrive Confirmation Prompt

    You will now be notified during the process of the sync status.  First it will connect up to Windows Live and then it will set up a default notebook (Unfiled Notes) if it does not already exist.

    Connecting to Windows Live!Creating Default Notebook

     

    Step 4 – Verify that your notebooks and pages have synced

    Now that we have enabled sync you will notice some changes.  First, all of your notes will now include the SkyDrive Folder (Personal) and OneNote Notebook (Unfiled Notes) they have been synced to.  You will also notice a Notebooks option that is now available.

    Notes-Synced!

    Swiping the screen to the left or clicking on Notebooks will take you to the new Notebooks screen.  This screen will display the status of all your Notebooks currently located in Skydrive as well as their Sync status.

    Synced Notebooks and Pages!

    Notice too that you now have the ability within each Note to sync immediately back to your Skydrive.  Clicking on the Refresh icon will kick off this process for you.

    DaveDev Note - Sync Button

     

    Viewing your One Note documents from the Cloud

    So now we have One Note running on our Windows Phone 7 device and we have One Note running on our Windows 7 PC.  But, let’s say we are out, maybe over at a friends house, and we need to pull up a quick One Note document.  I told you our stuff is in the cloud so we should be able to get to it from any Web Browser, right?  Of course! 

    Simply point your browser to Windows Phone Live and you will be presented with a bunch of functionality for your phone.  This is really where your cloud integration comes alive!  X-Box Live achievements, avatar customizations, contacts, calendar, phone tracking, photos as well as our newly synced OneNote documents are accessible here.  Simply click on the View All link under OneNote and you will be taken directly into the OneNote Web App.

     

    OneNote at http://WindowsPhone.live.com

    Like all of the Office Web Apps the One Note Web App is full featured and even includes the familiar Office Ribbon.  Notice along the top you can see the current Skydrive folder my Notebooks are synced under (Personal Web).  This is the same folder we saw displayed on our Windows Phone 7 device.  On the left pane you can now navigate between all of your notebooks and their included pages.  Opening up my newly synced document will display it in the editor on the write and any changes here will save back to the desktop and my phone.

    SkyDrive - Editing my OneNote Docs

    To the Cloud

    Hopefully this eliminated any confusion you might have had around enabled Cloud sync for Office One Note documents on your Windows Phone 7 Device.  Although we only do this for OneNote today we have already announced a free Windows Phone 7 update later this year that will sync your Excel, PowerPoint and Word documents as well.  These documents will be able to sync back to your Skydrive like we have shown here in addition to the already existing SharePoint functionality. 

  • DaveDev

    “The application could not be started.” error when debugging a Windows 8 Metro Style App

    • 0 Comments

    I ran across this today and wanted to share the fix.  I have seen it crop up both XAML/C# and HTML/JS projects and has to do more with how the app is registered. 

    The error appears when you attempt to debug your Windows 8 metro Style App you will be prompted with a dialog informing you the application could not be started.

     

    UnabletoStart

     

    Clicking on Yes for more information will show you the id of the Metro Style App and point you to the Debug->Windows->Output window.  Unfortunately looking in the Output window doesn’t give you much information either.

     

    AppID

     

    The goods news is the fix is simple!  Simply exit out of Visual Studio 11 Beta and navigate to the solution file of your project.  Once there delete everything inside of the bin folder.

    Binfolder

    Then open the project back up in Visual Studio 11 Beta and it should deploy correctly for debugging!

    -Dave

     

    You may also want to check out my previous Windows 8 Metro Style Development Tips:

  • DaveDev

    How to install cool, custom fonts (like PDC09) into Windows and use it in your Silverlight application (or even Microsoft Word)

    • 0 Comments

    Whether you are someone who leans more towards design or coding you have probably come across the need for some interesting fonts.  Typography is a fascinating area with a long history dating back to the origins of print.  When we look at creating an engaging user experience today we are often trying to make a connection with our audience.  We “empathize” with our users needs and look to invoke certain feelings.  Fonts can do that in amazing ways and its pretty easy to add them to your own applications.

    PDC09Font

    The Microsoft Professional Developers Conference (PDC) site has a great art section where you can download wallpapers, blog bling and the font that they used.  Maybe its because I’m such a video gamer but the font really connected with me and brought back memories of playing Wipeout and Star Trek.

     

    Installing the Font into Windows

    I keep a local folder in my documents directory of all the fonts I have found intriguing.  Most of these go into my applications or demos I do for that extra sparkle.  You can keep them anywhere you would like however I just find this method the easiest to use.  That way I can zip up all my fonts if I need to use them on a different machine.

    Fonts

    Adding a font to Windows is as easy as double clicking on the filename.  The Font Manager window will them pop up (Windows 7 is pictured) and you will be given some typography information as well as samples of the font at different sizes.  Just click the install button and windows will register the font for use.

    FontsInstall

    This means ALL windows programs will now have access to that font such as Microsoft Word.  Keep in mind that custom fonts are not required to include both uppercase and lowercase. The PDC09 font (it’s official name is Squared) only includes lowercase for example.  So don’t scratch your head when word tries to capitalize at the beginning of a sentence and you see invisible letters.

    WordFont

     

    Using the new font in your Silverlight application

    Now that we have made sure the font installed correctly it is time to add it to a Silverlight Application.  In this example I am opening up Expression Blend 3, adding a simple gradient to the default grid layout and creating a TextBlock control.  I then selected the newly installed squared font from the textbox text properties and added some colors I thought to be pleasing.

    Font-SL

    Keep in mind one of the amazing things about Blend is we are seeing in real time what our application looks like.  This means for Silverlight the artboard is being rendered in Silverlight.  While we are in design time it understands the selected fonts and displays them correctly.  However if we run the application you will notice something happens.

    SLFontEmbedding

    This is where a lot of people get tripped up.  The application compiled, the browser opened up and it looks nothing like what it did in my Blend design surface.  So what is up?

     

    Font Embedding - it’s all about the download size!

    It is important to remember one of the core design principles of Silverlight is a small download size.  Every time you add a resource such as an image, a font, or a video the initial the size of your application will increase.

    Luckily, Silverlight is really smart about this.  It gives you the choice of not only which Fonts you wish to include in your application but also which parts of those fonts (Uppercase, Lowercase, etc.) giving you even more control over the size of your downloads. To bring up this menu simply click on the Font Manager button in the TextBlock text properties.  As mentioned above the squared font doesn’t use any uppercase which is why you will see the “S” missing.  Blend tries to capitalize the first letter of all the fonts being listed. 

    SLFontSize

    You can see both the Font Manager button and the Embed checkbox (I circled it in red) in the artboard screenshot above.  Keep in mind you do not have to select which pieces of the font to use Blend will automatically include all subsets of that font for you.  It is only necessary to check off the Embed checkbox for the font to be included in your application.

    Once you click the checkbox two things will happen.  A new Fonts directory will be created in your application and the selected Font source file will be copied into it for you.

    SLFontsFolder

    Blend will then modify the XAML source for your TextBlock to point to the newly installed Font resources in your project.

    FontEmbedding2

     

    Looking cool with just a TextBlock thanks to Fonts!

    We are now ready to show off our finished product.  Running the application will now show a correctly displaying TextBlock with the selected square font.  Amazing how much of a difference fonts can make even on a plain piece of text.

    TheFinishedProduct

    This is a trick you can use in all of your applications moving forward whether it is WPF or Silverlight based Blend and Fonts have got your back.

    Want more information like this?  The Microsoft Professional Developers Conference is coming up in less than 3 months! 

    PDC09Register

    If you register by September 15th you can also save $500 bringing the cost of a ticket down to only $1,595.  Be sure to check out the PDC site here for more details.

    Bookmark and Share

  • DaveDev

    Where is the suspend, resume and terminate toolbar in Visual Studio 2012 Ultimate?

    • 0 Comments

    Via Davedev.net

    I recently paved one of my demo machines and was running a fresh build of Visual Studio 2012 Ultimate RC.  I came across something interesting I thought I would share in order to save you time.  In the past I have been running Visual Studio 2012 Express RC and noticed in Ultimate things are in different locations.  For example, in Express you get a Store menu at the top but in Ultimate you need to go to the project properties to pull up the Store Menu.

    When I tried to force a suspend on an app I was running I noticed the Suspend/Resume/Terminate toolbar icons were missing!  I only had pause/stop debugging like you would get in all Visual Studio projects.

     

    ALL YOUR SUSPEND BUTTONS R BELONG TO US

     


    I right clicked and opened up my ToolBar options menu and found a Debug Location option.

     

    Debug Location Toolbar

     


    I then started debugging again and low and behold I now had Suspend/Resume/Terminate next to my process!

     

    Success!

     

    After doing a little web research I found an MSDN article here that talks about the menu item.  It doesn’t tell you to turn on the Debug Location Toolbar but it does show a screenshot.  I imagine this is due to the layout style you chose when first running Visual Studio Ultimate.  Express will always be set up in the best layout for Metro Style Apps where as my Ultimate installation was set up originally for Web Development.  In any event I hope this tip helps you out if you run into the same issues.

     

    As always if you decide to write a Windows 8 app and want to get into the Windows Store I would love to hear about it!  You may also want to check out my previous Windows 8 Metro Style Development Tips:

Page 4 of 68 (272 items) «23456»