Action Bar Search in collapsing Toolbar Layout - android

I have a CollapsingToolbarLayout with recycler view. In my actionbar I have a search menu item. But whenever I click search icon, the edittext layout do not appear.
Screenshots:-
A) When search is not clicked
B) When Search icon is clicked
My main_activity.xml code:-
<?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"
android:id="#+id/activity_main_id"
tools:context="objectdistance.ankeshkjaisansaria.ram.sita.cameratag.MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<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"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp"
android:fitsSystemWindows="true">
<ImageView
android:id="#+id/imagetoolbar"
android:layout_width="match_parent"
android:layout_height="200dp"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll"
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/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
In my activity.java the search item is handled this way:-
ActionBar action = getSupportActionBar(); //get the actionbar
action.setDisplayShowCustomEnabled(true); //enable it to display a
// custom view in the action bar.
action.setCustomView(R.layout.search_bar);//add the custom view
action.setDisplayShowTitleEnabled(false); //hide the title
But the search_bar layout is not appearing only. And also the title is not hiding.
Is there any different way to handle search in menu item when using collapsing layout ?

Now we have toolbar in Android. So instead of ActionBar from Activity, use To
Tooolbar view as ActionBar.
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
ActionBar ab = getSupportActionBar();
Now operate on ab. By default your activity show a action bar but Toolbar is hiding it. Also use menu item as
<item
android:id="#+id/action_search"
android:icon="#drawable/ic_action_search"
android:title="Search for products"
app:actionViewClass="android.support.v7.widget.SearchView"
app:showAsAction="always|collapseActionView"
/>

try adding this to your item on the menu xml.
app:actionLayout= "#layout/YourSearchLayout"

You should implement something like this to get your "Search Field" working just fine:
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_search_list, menu);
MenuItem searchMenuItem = menu.findItem(R.id.action_search);
android.support.v7.widget.SearchView searchView = (android.support.v7.widget.SearchView) MenuItemCompat.getActionView(searchMenuItem);
searchView.setQueryHint(getString(R.string.type_here_to_filter));
searchView.setOnQueryTextListener(new android.support.v7.widget.SearchView.OnQueryTextListener() {
#Override
public boolean onQueryTextSubmit(String query) {
return searchForAnItemInTheRecyclerView(query);
}
#Override
public boolean onQueryTextChange(String newText) {
return searchForAnItemInTheRecyclerView(newText);
}
});
return true;
}

Try to add the item like this in Menu.xml file:
<item
android:id="#+id/action_settings"
android:orderInCategory="100"
android:icon="#drawable/src"
android:title="#string/action_settings"
app:showAsAction="always|collapseActionview" />

Related

adding menu to toolbar

am trying to add one menu item to toolbar that always shown on the right of the toolbar
menu File
<item android:id="#+id/menu_edit"
android:title="#string/edit"
android:icon="#drawable/ic_baseline_edit_24"
app:showAsAction="ifRoom"
/>
xml file
<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"
android:fitsSystemWindows="true"
tools:context=".Profile">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/profileAppBar"
android:layout_width="match_parent"
android:layout_height="400dp"
android:fitsSystemWindows="true">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/profileCollapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="#color/mediumBlue"
app:layout_scrollFlags="exitUntilCollapsed|scroll"
>
<ImageView
android:id="#+id/profileFullImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/abstract_dark_blue_polygonal_background_1035_9700"
android:fitsSystemWindows="true"
android:transitionName="profileImage"
app:layout_collapseMode="parallax" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/shape_background" />
<androidx.appcompat.widget.Toolbar
app:menu="#menu/profile_toolbr"
android:id="#+id/profileToolBar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
>
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
java.class
public class Profile extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_profile);
toolbar = findViewById(R.id.profileToolBar);
collapsingToolbarLayout = findViewById(R.id.profileCollapsingToolbarLayout);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
}
the problem is it not show up and only appears as three dots when i add this
#Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater menuInflater = new MenuInflater(Profile.this);
menuInflater.inflate(R.menu.profile_toolbr,menu);
return true ;
}
how can i add it to show as an icon on the toolbar
i try to use app:showAsAction="always" but the same no change
You should not use MenuInflater, as it will create new menu. Menu is handled by the activity itself. So you do not need to use new MenuInflater. So you have to remove it and use getMenuInflater.
Replace your onCreateOptionsMenu with this:
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main_menu, menu);
return super.onCreateOptionsMenu(menu);
}

NestedScrollView with Toolbar

So I set in styles.xml for AppTheme NoActionBar, because I want Toolbar only in a few Activites and also I create post_details_menu with two items. But toolbar not showing at all.
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
Then in Manifest.xml, I have the theme: AppTheme
<application
android:theme="#style/AppTheme"
...>
</application>
Then i created my_toolbar:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.Toolbar
android:id="#+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"/>
</LinearLayout>
And in im PostDetailsActivity i want use my Toolbar:
public class PostDetailActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_post_detail);
Toolbar toolbar = findViewById(R.id.my_toolbar);
setSupportActionBar(toolbar);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.post_details_menu, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
switch(item.getItemId()){
case R.id.post_Edit:
showMessage("post_edit clicked");
return true;
case R.id.post_Delete:
showMessage("post_delete clicked");
return true;
default:
return super.onOptionsItemSelected(item);
}
}
And finally this is my layout for ActivityPostDetails:
<androidx.core.widget.NestedScrollView
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=".PostDetailActivity"
android:background="#fff">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView ... />
<TextView ... />
<androidx.recyclerview.widget.RecyclerView .../>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
It's too simple. set your app bar layout in the XML file where you want to show the toolbar.
check below XML code:-
<androidx.core.widget.NestedScrollView
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=".PostDetailActivity"
android:background="#fff">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.appcompat.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:theme="#style/AppTheme.ActionBar"
app:navigationIcon="#drawable/ic_back"
app:subtitleTextAppearance="#style/CustomSubTitleTextAppearance"
app:titleTextColor="#color/black" />
</com.google.android.material.appbar.AppBarLayout>
<ImageView ... />
<TextView ... />
<androidx.recyclerview.widget.RecyclerView .../>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
In your java code, you have to bind toolbar programmatically in PostDetailsActivity.java.
toolbar = findViewById(R.id.toolbar)
toolbar!!.setNavigationIcon(R.drawable.ic_back)
if (toolbar != null) {
setSupportActionBar(toolbar)
}
Xml structure something like this should solve the problem
<LinearLayout>
<Toolbar/>
<NestedScrollView>
//one parent view inside nestedscrollview
<AnylayoutType>
// other required views
</AnylayoutType>
</NestedScrollView>
<LinearLayout/>
With this approach your Toolbar won't move and menu option will always be available and nested sroll view will work as required.
And if you are sure your view hierarchy is not nested its better to use LinearLayout inside nested scrollview

Add a spinner to the Toolbar for a specific Fragment only

I am trying to add a spinner to a fragment, but for only one out of three total fragments in my application. My application also has a navigation drawer.
I have removed the default actionbar and added a toolbar as such in the activity_main.xml file:
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"
tools:context=".MainActivity"
tools:openDrawer="start" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:id="#+id/toolbar"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
android:elevation="4dp" />
<FrameLayout
android:id="#+id/fragment_content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>
I add the toolbar in the MainActivity.java class as such:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
etc...
How do I go about adding a Spinner for one particular fragment and not all three?
Do setHasOptionsMenu(true) in your Fragment which need to show the spinner.
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setHasOptionsMenu(true);
}
Add menu item.
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/spinner"
android:title="ActionBar Spinner"
app:actionViewClass="android.widget.Spinner"
android:background="#ff00"
app:showAsAction="always" />
</menu>
Then inflate menu in onCreateOptionsMenu method, refer to this:
#Override
public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
super.onCreateOptionsMenu(menu,inflater);
inflater.inflate(R.menu.spinner, menu);
MenuItem item = menu.findItem(R.id.spinner);
Spinner spinner = (Spinner) item.getActionView();
//.....
}

Different menu toolbar in fragment with BottonNavigationView

I have a layout with bottonNavigationView and fragments. How can I have different toolbar menus for each fragment? I've already tried several things.
In a fragment, I hace used.
((AppCompatActivity) getActivity()).getSupportActionBar()
This is the layout of a fragment
<FrameLayout 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="com.cspm.ventas6.cspm.v_fragments.f_clientes"
android:focusable="false">
<LinearLayout
android:id="#+id/con_listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:descendantFocusability="blocksDescendants"
android:focusable="false">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar">
<!-- Toolbar is the actual app bar with text and the action items -->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways" />
</android.support.design.widget.AppBarLayout>
<ListView
android:id="#+id/client_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#null" />
</LinearLayout>
</FrameLayout>
In your fragment, add following two methods.
#Override
public void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// tells the fragment that fragment will use toolbar's options menu
setHasOptionsMenu(true);
}
/**
* this method is called when fragment prepares options menu,
* simply, inflate your menu and call super
*/
#Override
public void onPrepareOptionsMenu(Menu menu) {
getActivity().getMenuInflater().inflate(R.menu.menu_res_id, menu);
super.onPrepareOptionsMenu(menu);
}
Change menu_res_id with your menu resource.
And, if you only want to remove an item from current menu, then replace line
getActivity().getMenuInflater().inflate(R.menu.menu_res_id, menu);
with
menu.findItem(R.id.action_search).setVisible(false);

Icons In Collapsing Toolbar

I'm fooling around with collapsing toolbar. Everything seems good. But My icons are not centered with the title. I think that's because of fitsSystemWindows(). But at the same time images are not covering the status bar. Any help will be appreciated. Thanks!
Java Code :
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_shr___add__vehicle);
Toolbar toolbar = (Toolbar) findViewById(R.id.add_vehicle_toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
CollapsingToolbarLayout appbar = (CollapsingToolbarLayout) findViewById(R.id.add_vehicle_collapse);
appbar.setTitle("My Bikes");
appbar.setExpandedTitleColor(Color.parseColor("#F05329"));
XML :
<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="com.techindyeah.soherides.SHR_Activity_Add_Vehicle">
<android.support.design.widget.AppBarLayout
android:id="#+id/add_vehicle_app_bar"
android:layout_width="match_parent"
android:layout_height="250dp"
android:theme="#style/AppTheme.AppBarOverlay"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/add_vehicle_collapse"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="#color/colorPrimary"
app:expandedTitleMarginStart="20dp"
app:expandedTitleMarginEnd="64dp"
android:fitsSystemWindows="true">
<ImageView
android:id="#+id/rl_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#mipmap/bikeimage"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/add_vehicle_toolbar"
android:layout_width="match_parent"
android:layout_height="60dp"
app:popupTheme="#style/AppTheme.PopupOverlay"
android:minHeight="60dp"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_shr__activity__add__vehicle" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/add_vehicle_insert_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
app:layout_anchor="#+id/add_vehicle_app_bar"
app:layout_anchorGravity="bottom|right"
app:srcCompat="#mipmap/ic_insert_photo_white_24dp" />
This is what I have now :
Expanded
Collapsed
1) As per my knowledge back arrow does not move, you can hide it while scrolling if you want.
2) To add Option to right side of toolbar you can use menu.xml
menu.xml
<item android:id="#+id/action_map"
android:icon="#drawable/ic_map"
android:title="#string/action_map"
android:showAsAction="always"
android:orderInCategory="1" />
in Java file
#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_map) {
return true;
}
return super.onOptionsItemSelected(item);
}
make sure you add app:layout_collapseMode="parallax" and app:layout_behavior in your arrow image
and use
ActionBar actionBar=getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);

Categories

Resources