I have been working on an app using material design. I am completely new to this. I have been looking this tutorial for reference material design . But I am not getting "settings" option displayed in the top right corner of the toolbar. The toolbar is getting displayed but not the "3 dots settings" button . I am following the same as per the tutorial but I don't know why the settings is not getting displayed.
Here is my styles.xml code:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="AppTheme.Base">
<!-- Customize your theme here. -->
</style>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light">
</style>
</resources>
and my styles.xml(v-21) code:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppTheme" parent="AppTheme.Base">
</style>
My build.gradle looks like this:
apply plugin: 'com.android.application'
android {
compileSdkVersion 21
buildToolsVersion "21.0.1"
defaultConfig {
applicationId "app.xxx.yyy.myapplication"
minSdkVersion 15
targetSdkVersion 21
versionCode 1
versionName "1.0"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
testCompile 'junit:junit:4.12'
compile 'com.android.support:appcompat-v7:21.0.+'
}
I have attached the image of the result I am getting. Please help me get through it!
I don't think the problem comes from material stuff but the toolbar or option menus. You should share your mainActivity code if possible.
check ur code with it...
menu.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.example.toolbar.MainActivity" >
<item
android:id="#+id/action_settings"
android:orderInCategory="100"
android:title="#string/action_settings"
app:showAsAction="ifRoom"/>
</menu>
MainActivity.java
public class MainActivity extends ActionBarActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar);
setSupportActionBar(toolbar);
// toolbar.setNavigationIcon(R.drawable.back);
toolbar.setLogo(R.drawable.ic_launcher);
//toolbar.setTitle("Title");
// toolbar.setSubtitle("Subtitle");
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.toolbar.MainActivity" >
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/my_awesome_toolbar"
android:layout_width="fill_parent"
android:layout_height="128dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:theme="#style/ActionBarThemeOverlay">
</android.support.v7.widget.Toolbar>
</RelativeLayout>
Related
I'm trying to use Android ActionBar in my app, and have an option that's hidden away in the overflow menu.
There's a lot of documentation out there, but it's confusing because most of it is only relevant to very old versions of Android, and when you try applying the same concepts, they don't work anymore or work differently.
This is in my Activity layout
<android.support.v7.widget.Toolbar
android:id="#+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:titleTextColor="#android:color/white"
android:background="#color/colorPrimary"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
And this is in my Activity's onCreate() method
// sets up activity toolbar
Toolbar myToolbar = (Toolbar) findViewById(R.id.my_toolbar);
setSupportActionBar(myToolbar);
myToolbar.showOverflowMenu();
myToolbar.setTitleTextColor(R.color.lightPrimaryText);
I've also tried inflating a menu xml file from the onCreateOptionsMenu(), but that also didn't give me the results I wanted.
Define a Menu for your Toolbar in the res/menu resource folder, for example:
toolbar_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".activity.MainActivity">
<item
android:id="#+id/action_sign_out"
android:title="#string/toolbar_sign_out"
app:showAsAction="never"/>
</menu>
Setting app:showAsAction="never" ensures that this MenuItem will not be shown in the Toolbar, but placed in the overflow menu instead.
The theme of your Activity should be (or derive from) one of the NoActionBar themes (Theme.AppCompat.NoActionBar for example, or Theme.MaterialComponents.NoActionBar if you're using Material Components).
In your Activity, set up your Toolbar:
Toolbar myToolbar = (Toolbar) findViewById(R.id.my_toolbar);
setSupportActionBar(myToolbar);
And override onCreateOptionsMenu() to inflate your previously defined menu resource:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar_menu, menu);
return true;
}
You can override onOptionsItemSelected() to define the onClick behaviour of your MenuItem(s):
#Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.action_sign_out: {
// do your sign-out stuff
break;
}
// case blocks for other MenuItems (if any)
}
return true;
}
in manifest file declare
android:theme="#style/AppTheme.NoActionBar"
like this :
<activity
android:name=".ActivityName"
android:label="#string/label"
android:theme="#style/AppTheme.NoActionBar" />
and add this to your style :
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
and call this in Activity onCreate() :
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
override this method in activity:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.product_list, menu);
//U can find item set icon and stuff...
MenuItem item= menu.findItem(R.id.action_search);
return true;
}
and declare your menu like this for overflow menu:
<?xml version="1.0" encoding="utf-8"?>
<menu >
<group>
<item
android:id="#+id/sign_out"
android:title="#string/sign_out" />
<item
android:id="#+id/about"
android:title="#string/about" />
</group>
</menu>
and for handle item selection call this
#Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
switch (id) {
case R.id.sign_out:
//do stuff
break;
}
return super.onOptionsItemSelected(item);
}
done :)
Simple do This copy this code on your MainActivet`
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main2, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
Group gp=(Group)findViewById(R.id.order);
return true;
}
return super.onOptionsItemSelected(item);
}`
Now Make Directory file for menu name for this go on Android_Studio->app Folder->Right_Click->New->Directory-> Enter name menu now Create a xml file in there with menu2.xml name
and past this code on menu2.xml file
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/action_settings"
android:orderInCategory="100"
android:title="#string/action_settings"
app:showAsAction="never"
android:icon="#android:drawable/ic_input_add"
/>
</menu>
if any Query Please text me
No matter the screen size, the menu is always showing 3 dots instead of just showing a single icon on the right corner.
I have seen similar questions, but none of them without AppCompat.
I am using minSdkVersion 14 on my build.gradle file, and the following dependencies:
compile 'com.android.support:support-v4:23.1.1'
compile 'com.android.support:appcompat-v7:23.1.1'
compile 'com.android.support:support-v13:23.1.1'
Principal.Java relevant code:
import android.app.ActionBar;
public class Principal extends Activity {
protected void onCreate(Bundle savedInstanceState) {
ActionBar actionBar = getActionBar()
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowTitleEnabled(true);
actionBar.setDisplayUseLogoEnabled(false);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.options_menu, menu);
return true;
}
}
Here is my options_menu.xml:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/menu_general">
<item android:id="#+id/menu_search"
android:title="#string/search_label"
android:icon="#drawable/ic_action_search"/>
</menu>
Add this in the Method Oncreate:Change what u need
Toolbar topToolBar = (Toolbar)findViewById(R.id.toolbar);
setSupportActionBar(topToolBar);
topToolBar.setLogo(R.drawable.logo);
You should set the following property in your menuItem:
app:showAsAction="always"
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/menu_general">
<item android:id="#+id/menu_search"
android:title="#string/search_label"
app:showAsAction="always"
android:icon="#drawable/ic_action_search"/>
</menu>
I've been playing with Google's new design support library and it's a blast! I'm just a little stumped though on the navigation view. All the things I read say that the NavigationView is smart enough to handle transparent scrim on its own. (The android-developers post, for one; search for scrim). Anyway, when I tried to do it I get the following result:
Which is great; Exactly what I want. Except for one thing. When the drawer is closed, the scrim is an ugly dark grey, not my primaryColorDark . . .
Here's my layout:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true" >
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<LinearLayout
android:id="#+id/linear_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="#layout/toolbar" />
<fragment
android:id="#+id/fragment"
android:name="com.gmail.rixx.justin.envelopebudget.HomeFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:layout="#layout/fragment_home" />
</LinearLayout>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="end|bottom"
android:layout_margin="#dimen/fab_margin"
app:backgroundTint="#color/accent"
android:src="#drawable/ic_add_white_24dp" />
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/drawer_header"
app:menu="#menu/drawer" />
</android.support.v4.widget.DrawerLayout>
The Activity code:
public class Home extends ActionBarActivity {
private Toolbar mToolbar;
private DrawerLayout mDrawerLayout;
private Context mContext = this;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_home);
setUpToolbar();
setUpNavDrawer();
findViewById(R.id.fab).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
startActivity(new Intent(mContext, NewTransactionActivity.class));
}
});
}
private void setUpToolbar() {
mToolbar = (Toolbar) findViewById(R.id.toolbar);
if (mToolbar != null) {
setSupportActionBar(mToolbar);
}
}
private void setUpNavDrawer() {
if (mToolbar != null) {
mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
mToolbar.setNavigationIcon(R.drawable.ic_menu_white_24dp);
mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
mDrawerLayout.openDrawer(GravityCompat.START);
}
});
}
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_home, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
And v21/styles:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppTheme" parent="AppTheme.Base">
<item name="android:colorPrimary">#color/primary</item>
<item name="android:colorPrimaryDark">#color/primary_dark</item>
<item name="android:colorAccent">#color/accent</item>
<item name="android:textColorPrimary">#color/primary_text</item>
<item name="android:textColorSecondary">#color/secondary_text</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
</style>
</resources>
I modeled after Chris Banes's CheeseSquare app on github but I'm not getting the behavior I want.
I've tried removing the windowDrawsSystemBarBackgrounds and statusBarColor from v21/styles, and I get the proper color, but the status bar never goes transparent:
Help would be appreciated. This is new stuff, So I know we're all learning.
Thanks for reading!
-Justin
After struggling with this for several more hours, and copiously comparing my code to the cheesesquare app, I found the following: The DrawerLayout must have the attribute android:fitsSystemWindows="true", and the NavigationView as well, but the CoordinatorLayout should not. Once I made those changes, it worked.
Thanks all, and hopefully this is helpful to somebody!
You can look at my code for the layout here.
-Justin
set this to your navigationView android:fitsSystemWindows="false"
You should check newer SDK examples.
actually they are using Coordinatorlayout in activity that you want to draw under statusbar and have different theme for that layout, because if you put transparent statusbar for other activities where you don't have root layout Coordinatorlayout it will show white uncolored statusbar.
set this to your navigationView android:fitsSystemWindows="true" this will ensure that the navigation will be behind the statusbar and add colorAccent to your style in values folder.
In your style file try to use AppCompact theme as parent ...
<style name="AppTheme" parent="Base.Theme.AppCompat">
I hope it helps you..
I am trying to customize the look and feel of an action bar and it doesn't seem to work. The background is showing up grey when i am specifically setting it to a red.
my build.gradle
apply plugin: 'com.android.application'
android {
compileSdkVersion 22
buildToolsVersion "22.0.1"
defaultConfig {
applicationId "com.eliddell.rapsheet"
minSdkVersion 15
targetSdkVersion 22
versionCode 1
versionName "1.0"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
wearApp project(':wear')
compile 'com.android.support:appcompat-v7:22.0.0'
compile 'com.google.android.gms:play-services:7.0.0'
}
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light">
<!-- Customize your theme here. -->
</style>
<style name="CustomActionBarTheme"
parent="#style/AppTheme">
<item name="android:actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="#style/CustomActionBarTheme">
<item name="android:background">#color/red</item>
</style>
</resources>
manifest
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.eliddell.rapsheet" >
<application
android:allowBackup="true"
android:icon="#mipmap/ic_launcher"
android:label="#string/app_name"
android:theme="#style/CustomActionBarTheme" >
<activity
android:name=".MainActivity"
android:theme="#style/CustomActionBarTheme"
android:label="#string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
main activity
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
public class MainActivity extends ActionBarActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
if i update my styles to:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="android:Theme.Holo.Light">
<!-- Customize your theme here. -->
</style>
<style name="CustomActionBarTheme"
parent="#style/AppTheme">
<item name="android:actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="#android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/red</item>
</style>
</resources>
then i briefly see the color change but the app crashes:
Caused by: java.lang.IllegalStateException: You need to use a
Theme.AppCompat theme (or descendant) with this activity.
Ok so i figured it out and thank you all for your help. The problem was my styles xml was pointing to "android:background" and "android:actionBarStyle" but with the support library in place the "android:" gets dropped..
<resources>
<!-- Base application theme. -->
<style name="CustomActionBarTheme" parent="Theme.AppCompat.Light">
<!-- Customize your theme here. -->
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar" parent="Widget.AppCompat.ActionBar">
<item name="android:windowBackground">#color/sapient_heat</item>
<item name="background">#color/red</item>
</style>
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if (Build.VERSION.SDK_INT >= 11) {
requestWindowFeature(Window.FEATURE_ACTION_BAR);
} else {
requestWindowFeature(Window.FEATURE_NO_TITLE);
}
setContentView(R.layout.activity_main);
if (Build.VERSION.SDK_INT >= 11) {
ActionBar actionBar = this.getActionBar();
actionBar.setBackgroundDrawable(new ColorDrawable(Color
.parseColor("#ff0000")));
actionBar.show();
}
}
use ActionBar after SDK version 11,get the instance of ActionBar than do what ever u want
Use theme in android manifest as:
android:theme="#style/AppTheme"
and in activity extends it as
public class MainActivity extends ActionBarActivity{
Inflate custom view for action bar as:
// Inflate your custom layout
final ViewGroup actionBarLayout = (ViewGroup) getLayoutInflater().inflate(
R.layout.actionbar_layout,
null);
//Set Custom ActionBar
actionBar = getSupportActionBar();
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setCustomView(actionBarLayout);
where actionbar_layout is a layout xml for your actionbar
I am trying to show two icons in the actionbar, one of which is a menu with a few children. However, I am not able to. I have tested a few answers from other similar questions in SO but to no avail. Not even one icon is showing up. Here is the code. Thanks for your help.
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="com.semantic.semanticOrganizer.sem.activities.HomeActivity" >
<item android:id="#+id/viewTags"
android:icon="#drawable/ic_action_labels"
app:showAsAction="always"
android:title="Tags"
/>
<item
android:id="#+id/a_More"
android:icon="#drawable/ic_more_vert_white_36dp"
app:showAsAction="always"
android:title="More">
<menu>
<item android:id="#+id/action_view_notes"
android:title="Notes"
android:orderInCategory="100"
app:showAsAction="never" />
<item android:id="#+id/action_view_habits"
android:title="Habits"
android:orderInCategory="100"
app:showAsAction="never" />
<item android:id="#+id/action_view_checklists"
android:title="Checklists"
android:orderInCategory="100"
app:showAsAction="never" />
<item android:id="#+id/action_view_tags"
android:title="Tags"
android:orderInCategory="100"
app:showAsAction="never" />
<item android:id="#+id/action_settings"
android:title="#string/action_settings"
android:orderInCategory="100"
app:showAsAction="never" />
</menu>
</item>
</menu>
Java Code
public class HomeActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_home);
stuffWhichDoesNotInvolveGettingActionBar();
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu items for use in the action bar
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.home, menu);
return super.onCreateOptionsMenu(menu);
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
if (id == R.id.action_view_tags) {
return true;
}
if (id == R.id.action_view_notes) {
return true;
}
if (id == R.id.action_view_checklists) {
return true;
}
if (id == R.id.action_view_habits) {
return true;
}
return super.onOptionsItemSelected(item);
}
private void stuffWhichDoesNotInvolveGettingActionBar(){
//Code
}
Edit: As Neutrino suggested, I tried to shift to appCompat Theme. But then this error showed up on Win64 machine. Resource not found error to the attribute "actionModeShareDrawable". I changed the compileSdkVersion to 21 and it dint work. So, I might have to do it without AppCompat for now. I am currently using Holo. So please suggest a fix for Holo theme.
Edit
I found a work around for the error I mentioned by using v20 of the support library instead of v21 since I found out that Gradle 2.3 build system is not around in Android yet and the bug was only fixed in that version (A Bug Fixed Jar of Groovy 2.3.5 was released). Then I was able to use ActionBarActivity and now the action bar icons are visible. Thanks everyone and especially Quark.
Extend ActionBarActivity instead of Activity, ie make
public class HomeActivity extends Activity
as
public class HomeActivity extends ActionBarActivity
EDIT
ActionBarActivity is now deprecated to support toolbar. To use toolbar, use -
public class HomeActivity extends AppCompatActivity
Be sure to include the latest version of support library in build.gradle (Module: app) -
dependencies {
compile 'com.android.support:appcompat-v7:22.1.1'
}
Read more about toolbar and AppCompatActivity here, here and here.
I tried compiling your code and the following worked for me.
Replace app:showAsAction with android:showAsAction for all the menu items for which you want an icon to appear.