[Powered by Google Translate] [研讨会 - Windows 8的 - 程序/游戏开发与HTML5] [克里斯·鲍文，埃德温Guarin - 哈佛大学] [这是CS50。 - CS50.TV] 嘿，大家好。我的名字叫埃德温Guarin。这是克里斯·鲍文。我让他介绍自己在一秒钟。我只想做一个快速的公告。首先，你CS50学生获得Windows 8是免费的。因此，如果你想真正使用它为您的最终项目，它是你的了。内特将发出以后的电子邮件中的说明。第二件事是，如果你决定写一个Windows 8的应用程序为您的CS50最终项目，我们将做一些赠品：一个Xbox，我们也许可以给一个石板走，这样的东西。所以，如果有什么事，你回来，让克里斯和我知道我们如何能够帮助您建立的东西真的很酷。所以，再次感谢今天到来，我会交给克里斯。谢谢你，埃德温。谢谢，大家好，今天参加我们的。我是克里斯·鲍文。我是爱德温的同事在这里的东北部之一。我只是想花一点时间跟你说起如何使Windows应用商店的应用程序使用HTML5，JavaScript和CSS 和那种让你可以有任何关于它的问题的解答对您因为你正在寻找走向想着也许使用它的一个CS50总决赛的机会。这就是说，我们只潜水权利英寸我会去到幻灯片在这里。如果您有任何问题，请随时给我发电子邮件。我cbowen@microsoft.com，而且有我的博客和我的Twitter。但是你想获得与我联系，这很好。我已经得到了有关的东西一个小时，我希望得到您的问题在前进的道路上，所以不要羞于在这个有问题。他们看不到谁的要求对记录的问题，所以，你想你会为匿名。让我潜水权，只是给你一个快速的介绍了Windows 8，并告诉你一些的东西有关，你可能会考虑使用Windows Store应用程序当你正在考虑开发一个应用程序。我们正在寻找在Windows 8中。我们已经出了几个星期了。很多强大的采用已经在那里的。你可能已经看到了表面的机器，我们也一样。有一个在这里其实你可以看看，如果你在这里的人。我真的想和你谈谈，告诉你身边有关Windows 8一点点。与Windows 8的想法，它确实提出你所知道的关于Windows的东西到一些新的经验 - 尤其是，事情像表面的机器上，带触摸，这些种，现在市场上有更多的移动设备，但它也是Windows为核心。因此，这意味着你可以在运行Windows 7的任何真正安装它，从你最大的三重SLI游戏平台到你的笔记本电脑和你崭新的其他设备，你可能今天接了。他们将运行Windows 8的。我会告诉你身边的只是一点点，和所有的经验，你会在这里看到的东西，你可以创建。我们的想法是无论是触摸，鼠标，键盘，不管使用什么设备是你运行你的应用程序时，它会运行很好。 Windows 8将帮助所有那些场景。这些幻灯片放在一边，让我们得到正确的进入考虑看看在这里。让我告诉你我身边的主屏幕。这是我的开始屏幕。我就在这里给你一个旅游的一点点。我是一个非接触的机器上，所以像我想摸摸我的笔记本电脑的屏幕，它不会做的事情，所以我就在这里左右滚动一点点告诉你。有些事情你可能会注意到的一个事实，即这些所谓的砖直播其实可以制作动画，并且可以提供信息给你 - 对统计数据可能更新一个游戏或者告诉你一些早期的应用程序，在这里的左侧的消息。我们走吧。我敢肯定，这是唯一积极的，充满了想象的好消息。你可以在这里看到它的真正呼唤你的注意力转移到应用程序，他说， “嘿，有一些新的东西在这里。看看。回来，看看有什么新的给你。” 这就是所谓的动态磁贴，你可以做的通知无论是从应用程序本身的权利或者，如果你看看更详细，您将了解如何编写一个远程服务实际上可以推动信息瓷砖，这就是所发生的事情与这些新闻应用程序。他们实际上得到从云的新闻和更新的瓷砖就在那里让人们知道有一个理由去打开应用程序，看一看在任何最新的消息是在任何这些或者，如果有新的配方或新的高比分击败或在这些应用中的朋友玩或什么的。它的东西来吸引你。互动所以这是活的瓷砖，它可能是一个人，也可能是一个网站也是如此。通常它是一个应用程序。几乎所有的这些事情，我这里有来自Windows应用商店。我会发动的。这是你得到默认的应用程序之一这是运行Windows 8的任何机器上。您可以来这里找到任何你想要，从被突出显示，我以前从未见过的游戏的东西。哦，哇，我们已经有了一个新的弹球这里。你可以从商店就在这里安装这些，我们将讨论如何开发这些。你有很多选择的你如何创建它们。我们将聚焦于JavaScript的故事，HTML和CSS，但对用户，对应用程序的购买者，也无所谓什么它编写的。他们可以继续使用它。我被这个很感兴趣，所以我需要打开这个起来看一看。每一个应用程序，包括那些你可以提交和销售或免费赠送的，不管你想要做的店，会得到这样一个主页。你可以提交你的申请一堆屏幕截图 - 你在这里看到一些 - 有关应用程序的详细信息，并随着时间的推移你会积累两项评级 - 他们基本上只是星级 - 和评论，它提供了多一点点的洞察力。其实，有人要输入的东西，告诉你，你是如何真棒，并且，将进入您的评论部分在这里，我没有看过。太棒了。 “甚至不会开。”多么伟大。嗯，对他们来说，这的确打开并运行的乡亲，他们似乎真的很喜欢它。 [笑] 请记住这一点。互联网。任何人都可以说，他们想了解你的应用程序是什么。所以一定要确保你正在做它一个伟大的工作，确保你正在做它舒适的用户，你可以因为他们是一对夫妇的点击即可获得提供了一个回顾，并且，将累积到您的全面审查评价。并且要做到最好，因为你将要对抗其他应用程序。将有数以千计的应用程序已经在店里，和机会，可能有一些做类似的功能，你在做什么。所以，如果你真的可以在人群中脱颖而出，那将是你的优势，当然。我们会得到进店一点点以后。我真的希望把重点放在创建应用程序。但短版店是世界性分布，它会自动的Windows 8中的一部分，人们刚刚火起来，一起来看看各种应用程序在这里，你的装扮贴纸书和各种不同的应用程序。新鲜油漆，我用这个有很多 - 很差，但我用了很多。它向我展示我已经拥有它。让我告诉你一些我没有 - UVideos我没有为全新的。你在这里看到它是免费的，所以你可以从商店正确安装。你有选择了。你当然可以把它送人。你可以把广告中的应用程序或游戏。您也可以为它充电，你可以很容易地提供试用的应用，以及这样你就可以让乡亲们尝试了一个星期或任何你想做的事情。这只是通过定制门户。你不写任何代码的。所以你说，“你可以用这个一个星期，然后你就必须买它。” 或者你可以不喜欢，“事情你可以打第3级这个游戏 “然后你就必须购买才能访问的休息。” 你甚至可以做应用内购买为好，这样你就可以说， “我们已经有了更多的冒险或套被解锁图形或东西 - “更多的菜谱被解锁 - 如果你购买这些扩展集” 你可以做所有的内部应用程序或游戏本身。所以，完全取决于你，你的选择。有很多东西，你可以在店里做，然后基本上你要提交到一个认证通道。我们可以讨论所有关于那个有点稍后，但这是我们的目标。你想要得到你的应用程序的全球知名度在这里店。回到这里开始屏幕上，我想告诉你身边多一点点。如果我启动这些应用程序，让我给你一些跨应用程序的功能的例子在这里。为了做到这一点，我会推出新的油漆。有一件事你会在这里看到的是屏幕的每一个位，屏幕上的所有像素，去你的应用程序。飘在那里你必须围绕这些窗口边框的日子有很多的按钮，总是有占用空间所有的时间。现在，你真的想摆脱这一点，只需要你的内容是重点。我们可以通过访问其他类型的菜单做的事情与Windows。其中之一是实际上什么所谓的魅力吧，和它出来从屏幕的一侧。您可以从侧面实际上轻弹，如果你有一个触摸屏，你可以右键点击，如果你有一只老鼠，有一个键盘快捷键吧，总是有做一下这里的环境不止一种方法。这带来了一些东西，你可以做。最明显的是你可以回到开始屏幕，但其余4个均为所谓的魅力。他们是合同，你可以插入作为一个应用程序开发人员。他们很酷。搜索，我敢肯定，这东西你打算怎么办，分享我会告诉你在第二，与设备和设置，这些都是所有的东西，你的应用程序可以插入利用Windows中，说，“我已经做了我的一部分 “我希望Windows支持一些其他的功能， “我不想写大量的代码来实现这一目标。” 这是真正使用这些功能的好处。让我告诉你一个。为了做到这一点，我会成为一个新的绘画。我也谈到了使用的每一个像素为您的应用程序。默认情况下，这是什么样的油漆应用程序的外观，当你使用它等等。这真的只是无论你画，你的内容。我可以在这里做可怕的事情。我应该怎么画？我不知道。涂鸦？哦，太棒了。我可以做的涂鸦。太棒了。火鸡？ [笑] 这是最抽象的火鸡，你会看到。我还可以带出什么所谓的应用栏，这是真的，你可以使用密钥的方法之一隐藏了所有可能一直在你的应用程序或游戏之前的东西只是占用空间，所有的时间。所以，现在你可以把它放在这里，这真的是更美丽的经历之一与我见过的应用栏。把选择这里选择不同的颜色。我们想要一个火鸡，所以我们会把一些棕色这里，开始在一对夫妇的色彩混合。我们将采取一个中间色在这里，然后回到这里。您可以开始绘制。还有你的火鸡。太棒了。我不能画首先，而是要在观众面前触摸板做的更好。这是真棒。这个想法，不过，是我关心的是在这里表面上的一切。比方说，我很满意这一点，我不得不与别人分享。通常你会与其他版本的Windows做，你也许会采取一个屏幕快照，你会做你的文字部分复制粘贴或者您要分享出来这样的事情，然后去打开另一个应用程序，并把它变成它。在这里，你不必这样做。实际上，你可以衬托出迷人的酒吧，说：“我想分享这个。” 在这一点上它会告诉你所有的应用程序知道如何与任何被共享的工作。在这种情况下，它是一幅画，那么它会说，“我看你已经有了一张照片。” “你想分享一下？”你可以看到我发电子邮件给自己的东西所有的时间。它承认，它的递给我，作为一个快捷方式，但它也给我看每一个应用程序，它知道如何处理拍摄图片并做一些与它。这些都表明到Windows，他们能做到这一点。在这一点上，这是Windows操作系统。用户只需选择他们想要做什么。我会尽我平时PuzzleTouch的。你可以看到我已经创建了各种谜题随着时间的推移。我要PuzzleTouch说，“我想和PuzzleTouch分享这个惊人的创造。” 它会继续前进，说：“太好了。你想分享这个？神奇。” “你想使一个难题，很容易，中间，不管？” 我会做一个中间位置。它使这一难题。这将是一个可怕的谜，因为它主要是空白。但它已经准备好，它实际上早在其他应用程序。如果我来到这里，我可以搜索并启动它。现在，如果我们翻阅了一点点在这里一点，我们应该看到我的创作的地方。我上哪儿去？我都做了什么样的难题？难道我可以很容易？哦，还有这是，就在那里。 [笑]这是容易辨认的火鸡难题，在这里。不过，我想向你指出的东西，这里的很酷的事情是应用程序不知道对方什么。他们只说，“我有一个图片分享，我知道如何处理的图片。” 而你作为一个开发者，你不必编写代码。当有人问我分享，我要去把一些数据到这个小的数据结构和我完成了。其他的应用程序接管，做它的事，这就是共享经验的结束。这只是一件事，你可以做的 - 真的，真的很强大 - 而这将是其中的一件事情，可以真正帮助区分你的应用程序还你的游戏太在店里。人们将能够说，“这是非常有用的。” “我用这个谜题创作者所有的时间。这是梦幻般的。” 这大约够这是怎么回事上进行简要回顾。有一对夫妇的其他功能太，也许我们将重点为我们经历的代码。但我想潜入幻灯片，要做到这一点，我要去桌面，这本身就是在这里另一个动态磁贴。我可以去到这个，果然，我在我的幻灯片，但让我告诉你其实我们在哪里。我们实际上是在桌面模式。这确实是在那里我之前说有关Windows弘扬新的经验表明本身。这是你知道的Windows。 Windows应用程序被称为桌面应用程序。它们运行在这里。如果您有现有的应用程序，你想在Windows 8上运行它们，你完全可以做到这一点。这些都是不一样的东西作为存储应用程序，这是在这里，喜欢新鲜的油漆和这些NBC新闻的应用程序之类的东西。那些将来自实体店。它们可以插入一些，我是您展示的功能和其他人，我还没有表现出你只是还没有。但是，仅仅记住这一点。我们对这些事情都支持。对不起。什么是不显示在屏幕上？我已经完全失去了它。这是奇怪的。好吧。感谢您指出了这一点。你还没有看到有一段是我显示你的桌面就在这里。什么是你看到的最后一件事？你看到了吗？这是桌面。你已经知道它是什么样子。没什么可怕的不寻常。这是我们进行了经验推进对你和让你使用，你有过的事情。例如，我会向您展示的Visual Studio。这是一个桌面应用程序。它会在此模式下运行。这将支持更复杂的环境有很多的选择之类的东西，所以它使一个很好的选择作为一个桌面应用程序。这就是说，让我们去幻灯片只是一点点并给你一些介绍的内容，然后进入实际编码在这里。好消息是我听说你一直专注于大量的CSS和JavaScript，HTML的。所有这些事情，你一直在直接学习进位使Windows Store应用程序。你已经听到与应用CSS选择器和所有这些事情的事情正是你在这里创建的商店的应用程序。我们将通过位经历这些事情位。基本上，我建立的，你已经花时间去学习的东西。这是你可以使用的技术整体图使为Windows 8的应用程序。在右边的桌面应用程序，东东真的是我们已经知道的。这东西，真的是Windows 7的世界结转到Windows 8。所有这些选项发扬：C＃，VB，Win32的一种发展。大。没问题。新的东西是在左手边。这是Windows应用商店的应用程序，这时候我想要得到我的应用程序连接到Windows 8 使用所有这些功能，让它进店，并获得真正爽体验的Windows应用商店的应用程序。要做到这一点，你可以在这里看到你已经得到了所有你的选择使用XAML，C + +， C＃，VB，你可以做的DirectX，这样的事情，事情是超越的幻灯片。但对我们来说，我们要正确的专注于一个事实，即HTML，CSS和JavaScript 是一个真正的一等公民作出的Windows 8应用程序和Windows应用商店。因此，这是对大家都有好处这里的乡亲观看视频因为你可以利用所有这些，你有经验真正扎到什么Windows提供。你要做的是通过一组API，它应该是毫不奇怪。每个操作系统都有自己的API。我们揭露Windows可以通过什么所谓的WinRT做什么。这是一组API，只是没有你的一切。如果你需要打开的文件，则需要使用相机，地理定位，这样的事情，他们经过哪些Windows可以提供给你。要访问，我们有一些更多的JavaScript那将使其更容易为你做到这一点。我们会得到，在一个时刻。但现在，这是基本的路线图。你已经在做的一些API之上的东西这种帮助您使用的Windows等于存储应用程序。而这的的确确是所有你必须知道，从较高的水平。我们将深入到实际工作与现在的东西。你可能已经看到了一堆的东西，与IE9的一小会儿回我们介绍了很多的支持，在当时，在Web新标准，所以很多新的CSS特性，很多新的HTML，ECMAScript 5标准，这实在是JavaScript的。所以一切的，除了严格模式是在IE9。只是一个用CSS吨的东西，CSS3，都在那里呢。而这一切的东西发扬到我们正在做的与Windows 8。您可以使用这些东西，你可以用一切的新的IE10。随着我们的IE10引入所有这些事情支持。他们所有的硬件加速，所以如果你的机器上有某种的GPU上，这可能是几乎每一台机器，你可以得到在过去的8年中，你要能够有硬件加速的输出，用CSS可视化输出，画布，SVG。所有的这些事情将通过硬件加速并且是，更快，更高效。短版所有这一切 - 我可不是要经过每一个东西在这里 - 如果你看到这个名单上的，如果你能在IE10做到这一点，如果它是你正在运行的Web应用程序，在IE10的作品，它的东西，你可以做一个Windows应用商店的应用程序。而这几乎是它。所以，如果它工作在IE10，它将会作为一个Windows应用商店的应用程序。这是在桌子上的东西，你可以使用。有很多在这里。我们没有到午夜，所以我不能在此回顾的一切。但也有一些网站，这将有助于您了解这些事情可以做，我会告诉你其中的一个在第二。我只是想指出几个，你可能看关键的东西。也许你已经看到了其中的一些在你的研究中，但这些都是非常有帮助，特别是在Windows应用商店的应用程序，从CSS的一面。所以能够做转换和过渡，提供运动与动画 - 这些是CSS的一部分了，而且他们都支持现代浏览器，和IE10和IE9增加了支持随着时间的推移，所有这些东西。所以，为什么你自己写吧，为什么要经过手工做这些事情的所有的麻烦当你可以使用一个简单的CSS变换为应用程序创建一个3D效果？大。这就是它的工作原理。我不能让任何比这更困难。如果你知道如何做到这一点在CSS中，你知道如何做到这一点在Windows应用商店的应用程序。超越，对于布局，之类的东西，甚至商店的应用程序，但超出这个限度，看着也许是新闻的应用程序，是显示您的文章或配方或类似的东西，这些其他类型的功能在CSS中是非常有用的：网格，Flexbox，CSS的地区更是一个相当新的标准也是如此。这些东西都是要帮助你制定出的内容和流量之间的部分内容，能够做到分页和断字，不用您亲自编写的东西。你刚才说，“请执行以下操作对我来说，” 和屏幕房地产是不同的在不同的机器或者，你会看到在某一时刻，当你捕捉应用程序有在屏幕上少量的空间，这是对CSS没有问题。它可以利用的优势 - 关于第二个媒体查询we'll谈话 - 它可以采取的东西重新定位你的内容照顾，从区域流动内容只是这些东西，你可能已经看到了使用Web技术。在HTML5的一面，也有一堆东西这将是对你非常有帮助的Windows Store应用程序。同样，我们也不会去通过所有这些，但他们只是在这里。所以，如果你需要使用它，音视频，如果你想从形式做验证，地理定位，所有的东西你可以在JavaScript中做的JavaScript 5或5的ECMAScript， IndexedDB本地存储 - 这是给你的所有选项。如果你正在寻找一个答案，只是看对现有技术使用HTML5和CSS 你会发现不必自己推出了很多的东西更容易的答案。让我告诉你在这里一点点。我有一个网站，我们可以去。让我放弃了这个幻灯片的一秒钟。如果我们出去IETestDrive.com，我不会做太多这里演示的。 IETestDrive.com真的向您展示了很多什么新与IE10，的事情，你可以做。这是我找到的，因为不是通过一串白皮书读书真正有用的，看几个演示，这会帮助你把它放在自己的个人雷达有关技术是否有意义，甚至做任何更多的研究，所以你就会明白，“我看这是什么。” “我明白请求帧动画不适合我。” “我明白我怎么可以使用的地区或SVG过滤器。” 你看到他们在行动中，看到他们一个例子，并决定为自己，如果这就是要在自己的项目和以后对您有用如您继续使用Web技术工作。在这里，我只想鼓励你去看看。我不认为我会花很多时间实际运行这些。我们有足够的与编写代码来显示。你会在这里看到的东西从触摸效果在该条中，触摸为基础的游戏，动画，非常快的硬件加速动画那里，一些优化，你会在其中一些样本看为好，并有许多，许多。如果你走在这里，开辟了站点地图，这里还有一个荒谬的样本数在这里。你可以看到他们都在这里。如果你正在寻找的东西或者你听说过的东西你想知道，也许这将是很酷的东西在应用程序使用，尝试寻找在这里，有可能是一个不错的演示它来保存自己一些时间。好吗？如有任何疑问，到目前为止在这里的乡亲？好吧。我们将继续在这里。同样，刚刚检查出来。它们是Web标准，所以去你知道的任何其他网站展示看看这些技术让你感觉想要做什么。回到幻灯片。这就是说，您是从网络世界转移到真正的本地安装的应用程序的世界里，所以有一些东西在这里指出。首先，这里还涉及到任何Web服务器。有没有Apache的，没有IIS运行在这里煮好页到远程客户端，在远程浏览器代理。在这种情况下，真的一切都打包给你。您提交您的应用程序商店，它得到认证，它是在商店，然后人数以千计会安装游戏或应用程序。但基本上，他们拉下来在本地自己的机器。有没有必要走出去到Web了，除非你有需要的远程API调用，那是完全正常的也很好。但他们不会是在该模式下，他们必须从一台服务器去请求响应得到其内容的下一个页面。所以这么说，有一些小的API的差别。这是令人难以置信的未成年人。他们不会打你你的正常编码，但他们至少记录。那种他们边缘情况有。值得一提的另一件事是信任的差异。我只提到这一点，因为我只是想确保我说的因此，如果你碰上它以后，你会想，“克里斯说了一些关于这一点， “所以也许，是啊，没关系，”然后你回去，你会发现它是什么。上下文关系。默认情况下，我们尽量保护用户免受攻击向量。有一些东西，你可以在默认情况下做和一些事情你需要改变上下文，使。由于您使用的是一些图书馆在那里 - you've已经工作与jQuery，但如果你看看其他的库在那里 - 你可能会使用一些功能那种超越本地使用，并更具活力的互动 XHR请求，这样的事情。有时候，你可能会发现那些将默认被禁用，而在这种情况下，只是做一个搜索，查找本地和网络方面，你会发现如何解决这个问题。只要确保你知道，当你开始使用其他框架，其中，我应该提到，你完全能够做到的。所以，如果你能找到一些其他的框架 - 这在第二we'll谈话 - 为游戏和你要使用，要使用一些控制库是在那里而你不想自己写的东西 - 这是一个好主意，对吧？ - 你完全可以用这个东西。没有什么阻止你使用的基于JavaScript的任何类库回来， CSS，HTML5。再次，如果它的东西，你可以在IE10，这是很多赫克这几天做的，你可以做到这一点。它拉进你的应用程序，引用JavaScript库，并用它在你的应用程序，只是记住你可能会在一段时间打了一个安全上下文一次 - 不是很经常。然后在功能，我们就去了一些更多的那些，因为我们去。有种你会习惯的，你看到越来越多的应用UX 从Windows应用商店。你感受一下它们是如何工作以及如何设计美学往往工作在不同的应用程序和什么人会被用来体验。这是真正的重要组成部分。确保当他们启动你的应用程序，他们并不需要阅读一本手册，他们永远不会做，顺便说一句。他们应该能够开始与您的应用程序打并认定它没有太大的困难。通过坚持，坚持了很多这些做法，你会做你的用户一个大忙，使那更容易。好吧。在API的侧最后一件事，然后我们将进入实际编写代码。的WinJS是我的事与复溜提到很简单与你有制作应用程序的所有这些不同的选择。的WinJS，你可以把它作为一个哥们。这是你的朋友帮你更快地写东西。它只是JavaScript和CSS。您不必使用它。你可以使用它。如果你将要调用到Windows的功能，你最终会使用它，但如果有像一些设计模式或控制的事情，你真的不想用，你想用别的东西，它给你。决定要使用什么和要使用的样式。从命名空间和类生成的特征 - 由你决定。如果你喜欢一个或另一个，这是完全由你决定。它仍然是JavaScript和CSS。但是，它会帮你做了很多的东西。例如，这里有什么可以做的一个子集，事情，比如帮助异步编程与承诺。任你听说过或使用Node.js的工作？这是一个具有异步编程工作，常见的模式。所以基本上你说的是，“去做些什么， “和你要给我当你做，你会回到我的承诺。” 这是本质发生了什么事情。这样你就不会冻结您的应用程序，而用户是怎么回事，并选择一个文件什么正在从Web流下来。用户界面保持响应。你可以做，通过使用异步编程。这听起来很可笑复杂，但它真的很容易，因为你使用的承诺而你只说，“去做到这一点，当你做，回调到这个方法。” 这几乎是它。这是所有内置到的WinJS。这将使它更容易写出真正灵活和强大的应用程序。你可以看到这里的休息，很多动画。可能是这张幻灯片上，更重要的事情之一是控制。我觉得我有一个整体 - 是啊，我做的。这里只是一些你可以在你的应用程序中使用控件的一个例子。这是所有垂直向上从的WinJS。你是不是写这些呀，你刚才说，“这是我要如何撰写我的申请。” “我将使用一个翻转视图，这样我可以在不同的画面之间走了。” 我还没有表现出你的语义缩放。我会告诉你，在第二。 ListViews。还有的GridView。你已经看到了一个网格，商店应用程序的一部分，所以能够使用的内容块和整个的滚动。弹出菜单，你会看到不时。应用栏我给你带了新鲜的油漆应用为好，所以你看到了如何自定义，通过把上的按钮并且具有躲避，当你不小心使用。这真的完全取决于你使用。这些是的WinJS的一部分，所有控件。我会告诉你如何在短短一秒钟让这些，但有更多的不仅仅是这一点，而关键是使用他们，如果你想要，节省一些时间。如果您有其他的控件库，你想用，这完全没关系。事情像jQuery UI做了很多的这种想法为好，提供更多的控制，扩展你可以在HTML和JavaScript做什么。让我们开始吧。我已经说过了。使用你喜欢的东西。只要记住，你可能会遇到一些方面的问题。但你一定可以混合和匹配任何一种你舒服库，你想学，你要使用，以节省自己一些时间。让我们来谈谈工具只是一秒钟。你可以得到你需要开始使用Windows Store应用程序的工作。如果我回去了，我有太多的东西在这里。如果你到这个页面，这是dev.windows.com，你可以下载你所需要的一切。作为学生，您有机会获得更多的比一般市民呢，这样你就可以得到Visual Studio中的高端版本。埃德温提到你已经获得Windows以及。但在一般情况下，所有的开发者，你可以去这个网站并下载你需要的应用程序的一切，而且它是免费的。因此，有Visual Studio的免费版本，有一些工具，将一起安装的是 - 你需要创建和测试应用程序的一切。只有当你要发布你的应用商店，你将需要一个开发者账户。这也是我认为是免费的。它是免费的学生呢？ >> [Guarin]哪一个？开发者账号，实际提交。 >> [Guarin]是的。这是更多的好消息。你会去看看这个。它会在默认情况下说个别是为49美元。但是，不要报名，作为一个学生。我们将通过你的程序，你可以得到一个免费帐户给你一些信息，并且，可以让你再递交申请一直到店，多达你喜欢，和所有善良很快就会跟进。所以这是dev.windows.com。您可以下载您可能需要从这里的工具。如果你愿意，你可以让Windows的试用版在这里，但同样，你将不再需要。其他站点 - 让我迅速点这一个你 - 是design.windows.com。这是dev.windows.com。 Design.windows.com，你能猜出它是什么的。它实际上是一个非常友好的网站。有很多很好的信息在这里。你可以通过它的工作。这将让你对一些事情的一些建议也许你有没有想过之前或收到处理，就像设计为触控，设计不同的形式因素，设计为Windows 8的功能，这个事情我前面提到的像搜索和分享，有些事情，我还没有谈过呢。他们都列在这里，这是一个相当不错的一套有用的文件页面这将有助于你了解如何使某一类型的应用程序，如何做互动，如何处理应用程序的UI和UX。我建议你看看这个，特别是如果你在某个时刻希望能够发布应用程序商店。你会想知道如何使一个很好的应用因为我如果不这样做之前提到的，再有就是那些评论。人们会不高兴。他们将不能够找到，他们希望在正确的地方的东西。没有人希望这样的事情发生到你。展望未来在这里，让我收了下来。现在，你知道从哪里得到的东西，我会告诉你如何真正开始使用的东西。首先，我居然会在这里告诉你我的开始屏幕上的桌面应用程序的一个例子。在这里，您可以看到Visual Studio中，您可以看到Blend和其他开发工具，我有。它们具有略微不同的瓦片。这是因为它们是桌面应用程序，在这些情况下他们都将要推出回我的桌面真的就像应用程序，你已经习惯了。所以Windows的经验，这是同样的事情。他们都没有，比如说像武装！还是这些东西。让我迅速启动之一。其实，这里有一个有趣的。这是由学生在NERD的通力合作，一起开发的。全屏应用程序，这些类型的经验在这里。哦，好的切屏和各种有趣的东西。他们开发了这个。我们不妨展示了整个事情，而我们在这。其实，我跟他们合作了一点点，给了他们对事物的一些建议因为他们做的JavaScript为他们的应用。拜托，我不是信贷对他们的工作，他们做了所有的工作。我只是给他们建议一点点在这里和那里，但他们通过使用JavaScript的前端做了一些伟大的东西和搭售一些物理引擎和活动作出了很多这项工作。去。让我们看看是否能工程。哇，它仍然工作。好的，好的。但你的想法。一个全屏幕的应用程序，一个很好的经验。这不仅支持我的鼠标和笔，如果我有这样的事情，但也触及。如果我有一个触摸屏，我可以只画到它，并继续与合作。有一件事我没有显示出来，为什么我提出这个问题的原因是我想有另一个应用程序告诉你什么可以做，你其实可以在Windows应用程序，并将其拖动到屏幕的一侧。这就是所谓的捕捉的应用程序。在这种情况下，我已经采取Inkarus，我已经把它添加到这里边。目前它在快照视图，并允许我做其他事，而该应用程序是存在的。大多数游戏中，你会发现只是简单地暂停。这通常是一个体面的事情，除非你的游戏可以在某种程度上缩小该小的分辨率，如可能为某种棋类游戏或者类似的东西有时。但在一般情况下，最容易做的事情，最合适的事情做游戏是暂停的应用程序。对于这样的新闻应用程序的应用程序，如果我启动这一个，然后我捕捉它，你会看到它实际上是在它是如何呈现数据，您显著的变化。在这里，它的真正显示你在一个更垂直平移的信息，但我仍然可以完全使用该应用程序。所以它仍然是非常有用的。事实上，它是在一个较小的视图不阻止我使用该应用程序。所以，想想这一点。那就是你需要有你的应用程序确实在一定程度上的东西，但它是由你来决定你的应用程序的功能如何应在那样的一个小环境。让我关闭了一个下来，并重新回到我们在这里。埃德温，你加我的照片了吗？ >> [Guarin]是啊。 >> [博文]你看那个。看到了吗？埃德温添加了一张照片。 [笑] 让我们回到了这里到Visual Studio中。让我启动这个给你。我可以点击了瓷砖的开始屏幕上。它把我带回进入桌面模式，它的启动Visual Studio的桌面应用程序。这是你已经知道的Windows操作系统。我可以继续在这里创建一个项目。我们将再次专注于JavaScript的HTML。我要出去，并选择在这里下的JavaScript，Windows应用商店。有一些模板，您可以使用。对于生产力，我会建议你看一看其中的一些其他的在这里像网格和拆分。他们是真正有用的，如果你正在做一个应用程序那将会有那种设计和导航。你会看到这些很多。就是我刚才给你看的竟是电网应用程序的实例。所以，如果你认为你将要制作的新闻应用程序或RSS阅读器或类似的东西，随着对你想显示的细节多个项目交易，考虑使用这些模板之一快速上手并从那里定制它。但是，仅仅这样我就可以告诉你所有的运动部件在这里我要创建空白的应用程序，然后我们会去一点点深入到细节。我只是做了空白的应用在这里。它会为我创造了整个计划。我打开了，我想在默认情况下，显示你的东西。让我拉近一点点告诉你什么是对我们在这里创建。那你要看看第一的东西，都命名为默认值。所以，你要寻找的default.html，Default.js中，并且是default.css。另外要指出的是，我们已经有一个参考一下我之前提到的。这是的WinJS。居然没有人在这里称之为这个长名。它的WinJS，在Windows JavaScript库。如果你打开它，你可以看到这一切都在这里。有不同的CSS文件，还有JavaScript的。它的存在为您排忧解难。这真是有提供控件和样式之类的东西，你可以只使用自动。但同样，如果有您想要使用，而不是在造型和其他控制方面的东西，这完全取决于你。我会告诉你如何使用一对夫妇的那些东西现在。回过到我们的左边，让我告诉你默认的HTML页面。你已经看到了的WinJS的东西，那就是真的那么回事有与中间线的标记，只是把在CSS默认并把一对夫妇从的WinJS JavaScript文件。你并不需要是主什么的那些文件里面去的。这是非常有趣的，看看他们那种检讨什么的在那里怎么回事因为有相当有趣的中级和高级的技术在那里怎么回事，但好处是，作为开发者，你可以利用它们，只是用它们而不是真的要担心。您仍然可以驾驶汽车，而不必知道它是如何工作的，对不对？所以这是什么样的东西是怎么回事。有控件和样式之类的东西，你可以干脆去和使用并且，你可以在第二个使用而无需知道什么是在那里的代码。这里有自己的文件。这些都是你的地方，你可以修改自己的CSS 和你自己的Java Script才能把事情滚动。您将添加一定的其他JavaScript文件，也许还有其他的CSS文件作为项目的增长，但是这是真的只是一个起点。这里是你好，世界等价的HTML的，所以我们背在身上的标签。在顶部，顺便说一句，这是HTML5的doctype，所以你会认识到，从你一直在工作。有完整的IntelliSense在这里为好，所以如果你在一个视频标签做的事情一样类型并扩大了这一点，你可能已经了解了事实你需要做后援编码视频标签在HTML5中 - 或者也许你有 - 以确保不同的浏览器对视频的支持。我们有这样的事情整个HTML，JavaScript的跨越，跨越的CSS。这是内置的，我会告诉你在第二的CSS。在这里，你可以继续前进，开始修改代码，标记。其实，在我改变什么，我要运行这个，并且告诉你你会得到什么。你会得到一个闪屏，你可以自定义然后你会得到你好，这里世界的经验。这是梦幻般的，对不对？继续前进，船，对吧？内容放在这里。这是基本的东西。它只能从那里更好。我们将继续前进，在添加一些东西。我有标记的，我要在这里复制一点点只是让你不必看我打字。让我去调出工具箱在这里，我将针这一点，因为我会做这几次。工具箱，如果你还没有看到Visual Studio中，在这里你会找到一大堆的控件。你也可以把代码片段到它，你可以重复使用。在这里，我将只流行在一些其它的HTML，没什么可怕的先进都在这里。这只是基本的HTML，说我有一个输入，我可以打字，我有一个按钮，我可以提交它，然后我有一个div那本质上是一个占位符我可以用它来输出“你好，你输入这个。” 这是介绍到HTML示例。如果我运行这个，我们自动获取的HTML，但我们也自动获得的造型。这是从的WinJS重要的事情之一。它会给你默认了一些外观和感觉，真的是一致的与什么的Windows 8正在做休息。在这里，你看到的东西，如按钮。默认情况下，在HTML中的按钮不会像她那样，但它确实在这里因为它得到了正确的CSS从的WinJS的CSS文件。如果你想使用别的东西，如果你想改变这种状况，完全罚款，继续做你想要什么。但是，这是默认的。这将是更多的为用户所熟悉。这当然不会做任何事情，因为我其实没有线了任何类型的代码响应这一点。这只是在HTML。这样我就可以摆脱这一点，我们会回来到我们的应用程序。让我切换到我们的Default.js中。这看起来很复杂，但它只是在做一些事情给你。它的样板。它会在所有的项目是相同的。这是做的唯一的事情就是那种问，“我怎么会在这里？” 并说，“你发动的第一次这个程序？” “你是从拥有它被挂起恢复应用程序？” 一对夫妇这样的事情。真的，我们的重点就在这里这个文件是对的在这里。在这一点上，这一行代码是非常重要的。它实际上要去，并期待通过您的所有标记，并且它要找到的东西，你已经问到已经变成控制，像一个等级控制，如网格视图，如弹出更深层次的控制而且我以前向您展示了在该幻灯片其他的事情。他们不是原生的HTML控件。你就是不说弹出作为一个元素，并将它知道该怎么做。其实我们做的是，发生在其他类型的控制架构是一样的。 jQuery UI的做同样的一种通用方法。你在你的HTML中使用的标记，然后一些JavaScript来通过后，说： “哦，我知道那是什么，这就是要求这变成这个东西，” 这是其他更具表现力的HTML做出像一个分级控制，这是我会告诉你现在。这行代码是一种承诺，是在说：“当这一承诺被兑现， “一切，你已经问了，然后被建立。” 就是这样。它看起来有点复杂，但它确实同在每个项目中。下来在这里你就可以开始在任何其他你想有发生增加，所以我们会回来，在第二。首先，我需要一点，可以这样的事实做出响应的代码已经有人点击了按钮。我要继续前进，把在这儿吧。同样，我不会做任何输入在你面前在这里。非常基本的JavaScript只是说当这被称为我们将提供有关我们如何来到这里的一些细节然后我们要做一些基本的东西。去找的东西在名为nameInput我的HTML页面，抓住它，拿在它前面它的价值，一巴掌“你好”，并坚持认为得到的字符串到该div标签，我们收到了真的没有以前有什么。现在，我们会发现，标记，并使其内含量等于该字符串。很简单的JavaScript。希望你认识到，没什么好说的异常怎么回事。这只是直线上升的HTML和JS在这里。如果我运行这个现在，它仍然不会做任何工作，因为我还没有连接起来接收事件。为了做到这一点，我会的就在这里，再次回到我的工具箱，它突然出现在这里。我希望你已经看到所有这些东西之前，所以我不会过分解释。现在，我们要去拿helloButton。我们会说，“按钮，表示祝贺。” “这里就是你现在所响应的事件。” “当有人点击你调用这个函数时，buttonClickHandler。” 这就是我们刚才添加的底部都有正确的减函数。就是这样。所以，现在我们已经得到了一个令人惊讶的功能应用。我想你会为此而真正打动。克里斯。等待它。哇。好吧。这是惊人的。 [笑] 但是，还有更多。不买它呢。等待。让我在这里更告诉你一点点，并得到了全屏幕。我们要我们走之前运行。让我进去，实际上告诉你用CSS一点点。只是在默认情况下，如果我们回头看看页面在这里，每当我们在这些东西拉到离的WinJS，我们得到的UI暗，事实上，你可以将其更改为默认使用的光的应用。 UI暗是良好的图形应用程序，如使用大量的图片，你表现出了很多视觉内容。如果你表现出了很多的文本内容，用户界面光通常是一个不错的选择。你没有选择它，但我已经切换到了现在你又看到了同样的标记，同样的一切，它只是使用基本上是一个倒置的方案在这里这里的一切正在对白色是黑色文本。这一切都很好。让我离开这里，让我们实际做多一点点的CSS。我把它放回暗，因为我认为它可能更容易在屏幕上看到当我开始做这些事情。我要更换身体一次。我会去这里。让我用核武器炸了。让我们把在体内的类。我相信你已经完成了CSS和类似的事情已经基本选择，所以你大概知道这是怎么回事。只是将部分类来我们的头，我们正在创建一个新的div 来包装这些东西，我们现在可以使用样式一起休息。所以我现在所能做的就是去到我们的默认CSS。你看着媒体查询了吗？你有没有在所有谈过这个问题？媒体查询是这一新兴趋势的一部分 - 或者它是一个既定的趋势现在实际上在网络上 - 为响应设计或适应性，而这个想法是，你的应用程序可以真正适当地调整自己依据是什么，他们正在被显示在该设备可以做到。所以，如果你是一个移动设备上，显然你不会有尽可能多的屏幕房地产因为你将一个大的30寸显示器上坐在同一个桌面，一个大的PC那样。所以老答案将是有5个，6个不同版本的同一页面而且你打开那个被调整为一定尺寸屏幕的版本。不是很大。这是非常，非常反覆，有一吨的维护做到这一点。现在我们有一些所谓的CSS媒体查询，我们可以用它来自动检测，当有一定的大小或者正在执行您的内容拥有一定的使用。所以，你可以回应这一点，你可以说，“好吧，在这种情况下， “你可能甚至不需要我来告诉你这是怎么回事。” 这只是说，如果这个应用程序是啪的一声，就像我以前向您 - 抓住它，并把它在屏幕的一侧 - 然后让我们做下面的造型。造型不只是颜色和类似的东西。这也是关于大小和页边距和填充和内容取向甚至禁用或启用您的网页的整个区域并且，在这种情况下，您的应用程序或游戏，以及。所以在这里，只要你想，你可以做的那么简单。这不会是在你的应用程序非常有用，但它的演示时间，所以我要继续前进，只是添加在身体基本选择，并说， “当我啪的一声，让我们继续做背景色，让我们选择的东西。” 你有智能感知这里。其实，这是真的很酷。在2012年我们已经对CSS的支持和JavaScript和HTML增添了不少的东西。当然，你得下拉智能感知过，但是这不是很酷的事情。最酷的是你已经有了视觉选择的很多事情也是如此。所以，你可以去通过，只是选择一种颜色，或者你可以走出去，更加具体，你可以选择 - 这将是可怕的。我居然挑一个体面的颜色在这里。看标记过，顺便说一句。这就是你的RGB标准格式存在。但是，如果我切换的不透明度，它会切换到这里alpha通道选择器。所以，你可以看到，基本上与您具有该百分比透明的颜色就在那里所有的出炉。我要保持它作为100％，然后当我与我做的，一切都很好。现在，如果我运行的应用程序，我们把应用程序和我们捕捉它，该背景色自动调节只是因为我们有一些CSS，上面写着：“去这样做。” 您也可以编写JavaScript也将做同样的事情或者，你可以用它来居然暂停游戏，做这样的事情。这可能是当你想使用JavaScript。你会关掉游戏循环在这一点上。你需要一些JavaScript，因为那会不会是一些你会CSS的。但请记住，这只是一个事件。你可以说，“当我的应用程序的大小时， “让我们看看如果我们断了。”就是这样。好吗？我已经谈了很多。是否有问题，至今对我们在哪里？是啊。 [学生]有没有教程，任何人都可以得到更多的信息？ >>呀。现在的问题是，是否有教程吗？我只是把它扩展到一切。有几件事情，你可以去。让我们真正离开这里。让我回到了这里。有一点需要指出的是Visual Studio中本身有内置的教程让我摆脱这一点。如果你去创建一个新的项目，做文件，新建项目，并期待在左手边，有一个在这个选择的在线节点。这将需要一点点。我对我的MyFi在这儿。但它要来了，这是怎么回事，给我一个机会，找到模板而且，更重要的是，样品为好。这样我就可以点击的JavaScript。这将样品找到我。我的解决办法是高在这里。通常情况下，你会在这里看到了很多不同的事情的清单。如果有你想尝试，挑选语言的东西，这里的JavaScript，并说，“我不知道该怎么办的地理定位。” “我不知道如何打开一个文件。” “我不知道如何利用网络摄像头的优势 “或优化的触摸或类似的东西。” 有样品的一切：分享，搜索，应用程序栏，实现远程调用一个服务，JSON编码。所有这些类型的东西有样本在这里，他们不是说要带你整夜拉开巨大的样本只是为了找到一件你想学。他们真的很不错。它们很小，切中要害种样品。我已经学到了很多我自己经历这些，所以我建议很多，因为一件事。另一个要指出过，当然是我给你dev.windows.com，因此，如果你回去，你会在底部看到有也是在这里的样本。所以，你可以下载所有这些一次，但也有很多其他的资源在这里也这可以帮助你加快速度。还有一件事，我真的建议你试试这个，我知道了，在我的博客，但我只是去对想。我会告诉你。我的博客有资源之类的东西。其中一件事要指出的是就在这里，这个东西：你的想法。您的应用程序。 30天。如果你点击这个，它会带你到一个真正有用的网站。这比你所期望的更多的帮助。这将是含量30天那你基本上可以得到提示和技巧全因为你正在创建一个应用程序，过程。正如你可能想到，你实际上可以得到它的游戏太和手机应用程序，这样的事情。所以基本上签署了它，他们会向您发送的提示和技巧， “你有没有想过这样做呢？你是否支持快照？” “下面是关于如何做到这一点以及一些指引。” “你有没有想过提交到店里？” “你有没有想过如何你要推销自己的应用程序？” 它会遍历所有这些不同的东西。而实际上，如果你在游戏的轨道，在某些时候你会开始认识你说话的人因为我实际上不得不去Redmint做那些并记录2视频那里。但是，这所有的游戏轨道的一部分，并且还有一个完整的轨道一般的应用程序开发。这就是所谓的新一代APP。我肯定会推荐给你听，除了样品。有很多的视频在一个名为第9频道以及网站。这可能是过去的事情，我会建议，以及之前，我们就搬到这里。 Channel9.msdn.com。这是伟大的，因为你不打算通过吨白皮书进行阅读。它基本上是一个很大的视频，截屏和东西都切中要害。我不应该说这是永远正确的地步。这要看是谁在说话。但是总体来说，有一些真的到了视频点这里会告诉你你可能想了解或看到全世界展示了一些特别的事情。还有我们所有的内容，从我们的发布会上说，几个星期前发生的事情所谓的构建，你会看到在那里。有核心技术为Windows 8的游戏。你去那里。我在那里，其实。你看不到我。我是在这里。不过，无论如何，那一边，我建议你先看看这些影片。他们是相当有帮助的。如果你被卡住的东西或者你只是想看看有什么事情可以做，那些火起来。 [Guarin] Windows Mail的只是给我发了一封电子邮件，链接到内容学生下载示例代码和类似的东西。 >> [博文]大。真棒。谢谢你，埃德温。好。 >> [学生]我有一个问题。 >> [博文]哦。是的，请。 [听不见学生提问] >> [博文]呵呵，我很高兴你问这个。是。现在的问题是，是否有可视化界面为我创造的东西？埃德温将丰厚的奖励你这个问题。有一种方法可以做到这一点。如果我们现在就做？让我们现在就做。我打算去它现在。其实，让我在一件事添加到该演示中，然后我会告诉你实际的答案。我要在多一点的CSS加在这里。我是一个小关的切线在这里。让我把一些CSS这里利用我们增加了一个前一阵的类，到头部，向搜索Maincontent格，然后向greetingOutput。如果我这样做，并运行它，你可以看到现在我们已经有了一点点不同的padding和margins，所以我们实际上有一些偏移这里。这些都是更倾向于你将成为怎样的期望最终抛光应用。但我只是显示这个给你，因为它是直线上升的CSS。这样的事情，你已经知道你可以用这里，你要调整的内容。你已经看到了如何使背景改变了这种方式。如果我回去了，以我们的HTML，我要在一个更集中的标记的添加，这实际上是将是从的WinJS控制。我会去抓住这一点，一个标签。让我确认我在做它在正确的地方。可能不够好。在这里，我只是说 - 和我们一起去全屏幕，以便可以看到整个事情 - 我已经为下一个分区添加一个标签。在div被称为ratingControlDiv。它本身不会做任何事情。如果你打开这个在浏览器中，你会看空，则DIV本身。因为那神秘的线，我才向您的代码，但是，该过程中的所有，它要寻找的东西，看起来像这样 - 数据共赢 - 控制 - 而且它会发现无论是该参数。这将会使之不管它是什么它指向一个实例。在这种情况下，它是一个等级的控制，所以我说，“请去代替这个东西 “与任何你需要做的，使一个等级的控制。” 这可能是一个翻转控制，也可能是进度环或者您想要使用的任何控制。他们都将基本上相同的方式工作。您使用的是标准的HTML5标记来表示你想要什么，然后你会得到一个控制在本月底。让我运行这个。我只是复制在了，现在该标记变成这个，这实际上是相当多的HTML元素。这些都是个人的图像，并有周围的div与选择。希望你可以看到。这是一个有点微妙。我可以将鼠标悬停在不同的项目，这将让我看到的评级在这里。我可以点击它，它会记住的评级，但仅此而已。这不是真的做的评级东西。我想告诉你这个的最后一件事之前，我们切换到一个更直观的设计体验是代码一点点，我可以用它来对这些的WinJS控件响应。让我离开那里，回到了全屏的，并切换到JS这里第二。我能做到这一点就在这里。我想我会代替这整个事情。其实，我认为它会取代所有的，但我们会发现在一起。我把这个在这里。是啊。我要删除这一点。我是怎么补充？它看起来像一个不少。这不是很多。我只是延长该行的，我已经讲过了之前的代码，和我说，“当一切都完成后，当完成所有我的控制， “再这样做。”所以，再运行该函数调用完成。在这种情况下，这是东西，你可以弄清楚。去发现，格控制。其实，有一件事我必须指出。那下一行实际上是说，“我明白了ratingControlDiv。” “我想跟它，好像它是一个真正的控制，控制的WinJS。” 所以基本上，你问的，从它。你说，“我想和你谈谈作为对照。” 然后你就可以开始说这样的话，“我们将增加一个监听器为你 “所以，当你改变了我们可以应对的。” 然后我们也可以做这样的事情。其实，这是旧的代码存在。我觉得我缺少粘贴在一个更加功能，这将是实际的功能，将在评价控制被改变作出反应。让我弹出，在就在这里，我身边不远。在这种情况下，唯一的新事物的事实是，我们正在进入什么样的等级控制告诉我们，我们正在要求什么所谓的tentativeRating。有一堆不同的其他东西，该控件可以告诉你，它通过控制进入控制。这是非常简单的。你就可以到任何弄明白没有烦恼。我运行这个，现在当我改变了收视率和点击的评价，你可以看到现在它实际上是应对它。它把该评级在屏幕上成，否则空的div标签下面的等级控制。这是一个很大的东西在这里的魔力了。所以当你正在创建的Windows应用商店的应用程序，有一吨的，你可以只使用控件。他们都像这样工作。让我告诉你在设计这些应用程序的可视化的一面。好消息是你已经有了这个工具，当您安装的一切如果你去那下载，你会得到的Visual Studio。我可以用鼠标右键点击这个。我不会放大。它只是说打开在Blend中。 Blend是的作品并排与Visual Studio的另一个工具并更加专注于事物的设计方，所以它确实的表面，用于创建样式优化工具，创建动画，使用CSS，很多东西在那种静脉。在这里，我应该会很有趣，很明显马上就是我们正在寻找的应用程序。希望我们现在仍然是。而不是看到代码，我们仍然看到在底部，我们看到应用程序的实际表示。更重要的是，它不是应用程序只是一个代表，它实际上是应用程序的运行。而这正是真正的好话混合。该团队已经做了很多工作，使HTML和JavaScript和CSS这个工具。现在，你可以实际，如果你好奇，“这是什么意思？我该怎么办？” 我其实可以设计这个应用程序，尽管这样的事情在我的标记是不存在的。请记住，评价控制？这只是一个div标签。这东西，那颗星，只存在于运行时。我怎么知道？有魔法在这里一点点。看到这些闪电？你看到闪电的任何时间，这意味着它是由一些在运行时创建的。一些JavaScript跑去翻东西到这个或一些逻辑创造了这个。你看到有由JavaScript的创建者的WinJS那些明星。的好处是，它并不重要，我，我还是可以把它设计，我仍然可以去改变它，我可以找出哪些是怎么回事，我可以看看CSS的，我可以继续下去，并找出为什么颜色是事情是这样的，我可以开始搞乱的东西和做的事情太可怕了，无论我想做的事情。其实，当我离开的事情孤单。但是你可以在这里看到它的所有CSS和它在这里展示您。如果我去到那里，它会告诉你，他们叫胜出的一切，这样的CSS规则是最具体和最选定该项目，您可能已经走了过来在你的类，在那里你可以说有，我们正在运用一切一般的字体，但因为这是一个h1和我有H1S定义的颜色，这将是这个颜色，那是因为它比BODY1更具体。这一件事情就在这里告诉你这一切，它的真正功能强大的东西，因为你变得越来越复杂，你想知道为什么这些东西是他们的方式。它实际上会告诉你，你可以选择这些项目的任何位置。颜色是不是太糟糕了，其实。你可以选择它们。希望你能看到这一点。对于您对您的应用程序的一切，你看到整个级联的所有可能应用到该和哪一个CSS是赢球，其中一个居然拿了优先。种这些无聊。有没有很多在其中的一些事情。如果我去改变颜色，那么你会开始看到一些级联那里。您也可以使用HTML在这里。我可以通过和修改所有这些事情的HTML属性，我想。这里还有吨的东西在这里。我不希望由经过这里的一切把你的时间。只知道它在这里。有很多的设计为导向的功能，只是为您提供这样你就可以保持视觉，与应用程序的工作，而不必做了很多猜测那你就必须正常，做骑自行车从浏览器的后退回到您的设计，返回到浏览器。这实在是很酷的东西是什么，以及在开发一个Windows应用商店的应用程序，这将让你有更多的生产力。您还可以看到它在这里跟踪标记和你的CSS 因为你通过不同的东西的工作。这可能对你来说很难看到，尤其是在视频，但是这就是是怎么回事，我会建议你熟悉的。它会为你节省大量的时间。这就是混合。如果你在这里做任何改变，它们会自动去扛回来了到Visual Studio。这是相同的文件，它是相同的一切。我会独自离开了。我有一个更好的例子，我想告诉你。但是，如果我做出了改变，并有保存它，我回来到Visual Studio中，它会说， “嘿，你只是改变了一些事情，我可以重新加载它吗？”是。和你使用的是同样的东西在那里。这就是该特定样品的末端。我想告诉你一个更高端的样品只是给你的其他功能的视图你可能会考虑一下为好。这是一个示例应用程序，您可以下载。如果你看的东西叫做Windows的营一箱，也有一些样本是在说了，其中一个是在Contoso食谱。我可以只运行这个给你。自定义开机画面。这是网格视图的应用程序。他们已经在这里绑定了一些自定义数据。你可以通过这个导航。你可以去看看各种各样的事情，这将使我们在星期五下午饿了。我不知道。这是怎么回事，让我最饿了吗？我不知道。我只是要挑一个。你去到这些东西。它会告诉你几招。而不是单击某个项目，你也可以，，你可以去权利这一类的内容，内容的部分。在这种情况下，你可以阅读大量的假的拉丁告诉你所有关于这些食谱在这里然后直接进入到具体的配方。这也支持这样的事情我以前向您展示的图片共享。您还可以搜索到这个应用程序了。这是非常简单的做搜索。基本上，你刚刚从Windows中的文本字符串你决定要如何处理搜索这一点。它是几行代码来获得，然后之后你用它做什么完全取决于你。在这里，他们也有他们使用的是其他一些功能的应用栏。我只是告诉你它是什么。提醒一下将要使用什么所谓的Toast通知。这是非常方便的让用户知道什么时候事情已经发生了，像一个应用程序被安装或某事完成。这也是很好的游戏了。如果你有一个持久的世界或一个领导委员会，并在主控一项服务，也许一个单独的机器上，这些通知可以发送到一台机器即使用户不使用你的游戏，你玩游戏或运行你的应用程序，他们仍然可以得到有关这些类型的事件通知。所以，你可以说，“你的城堡已经被破坏或只是摧毁。” “回到这里，并保护它，”或者类似的东西。你点击通知，你去右后卫进入游戏，你可以发挥它。所以这些类型的东西可以帮助真正吸引人们回到你的应用程序相当有效。还有支持此应用程序中使用麦克风，摄像头，做视频和拍照。您还可以锁定一个次要的瓷砖。如果你只想有一个瓷砖的顺利，某些内容是有用的。在这种情况下，这是不言而喻的权利这个食谱。一切我提的，我只是展示因为它的东西，你可以考虑使用为好。在大多数情况下，它们是非常容易使用。我只是建议你带出该样品的探险家并找到一个样本，可以告诉你如何做到这一点。这是很简单的把那些到你的应用程序也有。我要告诉你一件事那是很酷这里。我会捕捉这个应用程序，我会回去的Visual Studio。此应用程序正在运行。它从Visual Studio中运行。我可以做一些很酷的东西这一点。我其实有一个选项来选择一个元素，我可以走了过来这里的现场应用，我可以说， “我不知道为什么是准备时间比标题本身有点浅灰色？” 我可以点击它。它会同步处理返回到Visual Studio中，并且它会告诉我确切，导致在UI的那部分所产生的内容。因此，在这种情况下，它的项目，字幕和H4双结构，且有可能告诉我们什么，我们需要知道，因为作为该范围内的H4，它会得到某种字体。但是，如果我仍然不知道为什么，我可以点击跟踪样式。然后我就可以扩展出彩，我可以找出到底为什么颜色是不是身体颜色但实际上是另一回事。这实质上是从Internet Explorer的开发工具要带入Visual Studio中一学位。如果你用Chrome浏览器开发工具的工作，萤火虫，那样的话，这些类型的工具，是在浏览器中，那种功能已被带到右到Visual Studio 所以你实际上并不需要启动浏览器，并用这些工具独立工作。现在我有一个Windows应用商店的应用程序只是运行，而我就可以开始拉它拆开，找出为什么事情正在做什么，他们是。我也可以这样来做了。我可以去随便挑右的东西从标记，并找出它是什么在应用程序本身。我想我已经过去了的一切。在这里，我徘徊在此。我可以选择它。它会告诉我在实际运行的应用程序，其中那个东西是那我现在在点击了标记。真正酷的东西。当你正在试图弄清楚这是怎么回事，什么HTML是干什么的，什么是CSS是干什么的，记住这一点。请记住，这是为你在这里同时又有Blend可以用一个实时运行的应用程序的工作。的最后一件事我想告诉你用这个应用程序 - 顺便说一句，就说明你的增量随着事态的变化太大，所以你可以看那些黄色的亮点。这些都是刚刚改变了应用程序的东西。但最后一件事。我想回到这里混合只是一秒钟。我们会打开这个了，开在Blend中，相同的应用程序，同样的一切。我只是想告诉你这里的经验是不是只是你被困在主页上在看的东西，你会在默认情况下得到，当您运行该应用程序，并让它坐在那里。您还可以打开这个漂亮的小图标在这里。这就是所谓的互动模式。你点击。它会带给你的应用程序。你不是在设计模式了，所以你不会被点击的东西改变功能，但实际上你可以与应用程序现在的工作。您可以通过点击，你可以做什么，得到您关心的食谱或到一个类别。让我们去到这一类。我会说：“好吧，这里就是我想设计。” 然后再次单击该按钮时，它会带给你回到设计表面，现在你可以做所有这些事情，我之前讲的。我会继续点击，直到我得到这个选择的，找出它的尺寸，找出HTML它，的CSS，它正在运行的应用程序，该应用程序的一些后期。非常，非常有用。我将展示给你。请记住这一点，如果你正在寻找与这写代码因为它会为你节省很多的麻烦，而且它是相当不错的东西。这几乎是所有我想告诉你在Blend和Visual Studio中的一切。在任这些工具有问题吗？什么呢？ >> [Guarin]我有东西给出来的，所以好问题，好东西。 [博文笑]我已经向您展示我的演示在这里。我打算把它放在资源页面上转来转去的问题了。首先参考的是，新一代APP网站的游戏赛道和应用程序的轨道。报名者。您不必等待30天获取内容。您可以开始准备，并着眼于内容如你所愿。我理解你的时间框架可能比不同 - [笑] 因此，当是Hackathon？这是几个星期，对不对？所以，你没有30天等待。所以是的，你可以注册为，然后就开始从它拉出来的内容。还开发和设计中心。我并没有提到这一点，但也有在商店的文档。这将是在Hackathon之后，你就可以开始提交您的应用程序的商店。有一些有用的指导，介绍了如何把事情进店一些指导，可能你绊倒的一些常见问题，这就是那些资源的末端。那么什么是您的想法？其他任何你 - [Guarin]谁在想着做一个Windows应用程序的CS50？凉爽。 [博文]酷。大。关于你见过这么远的东西，它是如何有任何疑问涉及到这？举例来说，有更多的时间，我可以把我写的一个游戏并运行在浏览器中，只是一种经历的过程使这一到Visual Studio中，并使其成为一个Windows应用商店的应用程序中。它需要更多的时间比我们真的有今天包括，但短版是它的，你在浏览器里运行相同的代码，而且你改变的事情是你决定插入到Windows 8的东西。所以，如果你想要使用的魅力，如果你想搜索或分享，您需要创建一个应用程序栏隐藏了一些功能上说，这些都是各种各样的事情，你会改变。但你的web应用程序的核心可以保持不变。同样，只要它工作在IE10，这将是一个非常简单的端口把这些东西到Visual Studio中，为混合，并使其成为Windows应用商店的应用程序。同样，你将需要学习的唯一的东西是那些其他功能您可以用它来点亮一个应用程序，就像一个活的瓷砖和这些类型的东西。是啊。 >> [学生]我的问题是关于工作的移动。所以，如果你做一个应用程序，可以作为一个应用程序在桌面上，是不是真的很容易将其传送到手机，或者是有一个 - 现在的问题是，如果我做一个Windows应用商店的应用程序，是真正为这个环境优化我想将其带到一个移动的世界，什么是参与这样做？也就是说，像许多问题，始终是一个不断变化的答案。好消息是，如果你坚持使用HTML和JavaScript，CSS，如果你是从Windows Store应用出发，这将让你把它给Web 然后使用这些类型的技术，如媒体查询和事物，以适应不同尺寸的设备。尽管如此，总有框架和东西在那里这种支持延伸出不同的技术，不同的平台。那时刻都在变化。我们也正在改变的东西，以及我们仰望我们现在实际上用的Windows Phone 8。我们有一些共同的核心基础架构对于这些环境的应用程序之间提供。所以，你正在做创建一个Windows应用商店的应用程序的东西，很多的，可以结转到Windows Phone 8的应用程序也是如此。这又是一个新兴的故事，所以有关于在构建一些内容。该SDK只是一小会儿前下了车。这只是一小会儿前公布。但在其他平台也条款，你可能会遇到很多的跨平台框架以及。好消息是，你在这里做的东西，核心功能是直线上升的Web标准的东西。这不会容易翻译的唯一的东西都是Windows 8做的事情，不过这并不奇怪，因为它是一个Windows功能。你不会找到任何其他平台上共享或类似种类的合约。因此，这些都是，你会想从设计的角度看事情请确保您有办法那种抽象的，所以你可以说， “如果我在这跑，我能做到这一点。” 如果我不在，有一些设计模式，你可以用它来种隐藏的东西了。但记住这一点。是啊。抱歉。来吧。 [学生]如果我想测试在[听不清]顶我的Windows应用程序 [博文]是啊。我跳过一件事了。是啊。我先回答你的问题，那么我会告诉你一个功能，我忘了提。我们确实有一些可用的机器上本地。对不起。现在的问题是，我怎么测试的东西上的设备如果我不碰巧有一大堆的事情，不知如何选择？ [Guarin]我们为您借给你们，我想，5或6。有多少你需要什么？ [学生]我们得到了4人。 >>好吧。你们得到了4石板玩弄。所以，绝对让大家知道，谢谢。 [笑] >> [博文]真棒。这是一个更好的答案比我正想给你。我们的办公时间为开发商，我们做在我们的办公室而现在即将推出的微软商店对在保诚，但埃德温已经采取照顾你。有4个石板可供借出，进行测试。我们走吧。有一个在那里一个例子。所以是的，绝对。大。绝对远远测试它的最好办法是做一个设备上。如果不碰巧有一个尚未或想在校园行走在雪地里你不抢一个或什么的，还有一种方法可以做到这一点早在Visual Studio中。而不是使用本机，如果我重新回到那里，我在这里，在这里，你能连接到远程计算机，但是这不是我这里所说的。模拟器是，你可能要考虑的东西。我要跑这一点，真的它是什么，它本质上是一个窗口到您自己的系统。这里其实是我的系统运行，运行Contoso公司，但在某种程度上，让我改变一些执行参数，的环境参数。所以我可以在这里说，“你知道什么？” 呵呵。我已经有它运行在一个模拟的27英寸显示器2560的分辨率。我可以很容易地降下来，看看我的应用程序将与一个较小的屏幕做或者通过更改DPI设置或什么的。因此，在一个小屏幕，一个10.6，它是什么怎么办？这看起来还是蛮不错的，对不对？你要做到这一点，特别是如果你要提交到店里，因为我们做的作为测试过程的一部分。如果有这样的问题，那么你可能会遇到获得认证的存储问题。但是，这是模拟器的一部分。真的很酷。很容易做到这一点。您还可以使用的功能，如旋转它。我可以按一下按钮，在这里，有它旋转，见什么人会有作为一个经验旋转的石板，他们的平板电脑，并使用您的应用程序与。还有一些其他的事情太像触摸仿真和一些其他的东西，设置GPS。我可以假装我在不同的位置，看看我的应用程序的功能当我假装我回到西雅图什么的。但它是一个非常有用的功能，它的内置于Visual Studio和Blend中。是。你的问题。 [学生]如果你正在编写一个游戏，它的Visual Studio有任何动画的支持？是啊。现在的问题是各地的动画支持，特别是游戏。这要看情况。 [笑] 与JavaScript的我会说有可能是支持少比没有对XAML的一面，其中有时限，有故事和那些内置的东西有关JavaScript的应用程序的动画，我不知道我该怎么回答他很想给你。我有一个经历了很多为物理动画的选项在我的博客资源，选项在Windows 8的JavaScript的面向游戏。我想请你到这些。基本上，有这么多的选择。我犹豫的原因是有做动画用JavaScript这么多的选择。它可能是CSS，它可以被帆布基，它可能只是基本的DOM动画它可能是一个很多不同的东西，所以它实际上取决于你的选择。如果您决定使用类似Create.js或石灰或其他类型的框架 - 嗯，我什至不知道你要能够使用较高端框架喜欢冲击或构造。这往往会产生比你可能会考虑从头开始更多的代码。不过，在这些情况下，您仍然可以使用一个模拟器，你可以使用的环境，我倾向于只使用这个环境，我的测试平台，在这种情况下因为我正在开发的游戏。我一直特别细带帆布动画，这可能是最常见的事。你将可能发现最好是在浏览器的开发工具并在Visual Studio中的开发工具。样的曲折答案，但希望我得到你的答案。是。您。 [学生]什么是Windows 8的应用程序的数据存储选项？什么是Windows 8的应用程序的数据存储选项，Windows应用商店的应用程序？你的选择真的是每个应用程序都有自己的本地存储池用于设置和数据，但它也是可笑的易于使用的漫游存储，使用基于云的存储。它是免费的。什么情况是你基本上选择不同的类，你说， “漫游设置，保存，这组特定的内容，” 和他们的Microsoft帐户，无论他们在已经签署的，将是关键漫游周围的信息。所以，如果我用你的游戏我的笔记本电脑，然后我用相同的帐户登录和我打在表面上的游戏或片剂，它会自动漫游那些机器之间的设置和数据。这是一个默认的事情。这是很好的数据一定数量。你不会把一个庞大的数据库到这些。对于那些你需要去其他类型的解决方案，就像在云中托管的数据库，这样的事情。周围有其他类型的数据技术的一些其他社区的选项。我已经看到了在社区周围还有一些SQLite的选项了。所以越来越多的不断涌现，但这些是主要的事情，你会仰望游戏或应用程序。而你又在后面一个问题了。 [学生]在网络方面[听不清]上传或下载文件[听不清] [博文]是你的问题，你怎么能看到，不然你怎么能调试和测试它？ [学生]你如何调试呢[听不清] 抱歉。我不能听到这一切。 [学生]你怎么得到它的bug测试和也[听不清] 大。大。你如何与网络合作？你怎么能看这是怎么回事？有许多不同的答案到这一个，但让我告诉你可能是最简单的东西在这里。让我摆脱了模拟器的一秒钟。只是一对夫妇的调试选项进行联网。还有烤右进WinRT的水平，并从两者的WinJS一个完整的网络协议栈，这样你就可以很轻松地进行XHR，AJAX类型从您的游戏或应用程序调用来做到这一点。首先，我倾向于使用两件事情。我用的是实际的开发工具本身，其中有烤到他们的网络堆栈。让我告诉你Windows的主页。我提这件事，而且也确实烤到这里这些工具网络代理。因此，我可以做到这一点，我可以刷新页面，它会告诉我所有的相互作用，该届会议，包括AJAX调用，该请求的时间。这是有用的。这将是基于浏览器的应用程序非常有用。对于其他类型的应用程序，包括Windows Store应用程序中，我使用了一个名为Fiddler工具。你会得到一个游戏响应。 [笑] Fiddler是一个简单的代理。我想我可以证明给你。这只是GetFiddler.com，其中，有趣的是，我跟踪我的网络协议栈要GetFiddler。不过，无论如何，提琴手已经写入了对IE团队的项目经理之一，所以他知道自己在做什么。这是一个很好的代理，您可以使用用于调试网络流量。我建议。问题在那里了。 [学生]有没有一种简单的方法来将外国语言输入，像日本或中国，进入Windows的应用程序？我不能说我已经做了我自己了吧，但它烤英寸有用于发射过程中您的应用程序的选项 - 我很抱歉，我没有说这个问题 - 围绕全球化的选择，内容的本土化，包括像能够在不同的市场销售并针对该版本的应用程序对于那些个别的语言或文化或类似的东西。绝对是内置的。我们已经为支持永远，并发扬到您选择Windows应用商店。你可以这样做，在商店本身，卖在不同的市场，你可以做到这一点的应用，以及太使用的资源来定义， “如果我开发了这种文化，然后使用这些替代我的文本内容 “或者使用左读者的权利。” 这些都是默认的WinJS和WinRT的API的一部分。好问题。我们做得怎么样？任何其他人呢？如果有人对视频有问题，我cbowen @微软，所以我很高兴把您的任何问题来自未来。非常 - 从未来，未来[模仿呼应。因此，这里是我的。让我放回我的联系方式在这里。所以只是给我一张纸条，cbowen @微软，我会尽快给你，只要我可以。其他任何你想知道？我们是否良好？大。好的。谢谢大家了。我很感激。 [鼓掌] [CS50.TV]