Android Support Libraries

1. the android support libraries @KellyShuster

3. quick history @KellyShuster

4. 2011 @KellyShuster

5. 2011 @KellyShuster ★ v4 support library ★ v13 support library

9. 2013 @KellyShuster ★ v7 gridlayout ★ v7 appcompat ○ ActionBar ○ ActionBarActivity ★ V8 renderscript

11. 2014 @KellyShuster ★ v7 cardview ★ v7 recyclerview ★ v7 palette ★ v17 leanback ★ wear UI

13. 2015 @KellyShuster ★ annotations ★ design support ★ custom tabs support ★ percent support ★ app recommendation support (TV) ★ V7 preference support ★ V14 preference support ★ V17 preference support (TV)

15. 2016 @KellyShuster ★ vector drawable support ★ v4 library split ○ support-compat ○ support-core-utils ○ support-core-ui ○ support-media-compat ○ support-fragment ★ exifInterface support

17. 2017 @KellyShuster ★ dynamic animation ★ emoji compat

18. @KellyShuster ★ v4 support library ★ v13 support library ★ v7 gridlayout ★ v7 appcompat ★ V8 renderscript ★ v7 cardview ★ v7 recyclerview ★ v7 palette ★ v17 leanback ★ wear UI ★ annotations ★ design support ★ custom tabs support ★ percent support ★ app recommendation support (TV) ★ V7 preference support ★ V14 preference support ★ V17 preference support (TV) ★ vector drawable support ★ v4 library split ○ support-compat ○ support-core-utils ○ support-core-ui ○ support-media-compat ○ support-fragment ★ exifInterface support ★ dynamic animation ★ emoji compat

19. a few general tips @KellyShuster

20. appcompat-v7:25.1.0 @KellyShuster

23. appcompat-v7:25.1.0 @KellyShuster nope

24. dependencies { compile "com.android.support:appcompat-v7:25.1.0" compile "com.android.support:recyclerview-v7:25.1.0" compile "com.android.support:design:25.1.0" ... }

25. buildscript { ext.support_lib_version = '25.1.0' ... } dependencies { compile "com.android.support:appcompat-v7:25.1.0" compile "com.android.support:recyclerview-v7:25.1.0" compile "com.android.support:design:25.1.0" ... }

26. buildscript { ext.support_lib_version = '25.1.0' ... } dependencies { compile "com.android.support:appcompat-v7: $support_lib_version " compile "com.android.support:recyclerview-v7: $support_lib_version " compile "com.android.support:design: $support_lib_version " ... }

28. ./gradlew -q dependencies app:dependencies

31. beware stubbed methods! @KellyShuster

32. TextView textView = (TextView) findViewById(R.id.text); ViewCompat.setElevation(textView, elevationInPx);

33. TextView textView = (TextView) findViewById(R.id.text); ViewCompat.setElevation(textView, elevationInPx);

34. TextView textView = (TextView) findViewById(R.id.text); ViewCompat.setElevation(textView, elevationInPx); ★ no lint warning ★ no compile error ★ just doesn’t work on pre-21 :(

35. popular components @KellyShuster

36. appcompat-v7 ViewPager @KellyShuster

39. <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <android.support.v4.view.ViewPager android:id="@+id/vpager" android:layout_width="match_parent" android:layout_height="wrap_content"/> </LinearLayout> layout xml file

40. public class CustomPagerAdapter extends PagerAdapter { private ArrayList<String> myData; @Override public Object instantiateItem(ViewGroup container, int position) { FrameLayout flPage = (FrameLayout) LayoutInflater .from(container.getContext()) .inflate(R.layout.page_layout, null, false); TextView mytext = flPage.findViewById(R.id.pager_text); mytext.setText(strings.get(position)); container.addView(flPage); return flPage; } . . . } Custom pager adapter

41. public class CustomPagerAdapter extends PagerAdapter { . . . @Override public int getCount() { return myData.size(); } @Override public boolean isViewFromObject(View view, Object object) { return (view == object); } @Override public void destroyItem(ViewGroup container, int position, Object object){ ViewPager pager = (ViewPager) container; FrameLayout flPage = (FrameLayout) object; pager.removeView(flPage); } } custom pager adapter, cont’d.

42. PagerAdapter adapter = new CustomPagerAdapter(myData); ViewPager viewPager = findViewById(R.id.vpager); viewPager.setAdapter(adapter); activity java file

43. design TabLayout @KellyShuster

46. <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <android.support.design.widget.TabLayout android:id="@+id/tablayout" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="top"/> <android.support.v4.view.ViewPager android:id="@+id/vpager" android:layout_width="match_parent" android:layout_height="wrap_content"/> </LinearLayout> layout xml file

47. public class CustomPagerAdapter extends PagerAdapter { . . . @Override public CharSequence getPageTitle(int position) { return String.format("Title #%s", position); } . . . } custom pager adapter

48. PagerAdapter adapter = new CustomPagerAdapter(myData); ViewPager viewPager = findViewById(R.id.vpager); viewPager.setAdapter(adapter); TabLayout tabLayout = findViewById(R.id.tablayout); tabLayout.setupWithViewPager(viewPager, true); activity java file

49. appcompat-v7 Toolbar @KellyShuster

52.  <style name="AppTheme" parent="Theme.AppCompat.NoActionBar">  </style> styles xml file

53. <android.support.v7.widget.Toolbar android:id="@+id/t_toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:minHeight="?attr/actionBarSize"> <LinearLayout> <ImageView /> <TextView /> </LinearLayout> </android.support.v7.widget.Toolbar> layout xml file

54. Toolbar toolbar = (Toolbar) findViewById(R.id.t_toolbar); setSupportActionBar(toolbar); activity java file

55. design CoordinatorLayout @KellyShuster

57. <android.support.design.widget.CoordinatorLayout>  <android.support.design.widget.AppBarLayout> <android.support.design.widget.CollapsingToolbarLayout> <include layout="@layout/view_toolbar_image" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout>  <android.support.v4.widget.NestedScrollView> <LinearLayout/> </android.support.v4.widget.NestedScrollView> </android.support.design.widget.CoordinatorLayout>

62. <android.support.design.widget.CoordinatorLayout>  <android.support.design.widget.AppBarLayout> <android.support.design.widget.CollapsingToolbarLayout app:layout_scrollFlags="scroll|enterAlways" app:contentScrim="?attr/colorPrimary"> <include layout="@layout/view_toolbar_image" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout>  <android.support.v4.widget.NestedScrollView android:fillViewport="true" app:layout_behavior="@string/appbar_scrolling_view_behavior"> <LinearLayout> </android.support.v4.widget.NestedScrollView> </android.support.design.widget.CoordinatorLayout>

65. design FloatingActionButton Snackbar

67. <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="56dp" android:layout_height="56dp" android:layout_gravity="bottom|right" android:layout_margin="16dp"/>

68. <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="56dp" android:layout_height="56dp" android:layout_gravity="bottom|right" android:layout_margin="16dp"/>

69. FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab); fab.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Snackbar.make( view, "Yay, I love 360|AnDev!", Snackbar.LENGTH_SHORT) .show(); } });

74. <android.support.design.widget.CoordinatorLayout> <LinearLayout> <TextView /> </LinearLayout> <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="56dp" android:layout_height="56dp" android:layout_gravity="bottom|right" android:layout_margin="16dp"/> </android.support.design.widget.CoordinatorLayout>

75. <android.support.design.widget.CoordinatorLayout> <LinearLayout> <TextView /> </LinearLayout> <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="56dp" android:layout_height="56dp" android:layout_gravity="bottom|right" android:layout_margin="16dp"/> </android.support.design.widget.CoordinatorLayout>

76. design TextInputLayout

78. <android.support.design.widget.TextInputLayout android:id="@+id/til_first_name" style="@style/Theme.TextInputLayout" android:layout_width="match_parent" android:layout_height="wrap_content" app:errorTextAppearance="@style/Theme.TextInputLayoutError"> <TextInputEditText android:id="@+id/tiet_first_name" style="@style/Theme.EditText.NewStyle" android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="@string/common_hint_first_name" android:imeOptions="actionNext" android:inputType="textPersonName"/> </android.support.design.widget.TextInputLayout>

82. <style name="Theme.TextInputLayout" parent="TextAppearance.AppCompat">  <item name="android:textColorHint">@color/gray_94</item> <item name="android:textColor">@color/gray_94</item>  <item name="hintTextAppearance">@style/Theme.Text.Subhead.Reg.94</item> </style> styles

83. <style name="Theme.TextInputLayoutError" parent="TextAppearance.AppCompat"> <item name="android:textColor">@color/darkest_pink</item> </style> styles

84. <style name="Theme.EditText.NewStyle" parent="Theme.AppCompat.Light.DarkActionBar">  <item name="colorControlNormal">@color/gray_cb</item>  <item name="colorControlActivated">@color/gray_cb</item> <item name="android:textColor">@color/gray_4a</item> <item name="android:textColorHighlight">@color/gray_cb</item> . . . </style> styles

85. @Override public void setFirstNameInputStateValid() { tilFirstName.setError(null); tilFirstName.setErrorEnabled(false); } @Override public void setFirstNameInputStateError() { tilFirstName.setErrorEnabled(true); tilFirstName.setError(getString( R.string.common_invalid_first_name)); }

93. percent PercentRelativeLayout

94. <android.support.percent.PercentRelativeLayout android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/centered_image_2" android:layout_gravity="center" android:contentDescription="Android Robot" android:src="@mipmap/ic_launcher" app:layout_heightPercent="30%" app:layout_widthPercent="50%"/> </android.support.percent.PercentRelativeLayout>

95. <android.support.percent.PercentRelativeLayout android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/centered_image_2" android:layout_gravity="center" android:contentDescription="Android Robot" android:src="@mipmap/ic_launcher" app:layout_heightPercent="30%" app:layout_widthPercent="50%"/> </android.support.percent.PercentRelativeLayout>

97. constraint-layout ConstraintLayout

99. <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Constraint Layout Demo" app:layout_constraintTop_toTopOf="parent" android:layout_marginTop="8dp" app:layout_constraintBottom_toBottomOf="parent" android:layout_marginBottom="8dp" android:layout_marginRight="8dp" app:layout_constraintRight_toRightOf="parent" android:layout_marginLeft="8dp" app:layout_constraintLeft_toLeftOf="parent"/> </android.support.constraint.ConstraintLayout>

100. support-vector-drawable vector

104. <vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="24dp" android:height="24dp" android:viewportWidth="24.0" android:viewportHeight="24.0"> <path android:fillColor="#FF000000" android:pathData="M6,18c0,0.55 0.45,1 1,1h1v3.5c0,0.83 0.67,1.5 1.5,1.5s1.5,-0.67 1.5,-1.5L11,19h2v3.5c0,0.83 0.67,1.5 1.5,1.5s1.5,-0.67 1.5,-1.5L16,19h1c0.55,0 1,-0.45 1,-1L18,8L6,8v10zM3.5,8C2.67,8 2,8.67 2,9.5v7c0,0.83 0.67,1.5 1.5,1.5S5,17.33 5,16.5v-7C5,8.67 4.33,8 3.5,8zM20.5,8c-0.83,0 -1.5,0.67 -1.5,1.5v7c0,0.83 0.67,1.5 1.5,1.5s1.5,-0.67 1.5,-1.5v-7c0,-0.83 -0.67,-1.5 -1.5,-1.5zM15.53,2.16l1.3,-1.3c0.2,-0.2 0.2,-0.51 0,-0.71 -0.2,-0.2 -0.51,-0.2 -0.71,0l-1.48,1.48C13.85,1.23 12.95,1 12,1c-0.96,0 -1.86,0.23 -2.66,0.63L7.85,0.15c-0.2,-0.2 -0.51,-0.2 -0.71,0 -0.2,0.2 -0.2,0.51 0,0.71l1.31,1.31C6.97,3.26 6,5.01 6,7h12c0,-1.99 -0.97,-3.75 -2.47,-4.84zM10,5L9,5L9,4h1v1zM15,5h-1L14,4h1v1z"/> </vector>

105. <vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="24dp" android:height="24dp" android:viewportWidth="24.0" android:viewportHeight="24.0"> <path android:fillColor="#FF000000" android:pathData="M6,18c0,0.55 0.45,1 1,1h1v3.5c0,0.83 0.67,1.5 1.5,1.5s1.5,-0.67 1.5,-1.5L11,19h2v3.5c0,0.83 0.67,1.5 1.5,1.5s1.5,-0.67 1.5,-1.5L16,19h1c0.55,0 1,-0.45 1,-1L18,8L6,8v10zM3.5,8C2.67,8 2,8.67 2,9.5v7c0,0.83 0.67,1.5 1.5,1.5S5,17.33 5,16.5v-7C5,8.67 4.33,8 3.5,8zM20.5,8c-0.83,0 -1.5,0.67 -1.5,1.5v7c0,0.83 0.67,1.5 1.5,1.5s1.5,-0.67 1.5,-1.5v-7c0,-0.83 -0.67,-1.5 -1.5,-1.5zM15.53,2.16l1.3,-1.3c0.2,-0.2 0.2,-0.51 0,-0.71 -0.2,-0.2 -0.51,-0.2 -0.71,0l-1.48,1.48C13.85,1.23 12.95,1 12,1c-0.96,0 -1.86,0.23 -2.66,0.63L7.85,0.15c-0.2,-0.2 -0.51,-0.2 -0.71,0 -0.2,0.2 -0.2,0.51 0,0.71l1.31,1.31C6.97,3.26 6,5.01 6,7h12c0,-1.99 -0.97,-3.75 -2.47,-4.84zM10,5L9,5L9,4h1v1zM15,5h-1L14,4h1v1z"/> </vector>

106. android { defaultConfig { . . . vectorDrawables.useSupportLibrary = true } } dependencies { . . . compile "com.android.support:support-vector-drawable:26.0.0" }

109. <ImageView android:id="@+id/imageView" android:layout_width="240dp" android:layout_height="280dp" android:layout_centerInParent="true" app:srcCompat="@drawable/ic_android_black_24dp"/>

110. <ImageView android:id="@+id/imageView" android:layout_width="240dp" android:layout_height="280dp" android:layout_centerInParent="true" app:srcCompat="@drawable/ic_android_black_24dp"/>

111. ImageView ivBugDroid = (ImageView) findViewById(imageView); ivBugDroid.setImageDrawable(AppCompatResources.getDrawable( this, R.drawable.ic_android_black_24dp));

112. ImageView ivBugDroid = (ImageView) findViewById(imageView); ivBugDroid.setImageDrawable(AppCompatResources.getDrawable( this, R.drawable.ic_android_black_24dp));

113. <ImageView android:id="@+id/imageView" android:layout_width="240dp" android:layout_height="280dp" android:layout_centerInParent="true" android:src="@drawable/ic_android_black_24dp"/>

116. 25.0.0 to 25.3.1 @KellyShuster

117. support-v7 ArraySet

118. ArraySet @KellyShuster ★ previously only available in API 23+

119. ArraySet @KellyShuster ★ previously only available in API 23+ ★ now in v4 lib as of 25.1.0

120. ArraySet @KellyShuster ★ previously only available in API 23+ ★ now in v4 lib as of 25.1.0 ★ more efficient than traditional HashSet

121. ArraySet @KellyShuster ★ previously only available in API 23+ ★ now in v4 lib as of 25.1.0 ★ more efficient than traditional HashSet ★ similar to ArrayMap, but contains only 1 item per entry

122. ArraySet @KellyShuster ★ previously only available in API 23+ ★ now in v4 Lib as of 25.1.0 ★ more efficient than traditional HashSet ★ similar to ArrayMap, but contains only 1 item per entry ★ not for large items (slower than HashSet) ○ hundreds of items == OK

123. ArraySet @KellyShuster ★ previously only available in API 23+ ★ now in v4 Lib as of 25.1.0 ★ more efficient than traditional HashSet ★ similar to ArrayMap, but contains only 1 item per entry ★ not for large items (slower than HashSet) ○ hundreds of items == OK ★ shrinks as items are removed ○ you have no control over shrinking

125. design BottomNavigationView

127. <android.support.design.widget.BottomNavigationView android:id="@+id/bottom_nav" android:layout_width="match_parent" android:layout_height="56dp" android:layout_alignParentBottom="true" app:menu="@menu/bottom_nav_items"/>

128. <android.support.design.widget.BottomNavigationView android:id="@+id/bottom_nav" android:layout_width="match_parent" android:layout_height="56dp" android:layout_alignParentBottom="true" app:menu="@menu/bottom_nav_items"/>

129. <?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/action_search" android:title="Search (black)" android:icon="@android:drawable/ic_menu_search" /> <item android:id="@+id/action_camera" android:title="Camera (blue)" android:icon="@android:drawable/ic_menu_camera" /> <item android:id="@+id/action_email" android:title="Email (red)" android:icon="@android:drawable/ic_dialog_email" /> </menu>

130. <?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/action_search" android:title="Search (black)" android:icon="@android:drawable/ic_menu_search" /> <item android:id="@+id/action_camera" android:title="Camera (blue)" android:icon="@android:drawable/ic_menu_camera" /> <item android:id="@+id/action_email" android:title="Email (red)" android:icon="@android:drawable/ic_dialog_email" /> </menu>

131. BottomNavigationView bottomNav = (BottomNavigationView) findViewById(R.id.bottom_nav); bottomNav.setOnNavigationItemSelectedListener( new BottomNavigationView.OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(@NonNull MenuItem item) { switch (item.getItemId()) { case R.id.action_search: ivBugDroid.setImageDrawable(...); return true; case R.id.action_camera: ivBugDroid.setImageDrawable(...); return true; case R.id.action_email: ivBugDroid.setImageDrawable(...); return true; } return false; } });

135. what’s new in support 26 @KellyShuster

136. API 14+

137. maven support @KellyShuster

138. buildscript { repositories { jcenter() } dependencies { classpath 'com.android.tools.build:gradle:2.3.3' } } allprojects { repositories { jcenter() maven { url "https://maven.google.com" } } }

141. fonts @KellyShuster

143. <TextView android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/button_constraint" android:layout_margin="10dp" android:fontFamily="@font/bellefair_regular" android:text="This is fancy stuff!" android:textSize="24dp" android:visibility="visible"/>

144. <TextView android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/button_constraint" android:layout_margin="10dp" android:fontFamily="@font/bellefair_regular" android:text="This is fancy stuff!" android:textSize="24dp" android:visibility="visible"/>

145. TextView textView2 = (TextView) findViewById(R.id.text2); Typeface tfBelleFair = ResourcesCompat.getFont( this, R.font.bellefair_regular); textView2.setTypeface(tfBelleFair);

146. TextView textView2 = (TextView) findViewById(R.id.text2); Typeface tfBelleFair = ResourcesCompat.getFont( this, R.font.bellefair_regular); textView2.setTypeface(tfBelleFair);

147. font families @KellyShuster

148. <font-family xmlns:app="http://schemas.android.com/apk/res-auto"> <font app:font="@font/bellefair_regular" app:fontStyle="normal" app:fontWeight="400"/> </font-family>

149. <style name="customfontstyle" parent="@android:style/TextAppearance.Small"> <item name="android:fontFamily">@font/bellefair_regular</item> </style>

150. <TextView android:id="@+id/text2" style="@style/customfontstyle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/text" android:layout_margin="10dp" android:text="This is regular stuff" android:textSize="24dp" android:visibility="visible"/>

151. autoscale TextView @KellyShuster

152. <TextView android:layout_width="wrap_content" android:layout_height="100dp" android:text="Layout Height 100dp" app:autoSizeMaxTextSize="100sp" app:autoSizeMinTextSize="12sp" app:autoSizeStepGranularity="2sp" app:autoSizeTextType="uniform"/> <TextView android:layout_width="wrap_content" android:layout_height="10dp" android:text="Layout Height 10dp" app:autoSizeMaxTextSize="100sp" app:autoSizeMinTextSize="12sp" app:autoSizeStepGranularity="2sp" app:autoSizeTextType="uniform"/>

159. findViewById @KellyShuster

160. All instances of the findViewById() method now return <T extends View> T instead of View

163. thank you! @KellyShuster

164. Resources ● Coordinator Layout https://medium.com/google-developers/intercepting-everything-with-coordinatorlayout-behaviors-8c6adc140c26 ● Huyen Tue Dao “Cool Constraint Layout”https://www.youtube.com/watch?v=Xx4aRI3oQbM ● Bottom Navigation View flow https://material.io/guidelines/components/bottom-navigation.html# ● Google IO What’s New in Support Library 2017https://www.youtube.com/watch?v=V6-roIeNUY0

165. References ● Royal Gorge Bridge http://royalgorgebridge.com/ ● Snackbar gif https://material.io/guidelines/components/snackbars-toasts.html#snackbars-toasts-usage ● TextInputLayout Images https://stackoverflow.com/questions/35775919/edittext-added-is-not-a-textinputedittext-please-switch-to-us ing-that-class-ins ● Crying Pikachu gif https://giphy.com/search/sad-pikachu ● Ice Cream Sandwich http://cookdiary.net/ice-cream-sandwich/ ● Happy Pokemon gif http://rebloggy.com/post/gif-pikachu-pokemon-happy-good-yay-aww-yes-jump-shiny-togepi-bulbasaur-jumping-g/ 77419268976 ● SVG icon http://www.clker.com/clipart-336030.html

Android Support Libraries

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Ähnlich wie Android Support Libraries

Ähnlich wie Android Support Libraries (20)

Mehr von Kelly Shuster

Mehr von Kelly Shuster (8)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

Android Support Libraries