SlideShare uma empresa Scribd logo

Adding an application bar to metro style app using html and java script

•Transferir como PPTX, PDF•
•
David Isbitski
David Isbitski

This short screencast will show you how to add an Application Bar to your own Windows 8 Metro Style App using HTML and JavaScript. We do this in a fun, immersive way utilizing the free MetroGameKit (http://metrogamekit.codeplex.com). Fore more videos check out http://blogs.msdn.com/davedev

Tecnologia
1 de 5
Step 1: Adding the AppBar to the DOM Default.html Step 2: Declaring the Appbar and Commands WinJS.UI.AppBar and WinJS.UI.AppBarCommand Step 3 : Handling the events Click Events
Adding an application bar to metro style app using html and java script
Adding an application bar to metro style app using html and java script

Recomendados

Living the Dream: Make the Video Game You’ve Always Wanted and Get Paid For It!
Living the Dream: Make the Video Game You’ve Always Wanted and Get Paid For It!Living the Dream: Make the Video Game You’ve Always Wanted and Get Paid For It!
Living the Dream: Make the Video Game You’ve Always Wanted and Get Paid For It!David Isbitski
 
Lap Around Azure Build Updates
Lap Around Azure Build UpdatesLap Around Azure Build Updates
Lap Around Azure Build UpdatesDavid Isbitski
 
Building Windows 8 Metro Style casual games using HTML5 and JavaScript
Building Windows 8 Metro Style casual games using HTML5 and JavaScriptBuilding Windows 8 Metro Style casual games using HTML5 and JavaScript
Building Windows 8 Metro Style casual games using HTML5 and JavaScriptDavid Isbitski
 
Azure Mobile Services for iOS
Azure Mobile Services for iOSAzure Mobile Services for iOS
Azure Mobile Services for iOSDavid Isbitski
 
College 1. Online Marketing
College 1. Online Marketing College 1. Online Marketing
College 1. Online Marketing Lotte Bouhuijzen
 
Ciutat nuria marin
Ciutat nuria marinCiutat nuria marin
Ciutat nuria marinIrene Tell
 
Comercio ElectróNico (Unidad 1)
Comercio ElectróNico (Unidad 1)Comercio ElectróNico (Unidad 1)
Comercio ElectróNico (Unidad 1)tunegocioweb
 
Golf Mallorca
Golf MallorcaGolf Mallorca
Golf MallorcaXisco Amer
 

Recomendados

Living the Dream: Make the Video Game You’ve Always Wanted and Get Paid For It!
Living the Dream: Make the Video Game You’ve Always Wanted and Get Paid For It!Living the Dream: Make the Video Game You’ve Always Wanted and Get Paid For It!
Living the Dream: Make the Video Game You’ve Always Wanted and Get Paid For It!David Isbitski
 
Lap Around Azure Build Updates
Lap Around Azure Build UpdatesLap Around Azure Build Updates
Lap Around Azure Build UpdatesDavid Isbitski
 
Building Windows 8 Metro Style casual games using HTML5 and JavaScript
Building Windows 8 Metro Style casual games using HTML5 and JavaScriptBuilding Windows 8 Metro Style casual games using HTML5 and JavaScript
Building Windows 8 Metro Style casual games using HTML5 and JavaScriptDavid Isbitski
 
Azure Mobile Services for iOS
Azure Mobile Services for iOSAzure Mobile Services for iOS
Azure Mobile Services for iOSDavid Isbitski
 
College 1. Online Marketing
College 1. Online Marketing College 1. Online Marketing
College 1. Online Marketing Lotte Bouhuijzen
 
Ciutat nuria marin
Ciutat nuria marinCiutat nuria marin
Ciutat nuria marinIrene Tell
 
Comercio ElectróNico (Unidad 1)
Comercio ElectróNico (Unidad 1)Comercio ElectróNico (Unidad 1)
Comercio ElectróNico (Unidad 1)tunegocioweb
 
Golf Mallorca
Golf MallorcaGolf Mallorca
Golf MallorcaXisco Amer
 
Screencast dave dev-introtoask-andecho-july2015
Screencast dave dev-introtoask-andecho-july2015Screencast dave dev-introtoask-andecho-july2015
Screencast dave dev-introtoask-andecho-july2015David Isbitski
 
Hosting a WordPress Blog on Azure Websites
Hosting a WordPress Blog on Azure WebsitesHosting a WordPress Blog on Azure Websites
Hosting a WordPress Blog on Azure WebsitesDavid Isbitski
 
Building Apps for the new Windows Store
Building Apps for the new Windows Store Building Apps for the new Windows Store
Building Apps for the new Windows Store David Isbitski
 
Windows Phone 8 Sensors
Windows Phone 8 SensorsWindows Phone 8 Sensors
Windows Phone 8 SensorsDavid Isbitski
 
More Than An App
More Than An AppMore Than An App
More Than An AppDavid Isbitski
 
Designing for Windows Phone 8
Designing for Windows Phone 8Designing for Windows Phone 8
Designing for Windows Phone 8David Isbitski
 
A Developer Lap Around Windows Phone 8
A Developer Lap Around Windows Phone 8 A Developer Lap Around Windows Phone 8
A Developer Lap Around Windows Phone 8 David Isbitski
 
Windows Azure Mobile Services
Windows Azure Mobile ServicesWindows Azure Mobile Services
Windows Azure Mobile ServicesDavid Isbitski
 
Windows Store Apps with HTML and JavaScript
Windows Store Apps with HTML and JavaScriptWindows Store Apps with HTML and JavaScript
Windows Store Apps with HTML and JavaScriptDavid Isbitski
 
Designing a Windows Store App
Designing a Windows Store AppDesigning a Windows Store App
Designing a Windows Store AppDavid Isbitski
 
Playing music and sound effects in a windows 8 metro style app using html5 an...
Playing music and sound effects in a windows 8 metro style app using html5 an...Playing music and sound effects in a windows 8 metro style app using html5 an...
Playing music and sound effects in a windows 8 metro style app using html5 an...David Isbitski
 
Windows Phone App Development
Windows Phone App DevelopmentWindows Phone App Development
Windows Phone App DevelopmentDavid Isbitski
 
HTML5 Graphics - Canvas and SVG
HTML5 Graphics - Canvas and SVGHTML5 Graphics - Canvas and SVG
HTML5 Graphics - Canvas and SVGDavid Isbitski
 
HTML5 Gaming
HTML5 GamingHTML5 Gaming
HTML5 GamingDavid Isbitski
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024Lonnie McRorey
 
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DayH2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DaySri Ambati
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionDilum Bandara
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .Alan Dix
 

Mais conteúdo relacionado

Mais de David Isbitski

Screencast dave dev-introtoask-andecho-july2015
Screencast dave dev-introtoask-andecho-july2015Screencast dave dev-introtoask-andecho-july2015
Screencast dave dev-introtoask-andecho-july2015David Isbitski
 
Hosting a WordPress Blog on Azure Websites
Hosting a WordPress Blog on Azure WebsitesHosting a WordPress Blog on Azure Websites
Hosting a WordPress Blog on Azure WebsitesDavid Isbitski
 
Building Apps for the new Windows Store
Building Apps for the new Windows Store Building Apps for the new Windows Store
Building Apps for the new Windows Store David Isbitski
 
Windows Phone 8 Sensors
Windows Phone 8 SensorsWindows Phone 8 Sensors
Windows Phone 8 SensorsDavid Isbitski
 
Designing for Windows Phone 8
Designing for Windows Phone 8Designing for Windows Phone 8
Designing for Windows Phone 8David Isbitski
 
A Developer Lap Around Windows Phone 8
A Developer Lap Around Windows Phone 8 A Developer Lap Around Windows Phone 8
A Developer Lap Around Windows Phone 8 David Isbitski
 
Windows Azure Mobile Services
Windows Azure Mobile ServicesWindows Azure Mobile Services
Windows Azure Mobile ServicesDavid Isbitski
 
Windows Store Apps with HTML and JavaScript
Windows Store Apps with HTML and JavaScriptWindows Store Apps with HTML and JavaScript
Windows Store Apps with HTML and JavaScriptDavid Isbitski
 
Designing a Windows Store App
Designing a Windows Store AppDesigning a Windows Store App
Designing a Windows Store AppDavid Isbitski
 
Playing music and sound effects in a windows 8 metro style app using html5 an...
Playing music and sound effects in a windows 8 metro style app using html5 an...Playing music and sound effects in a windows 8 metro style app using html5 an...
Playing music and sound effects in a windows 8 metro style app using html5 an...David Isbitski
 
Windows Phone App Development
Windows Phone App DevelopmentWindows Phone App Development
Windows Phone App DevelopmentDavid Isbitski
 
HTML5 Graphics - Canvas and SVG
HTML5 Graphics - Canvas and SVGHTML5 Graphics - Canvas and SVG
HTML5 Graphics - Canvas and SVGDavid Isbitski
 

Mais de David Isbitski (14)

Screencast dave dev-introtoask-andecho-july2015
Screencast dave dev-introtoask-andecho-july2015Screencast dave dev-introtoask-andecho-july2015
Screencast dave dev-introtoask-andecho-july2015
 
Hosting a WordPress Blog on Azure Websites
Hosting a WordPress Blog on Azure WebsitesHosting a WordPress Blog on Azure Websites
Hosting a WordPress Blog on Azure Websites
 
Building Apps for the new Windows Store
Building Apps for the new Windows Store Building Apps for the new Windows Store
Building Apps for the new Windows Store
 
Windows Phone 8 Sensors
Windows Phone 8 SensorsWindows Phone 8 Sensors
Windows Phone 8 Sensors
 
More Than An App
More Than An AppMore Than An App
More Than An App
 
Designing for Windows Phone 8
Designing for Windows Phone 8Designing for Windows Phone 8
Designing for Windows Phone 8
 
A Developer Lap Around Windows Phone 8
A Developer Lap Around Windows Phone 8 A Developer Lap Around Windows Phone 8
A Developer Lap Around Windows Phone 8
 
Windows Azure Mobile Services
Windows Azure Mobile ServicesWindows Azure Mobile Services
Windows Azure Mobile Services
 
Windows Store Apps with HTML and JavaScript
Windows Store Apps with HTML and JavaScriptWindows Store Apps with HTML and JavaScript
Windows Store Apps with HTML and JavaScript
 
Designing a Windows Store App
Designing a Windows Store AppDesigning a Windows Store App
Designing a Windows Store App
 
Playing music and sound effects in a windows 8 metro style app using html5 an...
Playing music and sound effects in a windows 8 metro style app using html5 an...Playing music and sound effects in a windows 8 metro style app using html5 an...
Playing music and sound effects in a windows 8 metro style app using html5 an...
 
Windows Phone App Development
Windows Phone App DevelopmentWindows Phone App Development
Windows Phone App Development
 
HTML5 Graphics - Canvas and SVG
HTML5 Graphics - Canvas and SVGHTML5 Graphics - Canvas and SVG
HTML5 Graphics - Canvas and SVG
 
HTML5 Gaming
HTML5 GamingHTML5 Gaming
HTML5 Gaming
 

Último

Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024Lonnie McRorey
 
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DayH2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DaySri Ambati
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionDilum Bandara
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .Alan Dix
 
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.Curtis Poe
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteDianaGray10
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024Stephanie Beckett
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfRankYa
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsMiki Katsuragi
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr BaganFwdays
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii SoldatenkoFwdays
 

Último (20)

Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
 
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DayH2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An Introduction
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .
 
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test Suite
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdf
 
DMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special EditionDMCC Future of Trade Web3 - Special Edition
DMCC Future of Trade Web3 - Special Edition
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering Tips
 
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko
 

Adding an application bar to metro style app using html and java script

  • 1.
  • 2.
  • 3. Step 1: Adding the AppBar to the DOM Default.html Step 2: Declaring the Appbar and Commands WinJS.UI.AppBar and WinJS.UI.AppBarCommand Step 3 : Handling the events Click Events