Your SlideShare is downloading. ×
0
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Students Stars
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Students Stars

479

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
479
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Windows 8.1 developer training Windows 8.1 for developers Dima AlOthaimeen @Othaimeen www.othaimeen.me
  • 2. A new UI where touch is a first-class citizen along with full mouse-and-keyboard support Windows Store Apps
  • 3. Rich, integrated search driven by Bing Personalized start and lock screens New live tile sizes, including large Live tile on install Apps share the screen Deep OneDrive integration
  • 4. Windows 8.1: Free for all Windows 8 PCs
  • 5. There are over 100,000 apps in the Windows Store including top apps like Hulu, Netflix, Twitter and Facebook.
  • 6. New Windows Store UX Find apps on Start screen with search or new all apps view Custom app recommendations based on user behavior Tight integration with Bing search to aid app discovery Improved marketing alignment and focus on credit card attach
  • 7. HTML/JS enables you to use your web development knowledge and great open source and commercial libraries to create native Windows Store apps.
  • 8. XAML with C#, VB and C++ makes the best use of your wealth of desktop, server, and phone development knowledge to enable you to build compelling Windows Store apps.
  • 9. Many core Windows 8.1 experiences built on the same technology New search, contact card, device companion apps, lock screen camera, and more
  • 10. DirectX is the best platform for high- performance, high-frame rate games and visualizations
  • 11. Programming skills Development tools Languages, frameworks Components Runtimes
  • 12. Great device experiences … … powered by services in the cloud
  • 13. Find a recipe I want to make Prepare a recipe Share recipes with my friends
  • 14. Find a recipe I want to make Prepare a recipe Share recipes with my friends
  • 15. Envisioning
  • 16. FrameworkElement TextBlock RichTextBlock Control ContentControl Border ButtonBase Button ToggleButton CheckBox RadioButton ProgressRing RangeBase ProgressBar TextBox, PasswordBox RichEditBox Image Shape Rectangle, Ellipse
  • 17. TextBlock TextBlock FontSize="40" FontWeight="Bold" FontStyle="Italic" FontFamily="Times New Roman" TextBlock TextTrimming="WordEllipsis" TextBlock Typography.Fraction="Slashed" TextBlock Typography.StylisticSet4="True" TextBlock Typography.StylisticSet5="True" TextBlock Typography.StylisticSet6="True" TextBlock Typography.StylisticSet7="True"
  • 18. RichTextBlock OverflowContentTarget="{Binding ElementName=SecondColumnOverflow}" Paragraph Paragraph Paragraph Hyperlink Hyperlink Paragraph Paragraph InlineUIContainer Button InlineUIContainer Run Run Paragraph Paragraph Run Paragraph RichTextBlock RichTextBlockOverflow x:Name="SecondColumnOverflow"
  • 19. TextBlock ProgressRing IsActive="True" TextBlock ProgressBar Minimum="0" Maximum="250" Value="50" TextBlock ProgressBar IsIndeterminate="True" Important! You must deactivate progress rings and progress bars when not visible. There’s a performance penalty if you do not.
  • 20. <TextBox Text="Hello world" /> <TextBox Text="Headers can be templated" Header="TextBox Header Text"/> <TextBox Text="I am going to the store for moar bread." Header="Spell-checking" IsSpellCheckEnabled="True"/> <TextBox Header="Placeholder text" PlaceholderText="please enter your first name"/> <TextBox Header="Color Font Support" Text="I like tapioca. 😀" IsColorFontEnabled="True" FontFamily="Segoe UI Emoji" /> <TextBox Text="For on-screen keyboards only" Header="Text Prediction" IsTextPredictionEnabled="True"/> <TextBox Text="pete@contoso.com" Header="Input scope control" PlaceholderText="For touch keyboard" InputScope="EmailSmtpAddress"/> <TextBox Text="Peter piper picked a peck" Header="Selection highlight color control" SelectionHighlightColor="Orange"/> <PasswordBox Header="Please enter your password" FontSize="40" Margin="20" IsPasswordRevealButtonEnabled="True" Password="Password1" />
  • 21. <TextBox InputScope="EmailSmtpAddress"/> <TextBox InputScope="Formula"/> <TextBox InputScope="Number"/>
  • 22. Button Click="LoadFileButton_Click" RichEditBox x:Name="RichTextEditor" private async void LoadFileButton_Click(object var new var await var await RichTextEditor.Document.LoadFromStream(TextSetOptions.FormatRtf, stream);
  • 23. DatePicker CalendarIdentifier="GregorianCalendar" DatePicker CalendarIdentifier="KoreanCalendar" DatePicker CalendarIdentifier="JulianCalendar" DatePicker DayFormat="{}{dayofweek.solo.full}" DatePicker DayFormat="{}{day.integer} {dayofweek.abbreviated}" TimePicker ClockIdentifier="12HourClock" TimePicker ClockIdentifier="24HourClock" DatePickerTimePicker
  • 24. A short sidebar, before we continue with controls
  • 25. LocalBinding TextBlock Text="Set locally" TextBlock Text="{Binding FirstName}" TextBlock Text="{StaticResource AppName}" person.FirstName Most control properties in XAML are dependency properties and can therefore be set in several different ways. Not shown here: animation (storyboards) and style setters CodeStatic Resource
  • 26. ExplicitImplicit Page.Resources Style TargetType="Control" x:Key="BaseControlStyle" Setter Setter Style Style TargetType="TextBox" Setter Style Style BasedOn="{StaticResource BaseControlStyle}" Setter Setter Style Page.Resources Styles enable reuse of property values throughout the app Styles may be inherited and may be implicit or explicit Style Inheritance
  • 27. <ControlTemplate TargetType="Button"> <Grid> … <Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush} " BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Margin="3"> <ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" ... /> </Border> <Rectangle x:Name="FocusVisualWhite" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="1.5" StrokeEndLineCap="Square" Stroke="{ThemeResource FocusVisualWhiteStrokeThemeBrush}" StrokeDashArray="1,1"/> <Rectangle x:Name="FocusVisualBlack" IsHitTestVisible="False" Opacity="0" StrokeDashOffset="0.5" StrokeEndLineCap="Square" Stroke="{ThemeResource FocusVisualBlackStrokeThemeBrush}" StrokeDashArray="1,1"/> </Grid> </ControlTemplate>
  • 28. ButtonContent Button Button Button Grid Grid.ColumnDefinitions ColumnDefinition ColumnDefinition Grid.ColumnDefinitions Image StackPanel TextBlock TextBlock StackPanel Grid Button HyperlinkButton <Image Source="ms-appx:///Assets/Surface2.jpg"
  • 29. XAMLCode-Behind Button Click="SimpleButton_Click" private async void SimpleButton_Click var new await The click event provides a simple way to handle button interaction directly from the code-behind. Double-click the button on the designer or use Intellisense in the XAML editor to generate the handler. Handlers may also be wired up from code using the += syntax in C# and equivalent in VB.
  • 30. XAMLViewModel Button Command="{Binding DoSomethingCommand}" private RelayCommand _doSomethingCommand; public RelayCommand DoSomethingCommand { get { ... } set { ... } } ... The button command provides the same functionality as the event, but allows for MVVM and separation of UI from implementation. Association may be set at runtime rather than compile-time. Example: the Locator pattern.
  • 31. Button <Button.Flyout> <Flyout> StackPanel TextBlock TextBlock Button StackPanel </Flyout> </Button.Flyout> Button Button <Button.Flyout> <MenuFlyout> MenuFlyoutItem MenuFlyoutItem MenuFlyoutSeparator ToggleMenuFlyoutItem ToggleMenuFlyoutItem </MenuFlyout> </Button.Flyout> Button
  • 32. {x:Null}
  • 33. Ellipse Rectangle Rectangle Line Path
  • 34. Border TextBlock Border Border is a ContentControl Although sometimes used to create rectangles, it’s very heavy for something which could be more efficiently accomplished with a shape. Use Border when you need a way to contain an element with a visible border.
  • 35. TextBlock Image TextBlock Image Image.Source BitmapImage DecodePixelWidth="600" Image.Source Image Scale at decode time Providing a size when loading saves memory as only the bits to be displayed are loaded in memory, reducing your app’s working set. Often, this results in higher quality scaling as well.
  • 36. http://msdn.microsoft.com/en-us/library/windows/apps/hh700354.aspx http://msdn.microsoft.com/en-us/library/windows/apps/hh700353.aspx http://msdn.microsoft.com/en-us/library/windows/apps/hh968442.aspx http://msdn.microsoft.com/en-us/library/windows/apps/hh965324.aspx
  • 37. http://channel9.msdn.com/Events/Build/2013/2-164 http://channel9.msdn.com/Events/Build/2013/3-321 http://channel9.msdn.com/Events/Build/2013/2-082
  • 38. FrameworkElement Control SemanticZoom ItemsControl Selector ListBox ComboBox ListViewBase ListView GridView FlipView
  • 39. ItemsControls are complex and flexible For example: a ListView For example: on a ListView, this is a VirtualizingStackPanel by default eg: ListViewItem eg: ListViewItem eg: ListViewItem Item realized using ItemTemplate Item realized using ItemTemplate Item realized using ItemTemplate…
  • 40. Data Data template
  • 41. FlipView FlipView.ItemTemplate DataTemplate Grid Image Border TextBlock Border Grid DataTemplate FlipView.ItemTemplate FlipView DataTemplate
  • 42. ListView
  • 43. GridView
  • 44. ItemsControl Selector ListViewBase ListView GridView FlipView
  • 45. Can virtualize Can not virtualize
  • 46. GridViewItemPresenter + = Improve performance Avoids unnecessary creation of adorner elements Use presenters in customized item container templates to get start up improvements on Windows 8.1
  • 47. SemanticZoom SemanticZoom.ZoomedInView <!-- Normal view goes here --> SemanticZoom.ZoomedInView SemanticZoom.ZoomedOutView <!-- high-level view goes here --> SemanticZoom.ZoomedOutView SemanticZoom What can be in the views? The zoomed in and out views are typically GridView or Hub controls, but do not need to be. The control just needs to implement ISemanticZoomInformation.
  • 48. http://msdn.microsoft.com/en-us/library/windows/apps/hh780615.aspx http://msdn.microsoft.com/en-us/library/windows/apps/hh780657.aspx
  • 49. http://channel9.msdn.com/Events/Build/2013/3-157 http://channel9.msdn.com/Events/Build/2013/3-158 http://channel9.msdn.com/Events/Build/2013/2-164 http://channel9.msdn.com/Events/Build/2013/2-082

×