SlideShare une entreprise Scribd logo
1  sur  24
ActionBarCompat Tutorial
Part 1-Prepare and Setup
http://www.mobiletuts.me
Mobiletuts.me@gmail.com
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Action Bar
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
The action bar is a window feature that
identifies the user location, and provides user
actions and navigation modes. Using the action
bar offers your users a familiar interface across
applications that the system gracefully adapts
for different screen configurations.
Figure 1. An action bar that includes the [1] app icon, [2]
two action items, and [3] action overflow.
The action bar provides several key functions:
Provides a dedicated space for giving your app an identity and indicating the user's
location in the app.
Makes important actions prominent and accessible in a predictable way (such as
Search).
Supports consistent navigation and view switching within apps (with tabs or drop-
down lists).
ActionBarActivity or Activity?
If you want to set title , logo, navigation modes for an ActionBar, you need to get a reference to
ActionBar.
With sdk level higher than 11 (>=11), you can directly call getActionBar() in an Activity to fetch a
reference of ActionBar which you can configure.
For sdk level lower than 11 (<=10), however, getActionBar is not supported in an Activity.
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
ActionBarActivity or Activity?
Google Android team released a new backward-compatible Action Bar
implementation called ActionBarCompat that‘s part of the Support Library r18 during
I/O 2013 . The ActionBarCompat APIs let you build the essential Action Bar design
pattern into your app, with broad compatibility back to Android 2.1 (sdk7).
ActionBarActivity (android.support.v7.app.ActionBarActivity) and ActionBar
(android.support.v7.app.ActionBar) was introduced within ActionBarCompat, which
can be used essentially as same as Activity with ActionBar features in sdk levels higher
than 11.
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
ActionBarActivity for Backward Compatibility
Therefore use ActionBarActivity if you need to use ActionBar while supporting sdk
level lower than 11.
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Get Started with ActionBarCompat
ActionBarCompat is a new API in the Android Support Library that allows you to add
an Action Bar to applications targeting minSdkVersion 7 or greater. The API and
integration have been designed to closely mirror the existing framework APIs, giving
you an easy migration path for your existing apps.
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Add ActionBarCompat as a project dependency
1. Android Studio or Eclipse+ADT go to Tools->Android->SDK Manager
2. Check if the Android Support Library (revision 18) has been installed.
The version of Android support library ( Revision 18 ) is released with a new library called appcompat
under the package android.support.v7.The new library facilitates users to implement action bar back
up to Android 2.1 ( API Level 7 ) .
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Adding ActionBarCompat support library
Eclipse
Make sure you have downloaded the Android Support Library using the SDK Manager.
Create a libs/ directory in the root of your application project.
Copy the JAR files from your Android SDK installation directory
/extras/android/support/v7/appcompat/libs/android-support-v4.jar
/extras/android/support/v7/appcompat/libs/android-support-v7-appcompat.jar
into your application's project libs/ directory.
Right click the JAR file and select Build Path > Add to Build Path.
Android Studio
Make sure you have downloaded the Android Support Repository using the SDK Manager.
Open the build.gradle file for your application.
Add the support library to the dependencies section. For example, to add the v7 appcompat
library, add the following lines:
dependencies {
…
compile 'com.android.support:appcompat-v7:18.0.0'
}
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Create New Android Project
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Create New Android Project
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Dependency
The Gradle build script dependency identifier for this library is as follows:
com.android.support:appcompat-v7:18.0.0+
This dependency notation specifies the release version 18.0.0 or higher.
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
When using default Activity
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Default Activity support ActionBar on level higher
than API 11
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Running on API17
Use ActionBarActivity for Backward Compatibility
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Using ActionBarActivity instead of
Activity
Done? Not yet, if you compile and run now, you will run into fata error caused
by theme setting.
Error Caused by Theme Setting
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
This is cause by theme setting. When using ActionBarCompat, you can only use a
Theme.AppCompat theme or its descendant (for customized theme).
Update Style Resources
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
The first things to update are your Activity themes so they use a Theme.AppCompat
theme. If you're currently using one of the Theme.Holo themes then just replace this
with the related Theme.AppCompat theme. For instance if you have the following in
your AndroidManifest.xml:
<activity
...
android:theme="@android:style/Theme.Holo" />
You would change it to:
<activity
...
android:theme="@style/Theme.AppCompat" />
UseTheme.AppCompat theme or its descendant
Update Style Resources
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
UseTheme.AppCompat theme or its descendant
If you don’t want to change your activities’ theme setting one by one, you can
change the theme setting for application in AndroidManifest.xml:
<application
android:allowBackup="true"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme">
<style name="AppBaseTheme" parent="android:Theme.Light">
</style>
<!-- Application theme. Which is a decendant of Theme.App -->
<style name="AppTheme" parent="AppBaseTheme">
</style>
Becareful with values-v11/14
When you update the style resource files, do update all the styles.xml in values folder
and the possible values-v11 and values-v14 folder. Cause your app may load styles.xml
file in values-v1X folder according to target Android API level!
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Try again, it works now!
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Running on API17
Add More Actions on Action Bar
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
In the following sections, I will show how to add
Actions such as Search to Action Bar.
You can download these icons which you can use
for Actions from Download the Action Bar Icon
Pack
Then copy the icons you need to drawable
folders. Here I copied 2_action_search.png files
to drawable-hdpi, drawable-xhdpi and drawable-
mdpi folders.
Structure of Action Bar Icon Pack
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Modify Menu Resources
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
As with the standard Action Bar in Android 3.0 and later versions, action items are
added via the options menu. The difference with ActionBarCompat is that you need to
modify your Menu resource files so that any action item attributes come from
ActionBarCompat's XML namespace.
Now, you did it.
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
Compile and run again.
Running on API 17
Running on API 7
To be continued
• In next tutorial, I will show you how to
1. Configure menu items;
2. Add menu items callback (how to interact
with user through Action Bar);
3. Something else 
10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com

Contenu connexe

Tendances

Python Ireland Nov 2009 Talk - Appengine
Python Ireland Nov 2009 Talk - AppenginePython Ireland Nov 2009 Talk - Appengine
Python Ireland Nov 2009 Talk - Appengine
Python Ireland
 
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
Andy Maleh
 

Tendances (19)

Mule Integration with Atlassian JIRA
Mule Integration with Atlassian JIRAMule Integration with Atlassian JIRA
Mule Integration with Atlassian JIRA
 
What are The Top Features of Angular 7?
What are The Top Features of Angular 7?What are The Top Features of Angular 7?
What are The Top Features of Angular 7?
 
Android Widget
Android WidgetAndroid Widget
Android Widget
 
03 asp.net session04
03 asp.net session0403 asp.net session04
03 asp.net session04
 
How to increase the ui performance of apps designed using react
How to increase the ui performance of apps designed using react How to increase the ui performance of apps designed using react
How to increase the ui performance of apps designed using react
 
Rest With Raml
Rest With RamlRest With Raml
Rest With Raml
 
Write Your iOS App in Swift with a Graph Database
Write Your iOS App in Swift with a Graph DatabaseWrite Your iOS App in Swift with a Graph Database
Write Your iOS App in Swift with a Graph Database
 
GDG Oslo: Hidden Android features
GDG Oslo: Hidden Android featuresGDG Oslo: Hidden Android features
GDG Oslo: Hidden Android features
 
Python Ireland Nov 2009 Talk - Appengine
Python Ireland Nov 2009 Talk - AppenginePython Ireland Nov 2009 Talk - Appengine
Python Ireland Nov 2009 Talk - Appengine
 
Anypoint platform for API's glossary
Anypoint platform for API's glossaryAnypoint platform for API's glossary
Anypoint platform for API's glossary
 
Life After Mobilegeddon: App Deep Linking Strategies - Pubcon October 2015
Life After Mobilegeddon: App Deep Linking Strategies - Pubcon October 2015Life After Mobilegeddon: App Deep Linking Strategies - Pubcon October 2015
Life After Mobilegeddon: App Deep Linking Strategies - Pubcon October 2015
 
Google Firebase
Google FirebaseGoogle Firebase
Google Firebase
 
26 top angular 8 interview questions to know in 2020 [www.full stack.cafe]
26 top angular 8 interview questions to know in 2020   [www.full stack.cafe]26 top angular 8 interview questions to know in 2020   [www.full stack.cafe]
26 top angular 8 interview questions to know in 2020 [www.full stack.cafe]
 
6 Reasons Why You Should Create React Native Apps For Your Enterprise in 2021
6 Reasons Why You Should Create React Native Apps For Your Enterprise in 20216 Reasons Why You Should Create React Native Apps For Your Enterprise in 2021
6 Reasons Why You Should Create React Native Apps For Your Enterprise in 2021
 
12 asp.net session17
12 asp.net session1712 asp.net session17
12 asp.net session17
 
Managing Mobile Apps: A PhoneGap Enterprise Introduction for Marketers
Managing Mobile Apps: A PhoneGap Enterprise Introduction for MarketersManaging Mobile Apps: A PhoneGap Enterprise Introduction for Marketers
Managing Mobile Apps: A PhoneGap Enterprise Introduction for Marketers
 
EVOLVE'14 | Enhance | John Fait | Add Analytics To Your AEM Apps
EVOLVE'14 | Enhance | John Fait | Add Analytics To Your AEM AppsEVOLVE'14 | Enhance | John Fait | Add Analytics To Your AEM Apps
EVOLVE'14 | Enhance | John Fait | Add Analytics To Your AEM Apps
 
Summit 2015: Mobile App Dev and Content Management with Adobe Experience Manager
Summit 2015: Mobile App Dev and Content Management with Adobe Experience ManagerSummit 2015: Mobile App Dev and Content Management with Adobe Experience Manager
Summit 2015: Mobile App Dev and Content Management with Adobe Experience Manager
 
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
Revised Rails Engine Patterns for Montreal.rb meetup Oct 16, 2012
 

Similaire à ActionBarCompat Tutorial-Part 1(Prepare and Setup)

Android Development project
Android Development projectAndroid Development project
Android Development project
Minhaj Kazi
 

Similaire à ActionBarCompat Tutorial-Part 1(Prepare and Setup) (20)

Chapter 2 lesson-1 adding the action bar
Chapter 2 lesson-1 adding the action barChapter 2 lesson-1 adding the action bar
Chapter 2 lesson-1 adding the action bar
 
Android ui with xml
Android ui with xmlAndroid ui with xml
Android ui with xml
 
Beginning Native Android Apps
Beginning Native Android AppsBeginning Native Android Apps
Beginning Native Android Apps
 
Android Development Basics
Android Development BasicsAndroid Development Basics
Android Development Basics
 
Native Android Development Practices
Native Android Development PracticesNative Android Development Practices
Native Android Development Practices
 
ANGULAR JS LAB MANUAL(final) vtu2021 sch
ANGULAR JS LAB MANUAL(final) vtu2021 schANGULAR JS LAB MANUAL(final) vtu2021 sch
ANGULAR JS LAB MANUAL(final) vtu2021 sch
 
Android Development project
Android Development projectAndroid Development project
Android Development project
 
Training Session 2 - Day 2
Training Session 2 - Day 2Training Session 2 - Day 2
Training Session 2 - Day 2
 
Compose camp 4.pptx
Compose camp 4.pptxCompose camp 4.pptx
Compose camp 4.pptx
 
Quickly Build a Native Mobile App for Your Community Using Salesforce Mobile SDK
Quickly Build a Native Mobile App for Your Community Using Salesforce Mobile SDKQuickly Build a Native Mobile App for Your Community Using Salesforce Mobile SDK
Quickly Build a Native Mobile App for Your Community Using Salesforce Mobile SDK
 
Quickly Build a Native Mobile App for your Community using Salesforce Mobile SDK
Quickly Build a Native Mobile App for your Community using Salesforce Mobile SDKQuickly Build a Native Mobile App for your Community using Salesforce Mobile SDK
Quickly Build a Native Mobile App for your Community using Salesforce Mobile SDK
 
Life After Mobilegeddon: App Deep Linking Strategies - Pubcon October 2015
Life After Mobilegeddon: App Deep Linking Strategies - Pubcon October 2015Life After Mobilegeddon: App Deep Linking Strategies - Pubcon October 2015
Life After Mobilegeddon: App Deep Linking Strategies - Pubcon October 2015
 
Baparekraf Digital Talent Day: Monitoring dan Coaching Penerima Fasilitasi BD...
Baparekraf Digital Talent Day: Monitoring dan Coaching Penerima Fasilitasi BD...Baparekraf Digital Talent Day: Monitoring dan Coaching Penerima Fasilitasi BD...
Baparekraf Digital Talent Day: Monitoring dan Coaching Penerima Fasilitasi BD...
 
Migrating JavaME Apps to Android
Migrating JavaME Apps to AndroidMigrating JavaME Apps to Android
Migrating JavaME Apps to Android
 
Lecture 05. UI programming for Mobile Apps
Lecture 05. UI programming for Mobile AppsLecture 05. UI programming for Mobile Apps
Lecture 05. UI programming for Mobile Apps
 
Getting started with android programming
Getting started with android programmingGetting started with android programming
Getting started with android programming
 
React Native +Redux + ES6 (Updated)
React Native +Redux + ES6 (Updated)React Native +Redux + ES6 (Updated)
React Native +Redux + ES6 (Updated)
 
Beginning android
Beginning android Beginning android
Beginning android
 
How to Build a Hybrid App: A Detailed Outline
How to Build a Hybrid App: A Detailed Outline How to Build a Hybrid App: A Detailed Outline
How to Build a Hybrid App: A Detailed Outline
 
Android tutorial
Android tutorialAndroid tutorial
Android tutorial
 

Dernier

Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 

Dernier (20)

Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)
 
Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..Understanding the FAA Part 107 License ..
Understanding the FAA Part 107 License ..
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
WSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering DevelopersWSO2's API Vision: Unifying Control, Empowering Developers
WSO2's API Vision: Unifying Control, Empowering Developers
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Vector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptxVector Search -An Introduction in Oracle Database 23ai.pptx
Vector Search -An Introduction in Oracle Database 23ai.pptx
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
 

ActionBarCompat Tutorial-Part 1(Prepare and Setup)

  • 1. ActionBarCompat Tutorial Part 1-Prepare and Setup http://www.mobiletuts.me Mobiletuts.me@gmail.com 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 2. Action Bar 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com The action bar is a window feature that identifies the user location, and provides user actions and navigation modes. Using the action bar offers your users a familiar interface across applications that the system gracefully adapts for different screen configurations. Figure 1. An action bar that includes the [1] app icon, [2] two action items, and [3] action overflow. The action bar provides several key functions: Provides a dedicated space for giving your app an identity and indicating the user's location in the app. Makes important actions prominent and accessible in a predictable way (such as Search). Supports consistent navigation and view switching within apps (with tabs or drop- down lists).
  • 3. ActionBarActivity or Activity? If you want to set title , logo, navigation modes for an ActionBar, you need to get a reference to ActionBar. With sdk level higher than 11 (>=11), you can directly call getActionBar() in an Activity to fetch a reference of ActionBar which you can configure. For sdk level lower than 11 (<=10), however, getActionBar is not supported in an Activity. 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 4. ActionBarActivity or Activity? Google Android team released a new backward-compatible Action Bar implementation called ActionBarCompat that‘s part of the Support Library r18 during I/O 2013 . The ActionBarCompat APIs let you build the essential Action Bar design pattern into your app, with broad compatibility back to Android 2.1 (sdk7). ActionBarActivity (android.support.v7.app.ActionBarActivity) and ActionBar (android.support.v7.app.ActionBar) was introduced within ActionBarCompat, which can be used essentially as same as Activity with ActionBar features in sdk levels higher than 11. 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 5. ActionBarActivity for Backward Compatibility Therefore use ActionBarActivity if you need to use ActionBar while supporting sdk level lower than 11. 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 6. Get Started with ActionBarCompat ActionBarCompat is a new API in the Android Support Library that allows you to add an Action Bar to applications targeting minSdkVersion 7 or greater. The API and integration have been designed to closely mirror the existing framework APIs, giving you an easy migration path for your existing apps. 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 7. Add ActionBarCompat as a project dependency 1. Android Studio or Eclipse+ADT go to Tools->Android->SDK Manager 2. Check if the Android Support Library (revision 18) has been installed. The version of Android support library ( Revision 18 ) is released with a new library called appcompat under the package android.support.v7.The new library facilitates users to implement action bar back up to Android 2.1 ( API Level 7 ) . 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 8. Adding ActionBarCompat support library Eclipse Make sure you have downloaded the Android Support Library using the SDK Manager. Create a libs/ directory in the root of your application project. Copy the JAR files from your Android SDK installation directory /extras/android/support/v7/appcompat/libs/android-support-v4.jar /extras/android/support/v7/appcompat/libs/android-support-v7-appcompat.jar into your application's project libs/ directory. Right click the JAR file and select Build Path > Add to Build Path. Android Studio Make sure you have downloaded the Android Support Repository using the SDK Manager. Open the build.gradle file for your application. Add the support library to the dependencies section. For example, to add the v7 appcompat library, add the following lines: dependencies { … compile 'com.android.support:appcompat-v7:18.0.0' } 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 9. Create New Android Project 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 10. Create New Android Project 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 11. Dependency The Gradle build script dependency identifier for this library is as follows: com.android.support:appcompat-v7:18.0.0+ This dependency notation specifies the release version 18.0.0 or higher. 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 12. When using default Activity 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 13. Default Activity support ActionBar on level higher than API 11 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com Running on API17
  • 14. Use ActionBarActivity for Backward Compatibility 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com Using ActionBarActivity instead of Activity Done? Not yet, if you compile and run now, you will run into fata error caused by theme setting.
  • 15. Error Caused by Theme Setting 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com This is cause by theme setting. When using ActionBarCompat, you can only use a Theme.AppCompat theme or its descendant (for customized theme).
  • 16. Update Style Resources 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com The first things to update are your Activity themes so they use a Theme.AppCompat theme. If you're currently using one of the Theme.Holo themes then just replace this with the related Theme.AppCompat theme. For instance if you have the following in your AndroidManifest.xml: <activity ... android:theme="@android:style/Theme.Holo" /> You would change it to: <activity ... android:theme="@style/Theme.AppCompat" /> UseTheme.AppCompat theme or its descendant
  • 17. Update Style Resources 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com UseTheme.AppCompat theme or its descendant If you don’t want to change your activities’ theme setting one by one, you can change the theme setting for application in AndroidManifest.xml: <application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/AppTheme"> <style name="AppBaseTheme" parent="android:Theme.Light"> </style> <!-- Application theme. Which is a decendant of Theme.App --> <style name="AppTheme" parent="AppBaseTheme"> </style>
  • 18. Becareful with values-v11/14 When you update the style resource files, do update all the styles.xml in values folder and the possible values-v11 and values-v14 folder. Cause your app may load styles.xml file in values-v1X folder according to target Android API level! 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 19. Try again, it works now! 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com Running on API17
  • 20. Add More Actions on Action Bar 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com In the following sections, I will show how to add Actions such as Search to Action Bar. You can download these icons which you can use for Actions from Download the Action Bar Icon Pack Then copy the icons you need to drawable folders. Here I copied 2_action_search.png files to drawable-hdpi, drawable-xhdpi and drawable- mdpi folders.
  • 21. Structure of Action Bar Icon Pack 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com
  • 22. Modify Menu Resources 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com As with the standard Action Bar in Android 3.0 and later versions, action items are added via the options menu. The difference with ActionBarCompat is that you need to modify your Menu resource files so that any action item attributes come from ActionBarCompat's XML namespace.
  • 23. Now, you did it. 10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com Compile and run again. Running on API 17 Running on API 7
  • 24. To be continued • In next tutorial, I will show you how to 1. Configure menu items; 2. Add menu items callback (how to interact with user through Action Bar); 3. Something else  10/10/2013 Mobiletuts.me mobiletuts.me@gmail.com