Android Wear - Add card after onClick

Question

It's the first time I'm working on an android wear application. I have implemented a list of items and is all right. Now I would like to show to the user an extra information when the users click in one item in a kind of card like in the image.

My click is working ok:

@Override
    public void onClick(WearableListView.ViewHolder viewHolder) {
        //Toast.makeText(this, "working", Toast.LENGTH_SHORT).show();
    }

But I have no idea how to popup a card when the user click in an item. Any idea?

Thanks!

EDITED:

I have added in my activity_main.xml the code below:

<?xml version="1.0" encoding="utf-8"?>
<android.support.wearable.view.WatchViewStub
    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/watch_view_stub"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:rectLayout="@layout/rect_activity_main"
    app:roundLayout="@layout/round_activity_main"
    tools:context=".MainActivity"
    tools:deviceIds="wear">

    <android.support.wearable.view.BoxInsetLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_height="match_parent"
        android:layout_width="match_parent">

        <FrameLayout
            android:id="@+id/frame_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_box="bottom">

        </FrameLayout>
    </android.support.wearable.view.BoxInsetLayout>

</android.support.wearable.view.WatchViewStub>

Then after fill the list I want to allow to the user to click on any item and show the card, so I have added the code below:

@Override
    public void onClick(WearableListView.ViewHolder viewHolder) {


        FragmentManager fragmentManager = getFragmentManager();
        FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
        CardFragment cardFragment = CardFragment.create("title",
                "description");
        fragmentTransaction.add(R.id.frame_layout, cardFragment);
        fragmentTransaction.commit();
    }

and I'm getting an error:

No view found for id 0x7f0e0014 (wk.gon250.myApp/frame_layout) for fragment CardFragment{207c1da5 #0 id=0x7f0e0014}

The error make sense but I don't know how to fix the error.

Answer 1

The images you have, are showing Cards and there is code snippets here that shows you how to build a card in your app; it is basically a CardFragment and if you are familiar with building a fragment, it shouldn't come as anything strange for you.