Cardslib - How to set action for button events of custom cards on CardRecyclerView

629 views Asked by At

I am trying to use Cardslib to create a RecyclerView with custom layout rows that would expand when I click a button on them. I followed customization guide and create both custom layout and custom card class, the cards do appear correctly like this enter image description here
but I cant figure out how to set clicking event for view elements on this card.

In activity_main.xml, I have a CardRecyclerView:

<it.gmariotti.cardslib.library.recyclerview.view.CardRecyclerView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    card:list_card_layout_resourceID="@layout/my_cardview_layout"
    android:id="@+id/my_recyclerview"/>

my_cardview_layout.xml:

<it.gmariotti.cardslib.library.view.CardViewNative xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card="http://schemas.android.com/apk/res-auto"
android:id="@+id/list_cardId"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="12dp"
android:layout_marginRight="12dp"
card:card_layout_resourceID="@layout/my_material_card_layout"
style="@style/card_external"
android:layout_marginTop="12dp" />

my_material_card_layout.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">

<it.gmariotti.cardslib.library.view.ForegroundLinearLayout
    android:id="@+id/card_main_layout"
    style="@style/card.native.main_layout_foreground"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

<ImageView
    android:layout_width="match_parent"
    android:layout_height="210dp"
    android:id="@+id/mycard_image"
    android:src="@drawable/sea"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceLarge"
    android:text="Title"
    android:id="@+id/mycard_title"
    android:paddingTop="24dp"
    android:paddingLeft="20dp"/>

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="Subtitle"
    android:id="@+id/mycard_subtitle"
    android:paddingLeft="20dp" />

<LinearLayout
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="@dimen/actions_padding"
    android:paddingLeft="@dimen/actions_padding_left"
    android:paddingRight="@dimen/actions_padding_left">

    <TextView
        android:id="@+id/mycard_suppaction1"
        android:text="SHARE"
        android:background="?android:selectableItemBackground"
        android:layout_width="wrap_content"
        style="@style/card.native.actions"
        android:layout_height="wrap_content"/>


    <TextView
        android:id="@+id/mycard_suppaction2"
        android:text="LEARN MORE"
        android:background="?android:selectableItemBackground"
        android:layout_width="wrap_content"
        style="@style/card.native.actions"
        android:layout_height="wrap_content"/>
</LinearLayout>

</it.gmariotti.cardslib.library.view.ForegroundLinearLayout>


<FrameLayout
    android:id="@+id/card_content_expand_layout"
    style="@style/card.native.main_contentExpand"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >
</FrameLayout>

My main activity:

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

    ArrayList<Card> cards = new ArrayList<Card>();

    //CardViewNative cardView = (CardViewNative) findViewById(R.id.myMaterialCardView);

    for(int i = 0; i<3; i++) {

        MyMaterialCard card = new MyMaterialCard(this);


        CardExpand expand = new CardExpand(getApplicationContext());
        //Set inner title in Expand Area
        expand.setTitle(" Hidden content");
        card.addCardExpand(expand);
        card.setId("" + i);

        cards.add(card);
    }

    CardArrayRecyclerViewAdapter mCardArrayAdapter = new CardArrayRecyclerViewAdapter(this, cards);

    //Staggered grid view
    CardRecyclerView mRecyclerView = (CardRecyclerView) this.findViewById(R.id.my_recyclerview);
    mRecyclerView.setHasFixedSize(false);
    mRecyclerView.setLayoutManager(new LinearLayoutManager(this));

    //Set the empty view
    if (mRecyclerView != null) {
        mRecyclerView.setAdapter(mCardArrayAdapter);
    }

}

my custom card class:

public class MyMaterialCard extends Card {

ImageView mImage;
TextView mTitle;
TextView mSubtitle;
TextView mActionButton1;
TextView mActionButton2;

public MyMaterialCard(Context context) {
    super(context, R.layout.my_cardview_layout);
}

public MyMaterialCard(Context context, int innerLayout) {
    super(context, innerLayout);
}

@Override
public void setupInnerViewElements(ViewGroup parent, View view) {

    mImage = (ImageView) view.findViewById(R.id.mycard_image);
    mTitle = (TextView) view.findViewById(R.id.mycard_title);
    mSubtitle = (TextView) view.findViewById(R.id.mycard_subtitle);
    mActionButton1 = (TextView) view.findViewById(R.id.mycard_suppaction1);
    mActionButton2 = (TextView) view.findViewById(R.id.mycard_suppaction2);

    mActionButton1.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Toast.makeText(getContext(), "action 1", Toast.LENGTH_SHORT).show();

        }
    });

    ViewToClickToExpand viewToClickToExpand =
            ViewToClickToExpand.builder()
                    .setupView(mActionButton2);
    setViewToClickToExpand(viewToClickToExpand);
}}

I think the problem maybe the my_cardview_layout.xml, however, if i set card:list_card_layout_resourceID="@layout/my_material_card_layout" in recyclerview and

public MyMaterialCard(Context context) {
super(context, R.layout.my_material_card_layout);}

they will not appear as cards: enter image description here

have been working on this for 2 days and still can not get those buttons to work ( tried using Cardslib material card but when add expand, nothing happened). Really appreciate any help, thank you!

1

There are 1 answers

0
João Costa On

On main activity, add function setOnClickListener:

for(int i = 0; i<3; i++) {

        MyMaterialCard card4 = new MyMaterialCard(this);
        card.setOnClickListener(new Card.OnCardClickListener() {
            @Override
            public void onClick(Card card, View view) {
                Toast.makeText(view.getContext()," Click on ActionArea ",Toast.LENGTH_SHORT).show();
            }
        });


        CardExpand expand = new CardExpand(getApplicationContext());
        //Set inner title in Expand Area
        expand.setTitle(" Hidden content");
        card.addCardExpand(expand);
        card.setId("" + i);

        cards.add(card4);
    }

I think this could help some people, I hope not you xD (1 year, 10 months ago)