ListView messed up when scroll

Question

I have a list of items. Some of them need to be purchased and some don't. For those that need to be purchased a price is displayed. I am using a BaseAdapter to populate the list view. At first glance prices are shown for the right items, but at scroll prices are shown also for other lessons. With each scroll, the list view changes.

    public View getView(int position, View convertView, ViewGroup parent)
    {
        Lesson lesson = (Lesson) getItem(position);

        if (convertView == null)
        {
            convertView = new LessonView(lesson);
        }
        else
        {
            ((LessonView) convertView).setLessonView(lesson);
        }

        return convertView;
    }

public class LessonView extends LinearLayout
{
    private TextView lessonTitle, cardsNr, percentageValue, percentageCompleted, purchasePrice;
    private ImageView progressImage, purchaseIcon;
    private DrawUIHelper drawUIHelper;
    private RelativeLayout lessonRow;

    public LessonView(Lesson lesson)
    {
        super(mContext);
        drawUIHelper = DrawUIHelper.getInstance(mContext);
        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(((WindowManager) mContext.getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay().getWidth(), (int) (((WindowManager) mContext.getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay().getHeight() * 0.14));
        addView(LayoutInflater.from(mContext).inflate(R.layout.lesson_item, null), params);

        setLessonView(lesson);
    }

    /**
     * @param lesson
     */
    private void setLessonView(Lesson lesson)
    {
        lessonTitle = (TextView) findViewById(R.id.lessonTitleTextView);
        lessonTitle.setText(lesson.getTitle());

        TypeFaceSetter.getInstance(mContext).setFontType(lessonTitle);
        cardsNr = (TextView) findViewById(R.id.cardsNrTextView);
        cardsNr.setText(String.valueOf(lesson.getCardCount()));

        progressImage = (ImageView) findViewById(R.id.learnProgressImageView);
        lessonRow = (RelativeLayout) findViewById(R.id.lessonItem);

        lessonTitle.setTextSize(TypedValue.COMPLEX_UNIT_PX, lessonRow.getLayoutParams().width / 20);
        percentageValue = (TextView) findViewById(R.id.percentageTextView);
        TypeFaceSetter.getInstance(mContext).setFontType(percentageValue);
        percentageValue.setTextSize(TypedValue.COMPLEX_UNIT_PX, lessonRow.getLayoutParams().width / 15);
        percentageValue.setText(String.valueOf(Math.round(lesson.getLearningProgress() * 100)) + "%");
        percentageCompleted = (TextView) findViewById(R.id.percentageCompleted);
        TypeFaceSetter.getInstance(mContext).setFontType(percentageCompleted);
        percentageCompleted.setTextSize(TypedValue.COMPLEX_UNIT_PX, lessonRow.getLayoutParams().width / 50);

        progressImage.setImageBitmap(drawUIHelper.drawLearnCircle(lessonRow.getLayoutParams().height + 40, lessonRow.getLayoutParams().height + 40, lesson.getLearningProgress() * 100));

        int lessonId = getResources().getIdentifier("lesson_" + String.valueOf(lesson.getId()), "string", mContext.getPackageName());
        if (lessonId != 0) {
            String sku = mContext.getString(lessonId);
            if (lessonsDetailsMap.containsKey(sku)) {
                purchaseIcon = (ImageView) findViewById(R.id.purchaseIcon);
                purchaseIcon.setVisibility(View.VISIBLE);
                purchasePrice = (TextView) findViewById(R.id.purchasePrice);
                purchasePrice.setVisibility(View.VISIBLE);
                purchasePrice.setText(lessonsDetailsMap.get(sku));
            } else {
                // no purchased items
            }
        }
    }
}

Answer 1

When scrolling in ListView views are reused. When setting a view values (in your setLessonView method) be sure you are getting every view (with findViewById) and giving them all a value. If not, if the view have been previously used to hold a Lesson with price and you do not hide this price view (or set some kind of value) you will see the old value.

In your code:

purchaseIcon = (ImageView) findViewById(R.id.purchaseIcon); 
purchasePrice = (TextView) findViewById(R.id.purchasePrice);
if (lessonId != 0) {
            String sku = mContext.getString(lessonId);
            if (lessonsDetailsMap.containsKey(sku)) {                
                purchaseIcon.setVisibility(View.VISIBLE);               
                purchasePrice.setVisibility(View.VISIBLE);
                purchasePrice.setText(lessonsDetailsMap.get(sku));
            } else {
                // no purchased items
                purchaseIcon.setVisibility(View.INVISIBLE);               
                purchasePrice.setVisibility(View.INVISIBLE);
            }
}

}