Click events on ListView custom item Android

Question

I am trying to implement UI like shown for listview:

---

ON Selection:

---

Normal:

Now I also have a panel in main activity at bottom whose view will change whether items are selected or not.

---

Now I want to handle click events. I had an AdapterView.OnItemClickListener in main activity and it was working fine. But I wanted to implement an long click listener. On long click the layout of items in list will change to show selection button. But I am not able to do multiple selection in my List view.

I don't have an Action bar in my activity and I want to achieve following behavior.

I have tried setting on click listeners on view but then that effects only one view (on selection). Can someone guide me how to achieve this.

My list View Item code :

<?xml version="1.0" encoding="utf-8"?>
<!-- Height will be relative to Icon Size -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:orientation="horizontal">

    <!-- Item -->
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1138"
        android:background="@drawable/navigation_list_bottom_border"
        android:orientation="vertical">

        <!-- Image Tittle etc-->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="103">

            <ImageView
                android:id="@+id/im_navigation_item"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:adjustViewBounds="true"
                android:scaleType="fitXY"
                android:src="@mipmap/ic_fb_unknown_item"/>

            <!-- Title -->
            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="894">

                <TextView
                    android:id="@+id/tv_navigation_item_title"
                    style="@style/navigation_item_title_style"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:ellipsize="middle"
                    android:maxLines="1"/>
            </LinearLayout>

            <!-- Size -->
            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="149">

                <TextView
                    android:id="@+id/tv_navigation_item_size"
                    style="@style/navigation_item_size_style"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"/>
            </LinearLayout>
        </LinearLayout>

        <!-- Additional details like date -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="68.5">

            <TextView
                android:id="@+id/tv_navigation_item_date"
                style="@style/navigation_item_date_style"
                android:layout_width="match_parent"
                android:layout_height="match_parent"/>
        </LinearLayout>
    </LinearLayout>

    <!-- Selection -->
    <LinearLayout
        android:id="@+id/ll_navigation_list_item_check"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="143"
        android:visibility="gone">

            <ImageView
                android:id="@+id/im_item_not_selected"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:adjustViewBounds="true"
                android:scaleType="fitXY"
                android:src="@mipmap/ic_fb_list_item_unchecked"/>
    </LinearLayout>

</LinearLayout>

My main activity:

<FrameLayout 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:background="@drawable/wallpaper_blur_explorer"
             android:orientation="vertical"
             tools:context=".ExplorerActivity">

    <!-- MAIN LAYOUT -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <!--weight = 2035/525 -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="525"
            android:orientation="vertical">

            <include layout="@layout/title_explorer"/>
        </LinearLayout>

        <!--weight = 2035/525 -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="2035"
            android:background="@android:color/white"
            android:orientation="vertical">

            <com.micromax.filebrowser.ui.NavigationListView
                android:id="@+id/listview_navigation"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:divider="@null"
                android:scrollbars="vertical">
            </com.micromax.filebrowser.ui.NavigationListView>
        </LinearLayout>
    </LinearLayout>

    <!-- Overlay for bottom bar-->
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <!-- Bottom bar -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="70dp"
            android:layout_gravity="bottom"
            android:alpha="0.9"
            android:background="@android:color/holo_blue_dark"
            android:orientation="horizontal">
        </LinearLayout>
    </LinearLayout>
</FrameLayout>

Now I want that on Item selection my Bottom panel should change. I have a listener in Main activity like this:

private AdapterView.OnItemClickListener mNavItemClickListener =
            new AdapterView.OnItemClickListener() {

                @Override
                public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                    DirInfo dirInfo = (DirInfo) parent.getItemAtPosition(position);
                    if (dirInfo.isDeviceDir()) {
                        handleItemClick(position, dirInfo);
                    } else {
                        // Item at position 0 is UP navigation
                        if (position == 0) {
                            handleUpNavigation(dirInfo);
                        } else {
                            handleItemClick(position - 1, dirInfo);
                        }
                    }
                }
            };

Now I am unable to figure out how to achieve the desired behavior. I want to be able to get list of all selected items and be able to select multiple items after long click on an item. Also the "checked/unchecked image" should appear on long click.

Code for NavigationListView

public class NavigationListView extends ListView {
    private Context mContext;
    private NavigationListAdapter mAdapter;

    public NavigationListView(Context context) {
        super(context);
        init(context);
    }

    public NavigationListView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public NavigationListView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }

    private void init(Context context) {
        mContext = context;
    }

    public void startNavigationFromPath(DirInfo dirInfo) {

        if (mAdapter == null) {
            NavigationListAdapter adapter = new NavigationListAdapter(mContext, dirInfo);
            this.setAdapter(adapter);
        } else {
            mAdapter.setDirectory(dirInfo);
            mAdapter.notifyDataSetChanged();
        }
    }

}

How can I do this?

Answer 1

1- Inside My list View Item code add a check-box(which provides ,multiple select functionality) in place of Imageview at the bottom, for reference : http://techlovejump.com/android-listview-with-checkbox/

2-After that may be you have create custom checked and unchecked view for your check-box, for reference: http://androidexample.com/Custom_Checkbox_With_The_Use_Of_Selectors_And_Shapes/index.php?view=article_discription&aid=80&aaid=104

3-Set you check-box default visibility to invisible.

4-Now you can handle your check-box visibility inside setOnItemLongClickListener() . for reference: https://stackoverflow.com/a/25491769/1384010