SwipeListView: View is messed up. Hidden content is all over the list items

Question

I'm new to the SwipeListView library and when one of the list items is swiped, the feature works like this:

The application is working, but the views are messed up such that the hidden content (i.e the content that is seen after swiping the list item) is being overlayed on top of each list item. Following the images below, i've pasted the fragment code.

How can I fix this?

Without SwipeListView:

With SwipeListView:

import java.util.ArrayList;
import java.util.List;

import android.app.Fragment;
import android.content.Context;
import android.content.res.Resources;
import android.graphics.Typeface;
import android.media.MediaPlayer;
import android.os.Bundle;
import android.util.DisplayMetrics;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.ListView;
import android.widget.TextView;

import com.example.test.ItemAdapter;
import com.example.test.ItemRow;
import com.example.test.R;
import com.fortysevendeg.swipelistview.BaseSwipeListViewListener;
import com.fortysevendeg.swipelistview.SwipeListView;

public class MyList extends Fragment {

    @Override
    public void onPause() {
        // TODO Auto-generated method stub
        super.onPause();

        index = list.getFirstVisiblePosition();
    }

    @Override
    public void onResume() {
        // TODO Auto-generated method stub
        super.onResume();

        list.setSelectionFromTop(index, 0);
    }

    ListView list;
    int index = 0;
    MediaPlayer mp;

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedinstanceState)
    {

        mp=MediaPlayer.create(getActivity(), R.raw.v1);

        return inflater.inflate(R.layout.listview, container, false);               
    }

    @Override
    public void onStart() {

        super.onStart();
        list=(ListView)getView().findViewById(R.id.listView1);
        list.setAdapter(new MyAdapter(getActivity()));

        }
}

    class MyAdapter extends BaseAdapter
    {
        ArrayList<SingleRow> list;
        Context context;
        ItemAdapter adapter;
        List<ItemRow> itemData;

        public MyAdapter(Context c) {

            context=c;
            list=new ArrayList<SingleRow>();
            //Initialize them...
            int[] images={                  
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,
                    R.drawable.ic_launcher,

                    };

           for(int i=0;i<6;i++)
            {
                list.add(new SingleRow(images[i]));
            }   

        }

        public int convertDpToPixel(float dp) {
           DisplayMetrics metrics =context.getResources().getDisplayMetrics();
           float px = dp * (metrics.densityDpi / 160f);
           return (int) px;
       }

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return list.size();
        }

        @Override
        public Object getItem(int position) {
            // TODO Auto-generated method stub

            return list.get(position);
        }

        @Override
        public long getItemId(int position) {

            return position;
        }

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

            View row=convertView;
            MyViewHolder holder=null;
            itemData=new ArrayList<ItemRow>();
            adapter=new ItemAdapter(context,R.layout.custom_row,itemData);
            final SwipeListView swipelistview;

            if(row==null)
            {
                LayoutInflater inflater=(LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                row=inflater.inflate(R.layout.list_rows, parent, false);
                row.setBackgroundResource(R.drawable.coloria);
                holder=new MyViewHolder(row);
                SingleRow temp=list.get(position);

                holder.imageView.setImageResource(temp.image);

                swipelistview = (SwipeListView)row.findViewById(R.id.example_swipe_lv_list);

                row.setTag(holder);
            }

            else 
            {
                swipelistview = (SwipeListView)row.findViewById(R.id.example_swipe_lv_list);
                holder=(MyViewHolder)row.getTag();
            }

              swipelistview.setSwipeListViewListener(new BaseSwipeListViewListener() {
                    @Override
                    public void onOpened(int position, boolean toRight) {
                    }

                    @Override
                    public void onClosed(int position, boolean fromRight) {
                    }

                    @Override
                    public void onListChanged() {
                    }

                    @Override
                    public void onMove(int position, float x) {
                    }

                    @Override
                    public void onStartOpen(int position, int action, boolean right) {
                        Log.d("swipe", String.format("onStartOpen %d - action %d", position, action));
                    }

                    @Override
                    public void onStartClose(int position, boolean right) {
                        Log.d("swipe", String.format("onStartClose %d", position));
                    }

                   @Override
                    public void onClickFrontView(int position) {
                        Log.d("swipe", String.format("onClickFrontView %d", position));

                        swipelistview.openAnimate(position); //when you touch front view it will open

                    }

                    public void onClickBackView(int position) {
                        Log.d("swipe", String.format("onClickBackView %d", position));

                        swipelistview.closeAnimate(position);//when you touch back view it will close
                    }

                    public void onDismiss(int[] reverseSortedPositions) {

                    } 

                });

                swipelistview.setSwipeMode(SwipeListView.SWIPE_MODE_LEFT);
                swipelistview.setSwipeActionLeft(SwipeListView.SWIPE_ACTION_REVEAL); 
                swipelistview.setSwipeActionRight(SwipeListView.SWIPE_ACTION_REVEAL);
                swipelistview.setOffsetLeft(convertDpToPixel(260f));
                swipelistview.setOffsetRight(convertDpToPixel(0f)); 
                swipelistview.setAnimationTime(50); 
                swipelistview.setSwipeOpenOnLongPress(true);

                swipelistview.setAdapter(adapter);

                for(int i=0;i<10;i++)
                {
                    itemData.add(new ItemRow("item"+i,context.getResources().getDrawable(R.drawable.ic_launcher) ));

                }

                Typeface font = Typeface.createFromAsset(holder.textView.getContext().getAssets(), "fonts/OpenSans.ttf");

                holder.textView.setTypeface(font);

                adapter.notifyDataSetChanged();

                return row; 
        } 

    class MyViewHolder
    {
        ImageView imageView;
        TextView textView;

        MyViewHolder(View v)
        {
            textView=(TextView)v.findViewById(R.id.textView1);
            imageView=(ImageView)v.findViewById(R.id.imageView1);
        }
    } 

    class SingleRow
    {
        int image;
        SingleRow(int image)
        {
            this.image=image;
        }
    }

    }

Answer 1

I have the same problem right now. It is probably because your front layout's background is transparent. The library isn't hiding with code but with visible background. I overcomed this by hiding my 'back' view in my getView then made it visible on swipe.

    mTourneyList.setSwipeListViewListener(new BaseSwipeListViewListener() {
        @Override
        public void onOpened(int position, boolean toRight) {
            LinearLayout li = (LinearLayout) mTourneyList.getChildAt(position - mTourneyList.getFirstVisiblePosition()).findViewById(R.id.back);
            li.setVisibility(View.VISIBLE);             
        }

or you can set some background to your front view.

Edit: It seems the 'position' argument was not calculating the on screen rows, so I changed the code a little and subtracted first visible position from 'position'.

Answer 2

I had the same problem and got round it by using this post: Setting background colour of Android layout element

"You can use simple color resources, specified usually inside res/values/colors.xml.

<color name="white">#ffffffff</color>

and use this via android:background="@color/white" in the layout xml

make sure you apply it to both the front and back layouts