How to build Two Synchronous ListView with Dynamic Contents

Question

I want to create a ScrollView which has a dynamic content with two columns in itself.

And items of right column are connected to items of left column cross-positioned. (Like this first column item y-coordinates:[(0,100),(100,200),(200,300)] -- second column item y-coordinates:[(50,150),(150,250)])

Using one ScrollView or a ListView is impossible because they cannot have two columns like that cross positioned as I know. So, I have two solutions. These solution approaches have different problems.

Here is my first solution:
-A dynamic custom view inside a ScrollView.
-The problem with this approach is I cannot figure out how to update the ScrollView and Dynamic Custom View, so it does not scroll.

My second solution:
-Two seperate connected listview (If you slide one, other one slides automatically to the same position synchronously).
-This solutions problem is I cant find out a way to connect them to each other.

Any help will be appreciated.

Muhammed Aydogan · Accepted Answer · 2020-02-21T16:06:20.410

For any person who might need the answer, I've found the solution in here. I improved this with that (which is incorrect)(actually I fixed it). And here is my final solution:

MyScrollView.java

public class MyScrollView extends ScrollView implements IScrollListener {

    private static final String TAG = "MyScrollView";
    private IScrollListener listener;

    public MyScrollView(Context context) {
        super(context);
    }

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

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

    public void setScrollViewListener(IScrollListener listener) {
        this.listener = listener;
    }

    @Override
    protected void onScrollChanged(int x, int y, int oldX, int oldY) {
        super.onScrollChanged(x, y, oldX, oldY);
        if (listener != null) {
            listener.onScrollChanged(this, x, y, oldX, oldY);
        } else {
            Log.i(TAG, "asdasd");
        }
    }

    @Override
    public void onScrollChanged(IScrollListener scrollView, int x, int y, int oldX, int oldY) {
        super.onScrollChanged(x, y, oldX, oldY);
        if (listener != null) {
            listener.onScrollChanged(this, x, y, oldX, oldY);
        } else {
            Log.i(TAG, "asdasd");
        }
    }
}

MyActivity.java

public class MyActivity extends AppCompatActivity implements IScrollListener {
    @Override
    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_multi_position);

        .
        .
        .

        scrollViewLeft = (MyScrollView) this.findViewById(R.id.scrollViewLeft);
        scrollViewRight = (MyScrollView) this.findViewById(R.id.scrollViewRight);

        .
        .

        scrollViewLeft.setScrollViewListener(this);
        scrollViewRight.setScrollViewListener(this);

        .
        .
        LayoutInflater vi = (LayoutInflater) getApplicationContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View viewLeft = vi.inflate(R.layout.target_item, null);
        View viewRight = vi.inflate(R.layout.target_item_right, null);

        // insert into left view
        ViewGroup insertPointLeft = (ViewGroup) findViewById(R.id.leftLinearLayout);
        insertPointLeft.addView(viewLeft, 0, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));

        // insert into right view
        ViewGroup insertPointRight = (ViewGroup) findViewById(R.id.rightLinearLayout);
        insertPointRight.addView(viewRight, targets.size(), new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT));

        // fill in any details dynamically here
        TextView number = (TextView) viewLeft.findViewById(R.id.number);
        number.setText("1");
        TextView name = (TextView) viewLeft.findViewById(R.id.name);
        name.setText("Muhammed Aydogan");

        // fill in any details dynamically here
        TextView number2 = (TextView) viewRight.findViewById(R.id.number);
        number2.setText("2");
        TextView name2 = (TextView) viewRight.findViewById(R.id.name);
        name2.setText("Muhammed Aydogan");*/
    }

    @Override
    public void onScrollChanged(IScrollListener scrollView, int x, int y, int oldX, int oldY) {
        if (scrollViewLeft.equals(scrollView)) {
            scrollViewRight.scrollTo(x, y);
        } else if (scrollViewRight.equals(scrollView)) {
            scrollViewLeft.scrollTo(x, y);
        }
    }
}

IScrollListener.java

public interface IScrollListener {
    void onScrollChanged(IScrollListener scrollView, int x, int y, int oldX, int oldY);
}

How to build Two Synchronous ListView with Dynamic Contents

1 Answers1