Android ListView with main View - timeline effect - possible?

Question

How can I create something like this?

I want to have the "selected image" as the main view, and then a time line effect at the bottom; something like a Gallery would work, but that has been deprecated.

I'm thinking a HorizontalScrollView at the bottom, but will that recycle the views properly? Can I implement the ViewHolder pattern here?

What about StackView? I found this: http://www.gdgankara.org/2012/03/25/stackview-non-widget-sample/ which could be cool, but I couldn't find a lot of things about StackViews online, so I'm wondering how much it gets implemented?

Answer 1

I solved this problem by using a custom horizontal ListView by MUKESH YADAV

I changed his HorizontalImageAdapter.java class to use a CursorAdapter.

My solution here:

public class HorizontalImageAdapter extends CursorAdapter  {

    //...some initialization here

     public HorizontalImageAdapter(Context context, Cursor c, int count) {
            super(context, c, true);

            this.context = (Activity) context;
            this.count = count;
            this.cursor = c;
            inflater = LayoutInflater.from(context);

            cursor.moveToFirst();           
        }

     private static class ViewHolder {
            public ImageView imageview;
            public TextView textview;
            public ImageView imageviewvideo;

        }

     @Override
     public View getView(int position, View convertView, ViewGroup parent) {

         ViewHolder holder = null;       
         cursor.moveToPosition(position);

         if (convertView == null) {
             Log.d(TAG, "converView == null <<<<<<<<<<<<<<<<<<<<<<<<");

             convertView = inflater.inflate(R.layout.activity_media_items, null);
             holder = new ViewHolder();

             holder.textview = (TextView) convertView.findViewById(R.id.tv_details_title);
             holder.imageview = (ImageView) convertView.findViewById(R.id.iv_details_resource_image);
             holder.imageviewvideo = (ImageView) convertView.findViewById(R.id.iv_details_resource_video);

             convertView.setTag(holder);

          } else {
              Log.d(TAG, "converView != null >>>>>>>>>>>>>>>>>>>>>>>>");                
          }

            //get the type of the item      
            type = cursor.getString(cursor.getColumnIndex(DatabaseHelper.FIELD_ITEM_TYPE));

            if(type.equalsIgnoreCase("text")){
            //handle for text item  

            }

            if(type.equalsIgnoreCase("image")){
            //handle for image item 

            }

            if(type.equalsIgnoreCase("video")){
            //handle for video item

            }
            return convertView;     
     }       

    @Override
    public void bindView(View view, Context context, Cursor cursor) {
        ViewHolder holder = (ViewHolder) view.getTag();

        String title = cursor.getString(cursor.getColumnIndex(DatabaseHelper.FIELD_TITLE));
        String fileName = cursor.getString(cursor.getColumnIndex(DatabaseHelper.FIELD_RESOURCE));

    }

    @Override
    public View newView(Context context, Cursor cursor, ViewGroup parent) {
        ViewHolder holder = new ViewHolder();
        View eachitem = inflater.inflate(R.layout.activity_media_items, parent, false);

        holder.textview = (TextView) eachgrid.findViewById(R.id.tv_details_title);
        holder.imageview = (ImageView) eachgrid.findViewById(R.id.iv_details_resource_image);
        holder.imageviewvideo = (ImageView) eachgrid.findViewById(R.id.iv_details_resource_video);

        eachgrid.setTag(holder);

        return eachitem;        
    }
}

And the XML:

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:background="@android:color/black" >

    <ImageView
        android:id="@+id/selected_imageview"
        android:layout_width="@dimen/exhibit_item_width"
        android:layout_height="@dimen/exhibit_item_height"
        android:layout_gravity="center"
        android:layout_marginTop="10dp"
        android:layout_weight="1"
        android:maxHeight="@dimen/exhibit_item_height"
        android:maxWidth="@dimen/exhibit_item_width"
        android:src="@drawable/logo" />

    <RelativeLayout
        android:id="@+id/gallery_relative_layout"
        android:layout_width="wrap_content"
        android:layout_height="@dimen/exhibit_items_height"
        android:layout_gravity="bottom"
        android:layout_weight="1"
        android:gravity="center"
        android:orientation="horizontal" >

        <com.example.testdatabase2.HorizontalView
            android:id="@+id/gallery"
            android:layout_width="match_parent"
            android:layout_height="@dimen/exhibit_items_height"
            android:layout_centerHorizontal="true"
            android:smoothScrollbar="true"
            android:spacing="20dip" >
        </com.example.testdatabase2.HorizontalView >
    </RelativeLayout>        
</LinearLayout>