3 whats-new-in-ios7-m3-uikit-slides

Jon Flanders@jon!anders

What’s New in iOS7UIKit

Tuesday, September 3, 13

What You will Learn


What You will Learn

§ Details about the new UIView layout in iOS7


What You will Learn

§ Details about the new UIView layout in iOS7§ Overview of other features


Full Screen


Full Screen

§ By default, your top-level views are extended to the full screen height and width


Full Screen

§ By default, your top-level views are extended to the full screen height and widtho Underneath the status bar


Full Screen

§ By default, your top-level views are extended to the full screen height and widtho Underneath the status bar o Underneath navigation bar (if you are using one)


Full Screen


§ wantsFullScreenLayout now deprecated


Full Screen


§ wantsFullScreenLayout now deprecatedo extendedEdgesForLayout can change how far your view extends


Full Screen


§ wantsFullScreenLayout now deprecatedo extendedEdgesForLayout can change how far your view extendso Can get iOS6 like behavior


Full Screen



§ Don’t make changes that could make status bar unreadable


Full Screen



§ Don’t make changes that could make status bar unreadableo New status bar style: UIStatusBarStyleLightContent


Full Screen



§ Don’t make changes that could make status bar unreadableo New status bar style: UIStatusBarStyleLightContento BlackTranslucent and BlackOpaque deprecated


Status Bar


Status Bar

§ Besides making sure not to obfuscate the status bar, apps have more control over it in iOS7 through UIViewController


Status Bar


§ preferredStatusBarStyle property can be overridden


Status Bar


§ preferredStatusBarStyle property can be overridden§ You can call setNeedsStatusBarAppearanceUpdate


Status Bar



o If called during an animation block, the changes will be animated


Status Bar




§ prefersStatusBarHidden defaults to NO


Status Bar




§ prefersStatusBarHidden defaults to NOo You can set to yes


Status Bar




§ prefersStatusBarHidden defaults to NOo You can set to yeso preferredStatusBarUpdateAnimation kicks in if it changes


Tint Color


Tint Color

§ Property used to be available on bars, now on UIView


Tint Color

§ Property used to be available on bars, now on UIView o Not the same as iOS6 version


Tint Color


§ Tint color now used consistently through an app to indicate interactivity of an element


Tint Color


§ Tint color now used consistently through an app to indicate interactivity of an elemento Rather than a certain chrome on an item


Tint Color



§ Each app is free to pick its own tint color


Tint Color



§ Each app is free to pick its own tint color o Default is new iOS7 blue color


Tint Color




§ Tint color is now inherited from the top-level view down


Tint Color




§ Tint color is now inherited from the top-level view downo Each UIView can change if desired, but a consistent tint color helps users understand

what is interactive (clickable, touchable) in your app


Tab and Navigation Bars



§ tintColor no longer has the same effect



§ tintColor no longer has the same effect o If you want to change the bar background color use barTintColor




§ Size of tab and navigation bars has changed




§ Size of tab and navigation bars has changedo Again, best to use Auto Layout expressions to avoid hardcoded values


Navigation Bar


Navigation Bar

§ Now translucent


Navigation Bar

§ Now translucento Again your View will generally appear below the nav bar on scroll


Navigation Bar


§ You can change the backIndicatorImage


Navigation Bar


§ You can change the backIndicatorImageo backIndicatorTransitionMaskImage is used during push and pop transitions


Navigation Bar


§ You can change the backIndicatorImageo backIndicatorTransitionMaskImage is used during push and pop transitionso Generally you’ll change both of them


Navigation Bar



§ displaysSearchBarInNavigationBar


Navigation Bar



§ displaysSearchBarInNavigationBaro Puts the search bar in NavigationBar rather than at top of TableView


Button


Button

§ Buttons are now borderless and bezel-less


Button

§ Buttons are now borderless and bezel-lesso UIButtonTypeSystem new default button type


Button

§ Buttons are now borderless and bezel-lesso UIButtonTypeSystem new default button type

§ TintColor used to set normal and selected color


UIImage


UIImage

§ Template images are now taken care of by UIKit


UIImage

§ Template images are now taken care of by UIKito Call imageWithRenderingMode to specify template behavior


UIImage

§ Template images are now taken care of by UIKito Call imageWithRenderingMode to specify template behavioro UIImageRenderingModeAlwaysTemplate


UIImage

§ Template images are now taken care of by UIKito Call imageWithRenderingMode to specify template behavioro UIImageRenderingModeAlwaysTemplateo UIImageRenderingModeAlwaysOriginal


UIImage

§ Template images are now taken care of by UIKito Call imageWithRenderingMode to specify template behavioro UIImageRenderingModeAlwaysTemplateo UIImageRenderingModeAlwaysOriginal o UIImageRenderingModeAutomatic (default) – will template or not based on context


UIActivity


UIActivity

§ New Activity Types


UIActivity

§ New Activity Typeso UIActivityTypeAddToReadingList


UIActivity

§ New Activity Typeso UIActivityTypeAddToReadingList o UIActivityTypePostToFlickr


UIActivity

§ New Activity Typeso UIActivityTypeAddToReadingList o UIActivityTypePostToFlickro UIActivityTypePostToVimeo


UIActivity

§ New Activity Typeso UIActivityTypeAddToReadingList o UIActivityTypePostToFlickro UIActivityTypePostToVimeoo UIActivityTypePostToTencentWeibo


UIActivity

§ New Activity Typeso UIActivityTypeAddToReadingList o UIActivityTypePostToFlickro UIActivityTypePostToVimeoo UIActivityTypePostToTencentWeiboo UIActivityTypeAirDrop


UIActivity


§ New enum: UIActivityCategory


UIActivity


§ New enum: UIActivityCategoryo UIActivityCategoryShare – Facebook, Twitter, etc.


UIActivity


§ New enum: UIActivityCategoryo UIActivityCategoryShare – Facebook, Twitter, etc.o UIActivityCategoryAction – AirDrop


TableView


TableView

§ Major change: in grouped style, cells now extend to edge


TableView

§ Major change: in grouped style, cells now extend to edgeo Larger space between sections


TableView

§ Major change: in grouped style, cells now extend to edgeo Larger space between sectionso Darker background


TableView


§ Highlighted cells


TableView


§ Highlighted cellso Gray instead of blue background – no color inversion – or use

selectedBackgroundView to create custom view on selection


TableView



selectedBackgroundView to create custom view on selectiono Separators are inset


TableView




§ Estimated height API


TableView




§ Estimated height APIo You can now “prime” the table view with an estimated height before cells are

requested


UIScrollView


UIScrollView

§ Small but powerful change: keyboardDismiss property


UIScrollView

§ Small but powerful change: keyboardDismiss propertyo UIScrollViewKeyboardDismissModeOnDrag is my favorite – when you have a form in a

scroll view, scrolling dismisses the keyboard!


Other Controls


Other Controls

§ Segmented controls


Other Controls

§ Segmented controls o UISegmentedControlStyle deprecated, it has no effect


Other Controls


§ Switches and sliders: slight metrics change


Other Controls


§ Switches and sliders: slight metrics changeo Again, Auto Layout is your friend here


Animations


Animations

§ iOS7 supports custom animations when moving between Views


Animations

§ iOS7 supports custom animations when moving between Viewso New ”animate with” methods enable both built-in as well as custom keyframe

animations


Animations


animations

§ Also supports opting out of any potential animations


Animations


animations

§ Also supports opting out of any potential animationso [UIView performWithoutAnimation] takes a block that will guaranteed to execute

without any animations


Animations


animations

§ Also supports opting out of any potential animationso [UIView performWithoutAnimation] takes a block that will guaranteed to execute

without any animationso Usually for performance reasons


Custom Transitions


Custom Transitions

§ iOS7 makes it easy to provide custom animations during ViewController transitions


Custom Transitions

§ iOS7 makes it easy to provide custom animations during ViewController transitions

§ Implement UIViewControllerTransitioningDelegate to get control


CollectionViews


CollectionViews

§ Its always been possible to animate layout changes inside of a CollectionView


CollectionViews

§ Its always been possible to animate layout changes inside of a CollectionView o New method has completion block


CollectionViews


§ You can customize the layout-to-layout transitions using a UICollectionViewTransitionLayout subclass


CollectionViews



§ Layout-to-layout navigation controller pushes now possible


CollectionViews



§ Layout-to-layout navigation controller pushes now possibleo useLayoutToLayoutNavigationTransitions must be set to NO on the current Collection

View Controller


CollectionViews



§ Layout-to-layout navigation controller pushes now possibleo useLayoutToLayoutNavigationTransitions must be set to NO on the current Collection

View Controllero useLayoutToLayoutNavigationTransitions must be set to YES on the pushed Collection

View Controller


Motion


Motion

§ Part of the look of the new OS is related to depth and motion


Motion

§ Part of the look of the new OS is related to depth and motiono Springboard has a parallax effect behind it


Motion


§ Alerts move as your position moves


Motion


§ Alerts move as your position moveso Best seen in Safari multiple-page views


Motion


§ Alerts move as your position moveso Best seen in Safari multiple-page views

§ UIMotionBehavior is the main class in the new API


Motion Effects


Motion Effects

§ UIMotionEffect is the super class


Motion Effects

§ UIMotionEffect is the super classo You can subclass for your own effects


Motion Effects

§ UIMotionEffect is the super classo You can subclass for your own effectso You are passed the UIOffset which tells you the vertical/horizontal offset motion of

the device


Motion Effects


the deviceo Return a dictionary of keypaths and relative values for that offset


Motion Effects



§ Rather than subclassing, you can use UIInterpolatingMotionEffect


Motion Effects



§ Rather than subclassing, you can use UIInterpolatingMotionEffecto Give it a keypath and a min and max value


Motion Effects



§ Rather than subclassing, you can use UIInterpolatingMotionEffecto Give it a keypath and a min and max valueo Add it to any UIView – addMotionEffect


Motion Effects



§ Rather than subclassing, you can use UIInterpolatingMotionEffecto Give it a keypath and a min and max valueo Add it to any UIView – addMotionEffecto Use the new motionEffects property to "nd out what effects are applied to a view


Motion Effects



§ Rather than subclassing, you can use UIInterpolatingMotionEffecto Give it a keypath and a min and max valueo Add it to any UIView – addMotionEffecto Use the new motionEffects property to "nd out what effects are applied to a viewo removeMotionEffect to remove


Motion Effects




§ UIMotionEffectGroup holds collection


Motion Effects




§ UIMotionEffectGroup holds collectiono Use UIMotionEffect subclass so you can add to [UIView addMotionEffect]


Dynamics


Dynamics

§ Slide to get camera on lock screen


Dynamics

§ Slide to get camera on lock screeno Bounces and hits bottom of screen


Dynamics

§ Slide to get camera on lock screeno Bounces and hits bottom of screeno Simulated weight


Dynamics


§ Messages scroll a bit behind your "nger


Dynamics


§ Messages scroll a bit behind your "nger§ Implemented by UIDynamics


Dynamics



o A physics engine built into UIKit


Dynamics




§ Create a behavior


Dynamics




§ Create a behavioro Con"gure with items to animate


Dynamics




§ Create a behavioro Con"gure with items to animateo Add it to the view


Dynamics API Behaviors



§ UIAttachmentBehavior



§ UIAttachmentBehavioro Attaches two views together




§ UICollisionBehavior




§ UICollisionBehavioro Models collision with views or boundaries





§ UIGravityBehavior





§ UIGravityBehavioro Models gravity





§ UIGravityBehavioro Models gravityo 1000 points per second per second instead of Earth’s 9.8m per second per second






§ UIPushBehavior






§ UIPushBehavioro Apply forces to views







§ UISnapBehavior







§ UISnapBehavioro Snap to point








§ UIDynamicItemBehavior








§ UIDynamicItemBehavioro Access to low-level properties of an item in Dynamics


State Restoration


State Restoration

§ You can now register arbitrary objects to be part of state restoration


State Restoration

§ You can now register arbitrary objects to be part of state restorationo [UIApplication registerObjectForStateRestoration:restorationIdenti"er:]


State Restoration


o Implement UIStateRestoration protocol


State Restoration



§ Snapshot handling


State Restoration



§ Snapshot handlingo iOS7 will use Snapshot on launch


State Restoration



§ Snapshot handlingo iOS7 will use Snapshot on launcho ignoreSnapshotOnNextApplicationLaunch


State Restoration




§ Other enhancements


State Restoration




§ Other enhancementso System Version/Timestamp keys


State Restoration




§ Other enhancementso System Version/Timestamp keyso Improved UITableView support


State Restoration




§ Other enhancementso System Version/Timestamp keyso Improved UITableView supporto UICollectionView support


State Restoration




§ Other enhancementso System Version/Timestamp keyso Improved UITableView supporto UICollectionView supporto Mail Activity Controller


Summary


Summary

§ To implement the UI changes in iOS7, Apple invested a considerable of amount of work in UIKit


Summary

§ To implement the UI changes in iOS7, Apple invested a considerable of amount of work in UIKit

§ Upside for developers is that creating interactive, engaging UIs is now even easier


3 whats-new-in-ios7-m3-uikit-slides

Technology

Transcript of 3 whats-new-in-ios7-m3-uikit-slides