ConstraintLayout has had the reputation of being very powerful but difficult to learn. Too many times have I talked to developers who were reluctant to use it in their designs because it was "too magical" and they couldn't understand what it was doing. Despite the learning curve, ConstraintLayout allows you to make your designs more responsive and ultimately make your UI code faster to render. It also includes some design features that allow you to more accurately implement your designer's work. In this session, you'll learn how to make sense of the features of ConstraintLayout.

1. 1

2. INTRODUCTION
I work at Udacity. I'm Curriculum Lead for Android.
2

3. OUR NANODEGREE PROGRAMS
Android Basics and Android
Also Data Analyst, Machine Learning, Web Dev, iOS
http://go.udacity.com/android
3

4. MATERIAL DESIGN FOR ANDROID
DEVELOPERS
https://www.udacity.com/course/material-design-for-
android-developers--ud862
4

5. AGENDA
A Quick Guide to Rendering
Pitfalls of Some Layout ViewGroups
Constraint Layout
More Awesomeness You Can Do With It
5

6. THE ANDROID VIEW CYCLE
Measure Pass
Layout Pass
Drawing the Things
6

7. MEASURING A VIEW
7

8. ONMEASURE(WIDTHMEASURESPEC,
HEIGHTMEASURESPEC)
8

9. MEASURESPEC
mode
size
9

10. MEASURESPEC MODES
EXACTLY
AT MOST
UNSPECIFIED
10

11. LAYOUT OF A VIEW
11

12. ONLAYOUT(CHANGED, L, T, R, B)
12

13. DOUBLE TAXATION
13

14. WHY IS THIS IMPORTANT?
14

15. 16MS
15

16. OKAY I'LL USE RELATIVELAYOUT
INSTEAD OF NESTED
LINEARLAYOUT
16

17. GRIDLAYOUT
17

18. CONSTRAINTLAYOUT
18

19. CONSTRAINTLAYOUT IS A SUPPORT
LIBRARY
19

20. SUPPORTED BACK TO API 9
(GINGERBREAD)
20

21. WHAT ARE CONSTRAINTS?
21

22. THE NEW LAYOUT EDITOR
Design View
Blueprint View
22

23. DESIGN VIEW
23

24. BLUEPRINT VIEW
24

25. ATTRIBUTES VIEW
25

26. CLEARING CONSTRAINTS
26

27. 27

28. 28

29. 29

30. ADDING CONSTRAINTS
30

31. 31

32. 32

33. 33

34. 34

35. 35

36. UNDERSTANDING THE NEW
ATTRIBUTES VIEW
36

37. 37

38. 38

39. 39

40. 40

41. MORE ABOUT MATCH_PARENT
41

42. 42

43. CHAINS
43

44. 44

45. 45

46. CHAIN STYLES
46

47. HOW MANY DESIGNERS IN THE
ROOM?
47

48. AND HOW MANY DEVELOPERS?
48

49. DESIGNERS AND DEVELOPERS
49

50. DESIGNERS
DESIGNERS sometimes design things that are:
hard to represent in the target platform
difficult to understand in static drawinds
50

51. DEVELOPERS
DEVELOPERS o en optimize for terseness
and will silently drop parts of the design they don't
understand
51

52. DEALING WITH MOCKS
52

53. 53

54. STRATEGIES TO CONVERT MOCKS TO A
REAL UI
54

55. SET MARGINS INDIVIDUALLY
55

56. PUT THEM IN ANOTHER LAYOUT
56

57. USE ANDROID.WIDGET.VIEW ELEMENTS
AS PLACEHOLDERS
57

58. ENTER VIRTUAL HELPER
OBJECTS
Guidelines
Barriers
Groups
58

59. GUIDELINES
59

60. 60

61. 61

62. BARRIERS
62

63. Congress
Volksvertretung
63

64. GROUPS
<android.support.constraint.Group
android:id="@+id/group"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="visible"
app:constraint_referenced_ids="button4,button9" />
64

65. MOAR STUFF
65

66. PLACEHOLDERS
66

67. SETCONTENTID(…)
67

68. CIRCULAR POSITIONING
68

69. 69

70. <Button android:id="@+id/buttonA" ... />
<Button android:id="@+id/buttonB" ...
app:layout_constraintCircle="@+id/buttonA"
app:layout_constraintCircleRadius="100dp"
app:layout_constraintCircleAngle="45" />
70

71. RECAP
Double Taxation is bad
Use Constraint Layout for nearly ALL THE THINGS
71

72. QUESTIONS?
72