윈도우 8의 새로운 컨트롤과 개발시 알아야 할 점들

1,041 views

Published on

31회 HOONS닷넷 정기세미나 2세션 - 윈도우 8의 새로운 컨트롤과 개발시 알아야 할 점들

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,041
On SlideShare
0
From Embeds
0
Number of Embeds
103
Actions
Shares
0
Downloads
27
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

윈도우 8의 새로운 컨트롤과 개발시 알아야 할 점들

  1. 1. Hoons 닷넷 Windows 8 시삽 Byeong Geol Yun
  2. 2. <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>
  3. 3. <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>
  4. 4. <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: mediu mListIconTextTemplate, groupHeaderTemplate: headerTemplate, groupDataSource: myDat a.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', swipeBehavio r: 'none' }" ></div> </div>
  5. 5. <SemanticZoom ...> <SemanticZoom.ZoomedOutView> </SemanticZoom.ZoomedOutView> <SemanticZoom.ZoomedInView> </SemanticZoom.ZoomedInView> </SemanticZoom>
  6. 6. var data = DownloadData(...); ProcessData(data); var
  7. 7. 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
  8. 8. community :Hoons.Net blog : ryunad.tistory.com Twitter : @Ryunad Email : ryunad@hugeflow.com
  9. 9. http://stephenwalther.com/blog http://msdn.microsoft.com/en-us/library/windows/apps http://code.msdn.microsoft.com/windowsapps/

×