Great session on what App Studio is and how easy it is to create an UWP app with great code. Presented by MVP Russ Fustino for Channel 9 video.

1. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Build UWP Apps with Windows App
Studio by MVP Russ Fustino
With Joe Darko, Program Manager Evangelist –
Southeast Region
Microsoft MVP Award Program
Deck: http://bit.ly/29Ivffb
http://appstudio.windows.com
http://www.fustinobrothers.com
http://Channel9.msdn.com/series/russ-toolshed
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

2. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Russ Fustino
A Little about me
• Developer Evangelist for Microsoft, Xamarin, Raygun and ComponentOne
• Microsoft Windows Development MVP
• Xamarin Certified Developer
• Publisher of Windows, Windows Phone, UWP , iOS and Android Apps
• Creator of Endorsed Jethro Tull app
• Co-head Mobile App Dev Tampa User group
• INETA Lifetime Achievement
• Project Manager - CogScreen programming effort

3. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Common UWP App dev tasks…
• UWP Templates –File New AND App Studio
• API’s for YouTube, Twitter, Flickr, Facebook and more…
• Need to consume any REST service
• Work with collections - Importing CSV
• How do I incorporate favorites?
• Graphics, what are the limits and where do I need them?
• Other: Command Bar, Hockey App, ListView, Detail View,
Navigation, Caching, Ad Client
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

4. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Agenda
• Templates for UWP
• Graphics
• Massive App Studio Updates in June Release
• Data
• Installable Packages
• Tour of the UWP code in Windows App Studio
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

5. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Templates for UWP
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

6. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Demos
• Products Catalog
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

7. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
• Transparent Icons
• Badge/Banner
• Hero Image
Graphics
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

8. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Hero Image Requirements
Naming Tips:
• Start with Letters not Numbers
• Use _ not -
• Exclude / and :
• Use .png format and flatten image
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

9. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Link Icons: Actions on Detail pages
• Links (Need URL in
Collection Data)
• Favorites
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

10. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Navigation Icons
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

11. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Demo
• Background Image
• Navigation Icons
• Link Icons
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

12. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Massive June Updates
• REST API Data Source
• Hosted Web App Capability Declarations
• Tool Improvements
• Generated App Improvements
• Open Source Library and Control Improvements
• Instagram Data Source Removed
• Instagram no longer want their users’ content accessed
outside of their 1st party apps without explicit permission
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

13. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Generated App Improvements
• New Shell Control: Improved navigation and nav pane
• New Detail Pages: Improved Layouts, better reading and
display taking advantage of HTML Block
• New About Page
• Performance improvements: Reduced memory and increased
loading speed
• Pagination & Infinite Scroll: Allows loading of more content
removing the fixed number (40) retrieved previously
• Ordering: Allows ordering of the content as established in the
app configuration.
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

14. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Open Source Library & Control Improvements
• https://github.com/wasteam/waslibs
• Improved RSS Data Source
• HTML Block: Added a new control to our XAML library that
transforms HTML and renders it as XAML, improving readability and
performance
• Infinite Scroll: allow apps to make pagination
• Animated GIFs: ImageEx control now supports Animated GIFs
• Carousel Redesign: better UX integration
• Slider View: Older small carousel improved
• REST API Data Source
• Data Source Ordering and Paging
• Data Source Language aware
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

15. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Demo UWP Samples

16. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Data - API’s for YouTube, Flickr,
Twitter, etc… Step by Step Provided
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

17. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Data Collections
• Option 1 – Manually enter data thru IDE
• Pros – Easy to do
• Cons – Time consuming, can’t do massive updates at once
• Option 2 – Use Windows App Studio Collection app
• Pros – Easy, better than using IDE
• Cons – Still Time consuming
• Option 3 – Import CSV
• Pros - Very Fast, massive reload support
• Cons:
• Raw exported CSV from Excel does not import to App Studio without errors
• Default excel export is using commas as delimiters
• Commas in data
• Tuff to create csv with semi colons delimiters natively in Excel
• All fields should be in “” as strings
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

18. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Windows App Studio Collections App
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

19. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Step by Step CSV for import
• Step 1: Add column headers manually in the IDE
• Step 2: Use same column headers in Excel
• Step 3: For image fields, use URL or fully qualified
local file path and file name
• Step 4: Use VB Macro to export with semi colons
and put double quotes around all fields
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

20. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
VB Macro to the rescue, use “;” as delimiter, Keeps
“,” in data and puts “” around each data field
• Public Sub OutputQuotedCSV()
• Const DELIMITER As String = ";"
• Const QSTR As String = """"
• Dim myRecord As Range
• Dim myField As Range
• Dim nFileNum As Long
• Dim sOut As String
•
• nFileNum = FreeFile
• Open "File1.txt" For Output As #nFileNum
• For Each myRecord In Range("A1:A" & _
• Range("A" & Rows.Count).End(xlUp).Row)
• With myRecord
• For Each myField In Range(.Cells(1), _
• Cells(.Row, 256).End(xlToLeft))
• sOut = sOut & DELIMITER & QSTR & _
• Replace(myField.Text, QSTR, QSTR & QSTR) & QSTR
• Next myField
• Print #nFileNum, Mid(sOut, 2)
• sOut = Empty
• End With
• Next myRecord
• Close #nFileNum
• End Sub
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

21. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Favorites
• Set on Config Tab
(for Collections)
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

22. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
REST API Data Source
• Supports GET
• See blog post:
• Example: add
event/concert listings to
your app, use an API from
a service like SeatGeek or
SongKick to pull in event
information for a region or
filter you specify.
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

23. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Demos
• REST API
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

24. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Installable packages
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

25. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Download Windows App Studio Installer
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

26. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Code
• Hockey App
• Navigation/Search
• Master/Detail – layouts for detail and list views
• Hockey App
• Caching
• Ad Client
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

27. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Hockey App -
Crash reporting and Tracking
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

28. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Demos
• Navigation/Search
• Master/Detail
• Command Bar
• Hockey App
• Caching
• Ad Client
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

29. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Summary
• Templates for UWP
• Graphics
• Massive App Studio Updates in June Release
• Data
• Installable Packages
• Tour of the UWP code in Windows App Studio

30. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
OK, So Where Do I Start?
30
Homepage: http://appstudio.windows.com
Text Tutorial: http://appstudio.windows.com/home/howto
Video Tutorial #1: Windows App Studio Walk Through
Video Tutorial #2: How to download the source code and add features in Visual Studio
Video Tutorial #3: How to Publish a Windows Phone app to Windows Phone Store
Video Tutorial #4: How to Publish a Windows tablet or PC app to Window Store
Full Curriculum for Instructors: http://aka.ms/appstudioeducation
Build an App in an Hour Curriculum: http://aka.ms/apphour
Technical Support: Windows App Studio Developer Forum
YouTube: http://www.youtube.com/windowsappstudio
Marketing BOM: http://1drv.ms/1tj9gxn
Feature Requests: http://wpdev.uservoice.com/forums/216486
VBA Macro http://www.mcgimpsey.com/excel/textfiles.html
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

31. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
More Resources
https://blogs.windows.com/buildingapps/2016/06/07/windows-app-studio-
june-16-release-harnessing-the-wealth-of-the-web-with-the-new-rest-api-
data-source/
https://blogs.msdn.microsoft.com/windows_app_studio_news/2016/06/07/
how-to-use-the-new-rest-api-data-source/
https://github.com/wasteam/waslibs
www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568

32. We Build Powerful Apps!
Theme: Learn, Knowledge-Base, Reward
All Rights Reserved
Link to Slide Deck: http://bit.ly/1O3DMEc
rich@fustinobrothers.com
russ@fustinobrothers.com gary@fustinobrothers.com
Thanks! It’s Easy to Connect With Us…
32www.FustinoBrothers.com | @FustinoBrothers
FBI: 850.366.3232 | Fax: 1.856.267.1568