CODEWITHSUNDEEP
androidandroid-layout
ddx001
ddx001

Reputation: 2763

CardView toolbars

I have a RecyclerView that contains CardViews.

I would like to add a Toolbar to each of those CardViews that would look and behave like the main Toolbar:

[Icon] [Title] .......... [Button] [Button] [Menu]

I've seen from here (http://blog.grafixartist.com/create-a-card-toolbar/) that it is possible to set an actual android.support.v7.widget.Toolbar object inside a CardView. But it relies on setSupportActionBar(...) to inflate the menu and respond to actions.

Do you think it's possible to reproduce that behaviour in each of my CardViews?

Upvotes: 3

Views: 7093

Answers (3)

Jim
Jim

Reputation: 1147

Previous answers are correct but I would like to mention they there are times where the menu items become duplicate. In order to get around this, you need to clear the toolbar's menu for each CardView by invoking toolBar.getMenu().clear();

Upvotes: 1

piotrek1543
piotrek1543

Reputation: 19361

You don't need setSupportActionBar for your cardviews with toolbars until you would need to set some ActionBar specific actions up/back navigation actions.

Take a look at this fine example (link to whole page below):

Thanks Gabriele for all the help. Here is working code:

Activity :

public class MainActivity extends ActionBarActivity {

  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_mai);

      Toolbar toolbar = (Toolbar) findViewById(R.id.card_toolbar);
      toolbar.setTitle("Card Toolbar");
      if (toolbar != null) {
          // inflate your menu
          toolbar.inflateMenu(R.menu.main);
          toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
              @Override
              public boolean onMenuItemClick(MenuItem menuItem) {
                  return true;
              }
          });
      }

      Toolbar maintoolbar = (Toolbar) findViewById(R.id.toolbar_main);
      if (toolbar != null) {
          // inflate your menu
          maintoolbar.inflateMenu(R.menu.main);
          maintoolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
              @Override
              public boolean onMenuItemClick(MenuItem menuItem) {
                  return true;
              }
          });
      }
  }

}

Layout XML File:

<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" >

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar_main"
        android:layout_width="match_parent"
        android:layout_height="@dimen/action_bar_size_x2"
        android:background="@android:color/holo_orange_dark"
        android:minHeight="?attr/actionBarSize" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/toolbar_main"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="@dimen/action_bar_size"
        android:orientation="vertical" >

        <android.support.v7.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical" >

                <android.support.v7.widget.Toolbar
                    android:id="@+id/card_toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/action_bar_size"
                    android:background="@android:color/white" />

                <View
                    android:layout_width="match_parent"
                    android:layout_height="1dp"
                    android:background="@android:color/darker_gray" />

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_margin="10dp"
                    android:text="@string/app_name"
                    android:textSize="24sp" />
            </LinearLayout>
        </android.support.v7.widget.CardView>
    </LinearLayout>

</RelativeLayout>

Make sure your activity theme is extending Theme.AppCompat.Light.NoActionBar.

Here is what it will look like:

enter image description here

Few things to note:

  • If you are using card elevation then you need to altar the margin top so that your card aligns with the main toolbar
  • I am still seeing 1-2 pixel margin between bottom of main toolbar and card toolbar. Not sure about what to do in this case. For now, i am aligning it manually.

From: How to create a card toolbar using appcompat v7

Notice that author of this post hadn't used it at all, so I'm pretty sure you would also don't need that for implementation your idea

Hope it help

Upvotes: 5

Zielony
Zielony

Reputation: 16537

Sure. setSupportActionBar is used to set target for setTitle, menu inflation and up/back action. You can use Toolbar anywhere you want without using setSupportActionBar. It will behave like a ViewGroup.

Upvotes: 1

Related Questions