Similar Implementation Like Google Plus Comments

Question

If you've used Google Plus Android app you would have noticed the comments feed that keeps rotating between different comments.

Below is a screenshot of it:

Does anyone have any idea on how to implement a similar approach? I'm not asking for any code, but want the basic idea of how this has been implemented.

Please use Google Plus Android app and check the behavior of the comments on a post. You'll get an idea of what I'm asking.

Answer 1

I suspect this is a custom View similar to this one, remember to adjust width and height manually from xml:

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

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Handler;
import android.util.AttributeSet;
import android.view.View;

public class RotatingView extends View {

public static class RotatingData {
    String data;

    public RotatingData(String data) {
        super();
        this.data = data;
    }
}

public interface OnItemRotatedListener {
    public void onItemRotated(RotatingData data);
}

private List<RotatingData> mList;
private Paint mPaint;
private Handler mHandler;
private int mCurrentSelection;
private OnItemRotatedListener mItemRotatedListener;
private Random mRandom;

public RotatingView(Context context) {
    this(context, null);
}

public RotatingView(Context context, AttributeSet attrs) {
    this(context, attrs, 0);
}

public RotatingView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    mPaint = new Paint();
    mHandler = new Handler();
    mRandom = new Random();
    List<RotatingData> list = new ArrayList<RotatingView.RotatingData>();
    list.add(new RotatingData("0th item selected"));
    list.add(new RotatingData("1st item selected"));
    list.add(new RotatingData("2nd item selected"));
    setRotatingData(list);
    setSelection(0);
}

private void setSelection(int i) {
    mCurrentSelection = i;
    invokeListener(mList.get(i));
    invalidate();
}

public void setRotatingData(List<RotatingData> list) {
    mList = list;
    invalidate();
}

public OnItemRotatedListener getItemRotatedListener() {
    return mItemRotatedListener;
}

public void setItemRotatedListener(OnItemRotatedListener itemRotatedListener) {
    mItemRotatedListener = itemRotatedListener;
    invokeListener(mList.get(mCurrentSelection));
}

private void invokeListener(RotatingData data) {
    if (mItemRotatedListener != null) {
        mItemRotatedListener.onItemRotated(data);
    }
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    final List<RotatingData> list = mList;
    final int count = list.size();
    final float w = getMeasuredWidth() / (float) count;
    final int h = getMeasuredHeight();
    int left = 0;
    final Paint paint = mPaint;
    for (int i = 0; i < list.size(); i++) {
        if (i == mCurrentSelection) {
            paint.setColor(Color.DKGRAY);
        } else {
            paint.setColor(Color.LTGRAY);
        }
        canvas.drawRect(left, 0, left + w, h, paint);
        left += w;
    }
}

@Override
protected void onAttachedToWindow() {
    super.onAttachedToWindow();
    startRotating();
}

private void startRotating() {
    mHandler.postDelayed(new Runnable() {

        @Override
        public void run() {
            mCurrentSelection++;
            mCurrentSelection %= mList.size();
            setSelection(mCurrentSelection);
            mHandler.postDelayed(this, mRandom.nextInt(1000) + 1000);
        }
    }, mRandom.nextInt(1000) + 1000);
}

@Override
protected void onDetachedFromWindow() {
    super.onDetachedFromWindow();
    stopRotating();
}

private void stopRotating() {
    mHandler.removeCallbacksAndMessages(null);
}
}