How to add a Search to an action bar? - android

Here is my XML file:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#E0E0E0"
android:fitsSystemWindows="true"
tools:context="com.ccb.lldm.lldmhimnario.Cantos">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:elevation="25dp"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimaryDark"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_cantos" />
</android.support.design.widget.CoordinatorLayout>
Here is my Java:
public class Cantos extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_cantos);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setLogo(R.mipmap.ic_launcher);
toolbar.setTitle("Cantos");
toolbar.setTitleTextColor(getColor(R.color.colorPrimary));
}
}
I was wondering how to add a search to my action bar. So when I input characters, names/objects will come up. Thank you in advance. (Is my XML file correct too?)

Adding a search view is actually very easy in Android as it has inbuilt support for it. Go through the Search view functionality provided by android for more details.
http://developer.android.com/guide/topics/search/search-dialog.html

Visit below link, you will find easiest way to implement searchview in action bar
http://javapapers.com/android/android-searchview-action-bar-tutorial/

Related

SupportActionBar: How to change the title?

This Layout came from a Studio 3.5.1 template. I can't figure it out. But my question hopefully has an easy answer.
Here is the XML layout:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ChecklistActivity">
<androidx.viewpager.widget.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tabAppBarLayout"
android:theme="#style/AppTheme.AppBarOverlay">
<com.google.android.material.tabs.TabLayout
android:id="#+id/tabLayoutView"
app:tabMode="scrollable"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary" />
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
In my app Activity (Java), I would like to change the android:label="#string/app_name text (specified in the Activity Manifest) as it appears on the Activity header (appBar, toolBar, whatever it is). I have not been able to do that as of yet.
No, you cannot add or remove or alter anything in the manifest as the name says, it's a manifest file, which system reads when it installs your app.
If you are just trying to change the title you can use:
If you are using ActionBar:
getActionBar().setTitle(int titleId)
If you are extending AppCompatActivity:
getSupportActionBar().setTitle(int titleId)
For example:
public class ChecklistActivity extends AppCompatActivity {
#Override
public void onCreate(...) {
doMyTimerThing();
}
public void doMyTimerThing() {
onTick(long timeLeft) {
...(long to string here)...
getSupportActionBar().setTitle(timeToShowOnActionBar)
}
}
}
Set Up the app bar Android Dev Guide.
ActionBar vs SupportActionBar
ActionBar Docs
This is a simple implementation, If you want to have more control you over your ActionBar as your app progresses then you can use Toolbar. Toolbar has to be added to your XML.

Android CoordinatorLayout shows duplicated App Bar

Basically I created an Activity with a CoordinatorLayout, everything seems to be working. But there is 2 AppBars. One is empty (no text) and is shown on top of the activity. While the other one behaves as it should on the coordinator layout: initially just text, no background; and as you slide up it move to the top of the screen, and it gains a background (if this sounds confusing just look at the animation here.
This are screenshots of how it looks:
I tried using:
requestWindowFeature(Window.FEATURE_NO_TITLE);
and
supportRequestWindowFeature(Window.FEATURE_NO_TITLE);
But neither seems to have any effect on the layout.
This is my Activities XML:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="aris.projectaris.InfoPreviewActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_info_preview" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
app:srcCompat="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
Looks like the default ActionBar is still there even though you have added a Toolbar. Make sure to set on of the following themes
android:theme="#style/Theme.AppCompat.NoActionBar"
android:theme="#style/Theme.AppCompat.Light.NoActionBar"
android:theme="#style/Theme.AppCompat.DayNight.NoActionBar"
in the <application> or appropriate <activity> tag in your AndroidManifest.xml.
EDIT:
If you use one of these themes, you must set up the Toolbar as the app bar in the onCreate method of the Activity:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar t = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(t);
}

Align Navigation Drawer button in toolbar before title

I want my button that opens navigation drawer to be displayed on the toolbar first in the left but I am unable to place it before the title. I tryed set android:gravity="left" but that does not seem to help. Can anyone help me with this?
Here is my toolbar xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="2dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark">
<ImageView
android:layout_width="24dp"
android:layout_height="24dp"
android:id="#+id/imageView"
android:src="#drawable/ic_menu_white_24dp"
android:gravity="left"
/>
</android.support.v7.widget.Toolbar>
It was mistake to do it manually. I should use ActionBarDrawerToggle.
You can use one of the following two methods:
First, in xml:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
app:navigationIcon="#drawable/ic_menu_white_24dp"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
Second, inside activity:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_child_swipe);
Toolbar toolbar = (Toobar) findViewById(R.id.toolbar)
setSupportActionBar(toolbar);
toolbar.setNavigationIcon(R.drawable.ic_menu_white_24dp);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//do something here
}
});

Android - Overflow Menu and Back Button not showing in Collapsing Toolbar

I'm trying to implement features from the new Design Support Library to create a parallax scrolling toolbar which looks similar to the new material design WhatsApp profile pages. However, I can't get the overflow menu and back button to show in the top corners.
I have tried using the following methods to display the back button, but none of them works.
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
And overwriting the onCreateOptionsMenu method for the overflow menu also didn't work.
Does anyone know how to add these toolbar icons to a CollapsingToolbar from the Design Support Library? Below is my layout xml for the activity. Thanks!
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="#color/primary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp">
<ImageView
android:id="#+id/backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/headerbg"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/Theme.AppCompat.Light.DarkActionBar"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="fill_vertical"
android:layout_marginBottom="?attr/actionBarSize"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
</android.support.v4.widget.NestedScrollView>
I had the same issue, none from existing answers have helped me, surprising fix of my problem was in question description.
Solution for AppCompat Activity
So working collapsing toolbar with back button needs those few lines in controller onCreate method:
//change id to Your id
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
//this line shows back button
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
Manifest of this activity ( notice parentActivityName attribute ):
<activity
android:name=".SomeActivity"
android:parentActivityName=".MainActivity"
android:theme="#style/AppTheme.NoActionBar"/>
Template part:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="200dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="#color/colorPrimary"
android:fitsSystemWindows="true"
app:expandedTitleGravity="center_horizontal"
>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin"
/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
Alternative solution ( also AppCompat Activity )
Controller onCreate method:
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setNavigationIcon(android.support.v7.appcompat.R.drawable.abc_ic_ab_back_material);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
onBackPressed();
}
});
This approach uses the same manifest and template presented in first solution.
In my case this works! app:layout_collapseMode="pin" inside toolbar layout
Try not to put this in the coordinatorLayout:
android:fitsSystemWindows="true"
It works for me. No idea why. Good luck
The following enables the Navigation Button:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setNavigationIcon(getResources().getDrawable(R.drawable.ic_arrow_back_white_24dp, null));
toolbar.setNavigationOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
//onBackPressed()
}
});
To get the Overflow Menu behavior you have to declare a menu.xml file with showAsAction:never applied to your menu items like:
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item android:id="#+id/action_one"
android:title="action 1"
android:orderInCategory="1"
app:showAsAction="never"/>
<item android:id="#+id/action_two"
android:title="action 2"
android:orderInCategory="2"
app:showAsAction="never"/>
</menu>
And inflate it like:
toolbar.inflateMenu(R.menu.main);
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
#Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()) {
case R.id.action_one:
break;
case R.id.action_two:
break;
}
return true;
}
});
change
app:layout_collapseMode="parallax"
to
app:layout_collapseMode="pin"
in imageView.
hope this will work for you
If u have not added parentActivityName tag in manifest file, then do so by adding following lines of code as
<activity android:name=".Activity.MovieData"
android:parentActivityName=".Activity.Home">
</activity>
where "Activity" is my Package name
"MovieData" is my activity name
"Home" is my destination activity name
EDIT: If you are supporting android api level 15 and below then parentActivityName wont work.
To support lower versions, u need to add meta-data tag as
<meta-data
android:name="PARENT_ACTIVITY"
android:value="com.example.Activity.Home"/>
change this..
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:elevation="15dp"
android:layout_width="match_parent"
app:logo="#drawable/action_bar_logo"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
the popupTheme makes the difference and it is what you were looking for..
this is my full xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".AddUser">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:elevation="15dp"
android:layout_width="match_parent"
app:logo="#drawable/action_bar_logo"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_add_user" />
</android.support.design.widget.CoordinatorLayout>
Good luck!
Goto res/values/ and open styles.xml
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
Change parent="Theme.AppCompat.Light.NoActionBar" to parent="Theme.AppCompat.Light"
Then start debugging and remove all unnecessary code like // setSupportActionBar(toolbar); things.
Definitely work.

Where do I define XML for the Toolbar widget in Android 5.0?

Okay, I've been going through several StackOverflow posts now, but I'm still confused as to where this xml for my Toolbar goes.
<android.support.v7.widget.Toolbar
android:id=”#+id/my_awesome_toolbar”
android:layout_height=”wrap_content”
android:layout_width=”match_parent”
android:background=”#styles/colorPrimary” />
Does it go in my /layout/activity_main.xml?
Toolbar is a generalization of Action bars for use within app layouts, now to answer your question there are two practices:
Bad practice:
Bad practice is to define the Toolbar in every layouts.
Standard practice:
Standard practice is to define a layout and reference it in a base activity. You just need to include this Toolbar layout in whichever layout you want (by using <include>) and extend the defined base activity in whichever activity.
This standard practice will help you keeping a single code base for Toolbar and save your time from defining Toolbar every time.
Example: Google I/O 2014 android app
toolbar_actionbar_with_headerbar.xml
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:iosched="http://schemas.android.com/apk/res-auto"
style="#style/HeaderBar"
iosched:theme="#style/ActionBarThemeOverlay"
iosched:popupTheme="#style/ActionBarPopupThemeOverlay"
android:id="#+id/toolbar_actionbar"
iosched:titleTextAppearance="#style/ActionBar.TitleText"
iosched:contentInsetStart="?actionBarInsetStart"
android:layout_width="match_parent"
android:layout_height="?actionBarSize" />
This toolbar layout is referenced in settings activity as given below:
activity_settings.xml
<LinearLayout 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"
android:orientation="vertical"
tools:context=".ui.SettingsActivity">
<include layout="#layout/toolbar_actionbar_with_headerbar" />
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
As for me, I usually make a ToolbarActivity. Next, if you want your activity to have a toolbar, you just need to YourActivity extends ToolbarActivity.
public class ToolbarActivity extends AppCompatActivity {
#Override
public void setContentView(int layoutResID) {
super.setContentView(R.layout.activity_toolbar);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
LayoutInflater inflater = LayoutInflater.from(this);
View contentView = inflater.inflate(layoutResID, null);
LinearLayout layout = (LinearLayout) findViewById(R.id.layout);
layout.addView(contentView, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
}
}
XML:
<LinearLayout
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"
android:orientation="vertical"
android:id="#+id/layout"
tools:context=".ToolbarActivity" >
<android.support.v7.widget.Toolbar
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:id="#+id/toolbar" />
</LinearLayout>

Categories

Resources