윈도우 8의 새로운 컨트롤과 개발시 알아야 할 점들
DESCRIPTION
31회 HOONS닷넷 정기세미나 2세션 - 윈도우 8의 새로운 컨트롤과 개발시 알아야 할 점들TRANSCRIPT
Hoons 닷넷
Windows 8 시삽
Byeong Geol Yun
<div id="ItemTemplate" data-win-control="WinJS.Binding.Template"> <div class="overlaidItemTemplate"> <img class="image" src="#" data-win-bind="src: picture; alt: title" /> <div class="overlay"> <h2 class="ItemTitle" data-win-bind="innerText: title"></h2> </div> </div> </div> <div id="basicFlipView" data-win-control="WinJS.UI.FlipView" data-win-options="{ itemDataSource : DataExample.itemList.dataSource, itemTemplate : ItemTemplate }" ></div>
<FlipView x:Name="FlipView1" Width="250" Height="250"> <FlipViewItem Width="248" Height="248"> <Border Background="Orange"> <TextBlock Text="Item 1" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{StaticResource DescriptionTextStyle}"/> </Border> </FlipViewItem> <FlipViewItem Width="248" Height="248"> <Border Background="LightBlue"> <TextBlock Text="Item 2" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{StaticResource DescriptionTextStyle}"/> </Border> </FlipViewItem> <FlipViewItem Width="248" Height="248"> <Image Source="Images/image1.jpg" Stretch="UniformToFill"/> </FlipViewItem> <FlipViewItem Width="248" Height="248"> <Border Background="LightGreen"> <TextBlock Text="Item 4" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{StaticResource DescriptionTextStyle}"/> </Border> </FlipViewItem> </FlipView>
<div id="semanticZoomDiv" data-win-control="WinJS.UI.SemanticZoom"> <!-- The zoomed-in view. --> <div id="zoomedInListView" data-win-control="WinJS.UI.ListView" data-win-options="{ itemDataSource: myData.groupedItemsList.dataSource, itemTemplate: mediumListIconTextTemplate, groupHeaderTemplate: headerTemplate, groupDataSource: myData.groupedItemsList.groups.dataSource, selectionMode: 'none', tapBehavior: 'none', swipeBehavior: 'none' }" ></div> <!--- The zoomed-out view. --> <div id="zoomedOutListView" data-win-control="WinJS.UI.ListView" data-win-options="{ itemDataSource: myData.groupedItemsList.groups.dataSource, itemTemplate: semanticZoomTemplate, selectionMode: 'none', tapBehavior: 'invoke', swipeBehavior: 'none' }" ></div> </div>
<SemanticZoom ...><SemanticZoom.ZoomedOutView>
</SemanticZoom.ZoomedOutView><SemanticZoom.ZoomedInView>
</SemanticZoom.ZoomedInView> </SemanticZoom>
var data = DownloadData(...);
ProcessData(data);
var
Windows Runtime: IAsyncOperation<T>
.NET Framework: Task<T>
Javascript: Promises
All are objects representing “ongoing operations”
All use callbacks to signal completion of operation
Callbacks turn your code inside out
http://stephenwalther.com/blog
http://msdn.microsoft.com/en-us/library/windows/apps
http://code.msdn.microsoft.com/windowsapps/