More Related Content
Viewers also liked
Viewers also liked (11)
Recently uploaded
Recently uploaded (20)
Your first windows 8 app
- 1. YOUR FIRST WINDOWS 8 APP Katherine Harris Christine Matheney
- 3. Agenda Welcome & Introductions What should you have in your toolbox? Your first Windows 8 App What can Azure do for you? And you thought XAML was hard… Lessons Learned Questions?
- 4. Your Windows 8 App toolbox C# XAML http://bit.ly/BizSparkSoCalCodeCamp
- 5. DEMO: YOUR FIRST WINDOWS 8 APP Starting with Visual Studio
- 6. What can Azure do for you? Storage Authentication
- 7. DEMO/TUTORIAL ABOUT AZURE Create To-Do App with Azure Backend Authentication via Twitter/Facebook
- 8. XAML! • Construct2 • Game Maker • Unity • VS Project structure – Common folder changes Project structure hasn’t really changed. Windows 8.1 projects still include Properties, Ref erences and Assetsfol ders, pfx and appxman ifest files. However, the Common folder content has changed. As a reminder, this folder contains some helpers for navigation, binding, states management, and some XAML resources in a dictionary. Some Added files: NavigationHelper : This new class serves as the replacement of LayoutAwarePage. It contains the logic your pages need to handle navigation and manage states. The LoadState and SaveState events are now part of this class. ObservableDictionary : this class used to be in the LayoutAwarePage.cs file. It now has its own file. ObservableDictionary is to dictionaries what ObservableCollection is to lists. RelayCommand : this class is a base implementation of the ICommand interface. Particularly useful for MVVM-based applications.
- 9. DEMO: XAML! Or whatever the beautiful Katherine deems good for the audience
- 10. Lessons Learned Windows 8 App != Windows 8.1 App There are differences, make sure you know what you’re building for • Standard Styles • • Sizing • • • • Use Go To Definition to view No more 320px snap 500px + App Bar Large Live Tile
- 11. New things in 8.1 (>5000 things) Controls (XAML) New controls: AppBar controls, CommandBar, DatePicker, Flyout, Hub, Hyperlink, MenuFlyout, SettingsFlyout, TimePicker Devices Human Interface Device (HID) protocol support for Windows Store apps Point of services (POS) device support with barcode and magnetic stripe readers Bluetooth device support for Windows Store apps Files Windows Store app file picker can now be used in a snap view (previously it was only available full screen) New SkyDrive experience as default file storage location and storage management settings Security App fingerprint authentication for users User experience/user interface New variable Windows Store app sizing New tile sizes (70×70, 310×310) In-pane search charm displays for app search suggestions and results New people/contact and events/calendar integration Alarm app lock screen support
- 12. Lessons Learned • START SIMPLE! • Don’t forget about the right side charms! • • • Privacy Policy Make it easy to rate your app Ask for help • What can we do to make your app idea come to reality? • Bing it! • Take pride in your work, but done is better than perfect • Minimum Viable Product
- 13. Questions? Thank you Loved the talk and want to learn more? Thought the talk needed some improvements? FILL OUT THIS SURVEY: http://bit.ly/1stWin8app Resources: http://aka.ms/StartBuilding http://bit.ly/DeveloperDownloads Contact us! Katherine Harris Christine Matheney Kaharri@Microsoft.com @KatVHarris Christine.Matheney@Microsoft.com aka.ms/Christine @matheneyc Ohours.com/Christine
- 14. But wait, there’s more! Your first Windows Phone App http://bit.ly/WinPhoneAppB4Lunch
- 15. DEMO/TUTORIAL Create a Template Windows Phone App
- 16. Questions? Thank you Loved the talk and want to learn more? Thought the talk needed some improvements? FILL OUT THIS SURVEY: http://bit.ly/1stWin8app Resources: http://aka.ms/StartBuilding http://bit.ly/DeveloperDownloads http://bit.ly/WinPhoneAppB4Lunch Contact us! Katherine Harris Christine Matheney Kaharri@Microsoft.com @KatVHarris Christine.Matheney@Microsoft.com http://aka.ms/Christine @matheneyc Ohours.com/Christine
Editor's Notes
- How many in the audience are students?Dreamspark Students can get access to premium products for free!! Visual studio ultimate, windows 8, and windows 7 for FREE!Bizspark if you’re building an app, and you plan to make money off of it, you can sign up! (You do need a website, which you can make on Azure!)App Builder (toolbox) if you build a Windows 8 app you can get Prizes!Azure Microsoft’s cloud offering. $ 200 in free credits, more details to follow. But you can host a website for free!Windows 8.1 Downloads you need to build an appMSDN All the information you might ever need, step by step what you might want to do.MVA in depth information on lots of topicsLocal Support Let us know how we can help you.
- WebsitesMobile ServicesDatabases StorageAuthenticationWindows apps, android, iOS
- Mobile Services:http://manage.windowsazure.comWebsites, VMS, etcNew Mobile service While we wait, let’s make a new website, to talk about our appCreate a new windows store app, download in C#Run app, enter a few items. Go see that they’re in Azure.Mark a few items as done, go refresh azure. Close and re-open app, everything is stored in the cloud.Let’s go look @ Code:App.xaml.cs - we create our mobile services client, if we had added azure to our existing app, we would have added the same code (go verify with the website)MainPage.xaml.cs – prove not storing locally. Walk thru code Authentication: We have an app, let’s add authentication. Because we live in a world where everything is searchable, search for authentication azure mobile serviceshttp://www.windowsazure.com/en-us/develop/mobile/tutorials/get-started-with-users-dotnet/ Twitter is the most complicated one, so it’s what we’re going to start with, then we’ll check out Facebook. Need to create a developer twitter account https://dev.twitter.com/ Check box in settings to allow twitter log in Copy consumer key and secret Copy code from azure site, and change to twitter FACEBOOK http://developers.facebook.com New app, no sandbox, log into website thru Facebook Copy app id, secret. Change code to say Facebook instead of twitter If extra time: Let’s go work on our website Go to url, create wordpress site. Publish a blog post!
- Open my to-do app, run snapped, show pillarbox. Retarget to 8.1Your probably wondering, should I build a Windows 8 App or a windows 8.1 app?
- Demo off right side charms – good apps you can rate and review from the main page (Songza is a good example)
- http://blogs.msdn.com/b/christinematheney/archive/2013/10/29/build-a-windows-phone-app-before-lunch.aspxStep 1 – Registerat http://apps.windowsstore.com/ Step 2 – Choose a TemplateAs you can see below, there are tons of options! I decided I’d create one for my hometown, Castro Valley, CAStep 3 - Title, Description, & ContentSuper easy! Hopefully if you’re building this app, you have an idea for a title and a description. As for your image/logo, you can either refer to my earlier post about logos, or pick a nice image off of Bing. Bing has an awesome feature where you can find images which are free to use commercially (which is what you probably want for your app)ContentEach tab is a different “page” of your app, meaning that you get to it by swiping left or right. I decided to change my pages a bit from the original categoriesThe two main ways of presenting information I used were pure HTML5 and tables.The HTML5 sections were simply text, for example, Geography:If desired, I could have gone in and edited the HTML…. but lunch depended on me finishing the app….so beautification was not a priority.Tables were slightly more challenging, but still totally do-able.You can either add each place individually: Or Import data via excel. (I recommend exporting it first so you can see the formatting, and then modifying that) It’s all CSV formattedSo, I did that for each of my sections/pages as appropriate.Step 4 – Style, Tiles, Splash & LockThere isn’t much to say for this section, basically pretty straight-forward. But I’ll show you what I did:I chose the flip template:And I chose default splash screen and lock screens:Step 4: Generate!App studio says it’ll email you when it finishes generating your application, but it doesn’t really take that long, I didn’t mind waiting.Soon, you’ll get this page. You’ll want to download the publish package. It will download as a .xap filedI would also recommend downloading the source code so that you can easily grab screenshotsStep 5: Publish!https://dev.windowsphone.com/en-us/publishIt’s only a 2 step process!Name your app, describe the category, and choose your pricingUpload your downloaded xap fileYou also need to add a description for the store as well as keywords.LAST PART – Upload images.App tile icon. You should already have that from your App Studio project.Screenshots. These were a bit more complicated. What I recommend is opening your source code (as mentioned earlier), and running it in the WXGA phone emulator.You can then take and save screenshotsThen you’re done! You can go ahead and submit your app for review./b/christinematheney/