How to create scrollable page of carousels in Android?

后端 未结 5 954
再見小時候
再見小時候 2020-12-12 15:36

I am attempting to build a UI for my Android app which contains a vertically scrollable page of horizontally scrollable carousels (something like what the Netflix app does).

5条回答
  •  眼角桃花
    2020-12-12 16:29

    Main Idea

    In order to have a flexible design and having unlimited items you can create a RecyclerView as a root view with a LinearLayoutManager.VERTICAL as a LayoutManager. for each row you can put another RecyclerView but now with a LinearLayoutManager.HORIZONTAL as a LayoutManager.

    Result

    enter image description here

    Source

    Code

    Requirements

    1) Vertical scrolling between carousels should be smooth, but when user releases, the UI should "snap to" the closest carousel (so the user is always on a carousel row, not between two carousels).

    2) Horizontal scrolling on a carousel should be smooth, but when user releases, the UI should "snap to" the closest item in the carousel.

    In order to achieve those I used OnScrollListener and when the states goes SCROLL_STATE_IDLE I check top and bottom views to see which of them has more visible region then scroll to that position. for each rows I do so for left and right views for each row adapter. In this way always one side of your carousels or rows fit. for example if top is fitted the bottom is not or vise versa. I think if you play a little more you can achieve that but you must know the dimension of window and change the dimension of carousels at runtime.

    3) Should be possible to overlay additional information over an item in the carousel

    If you use RelativeLayout or FrameLayout as a root view of each item you can put information on top of each other. as you can see the numbers are on the top of images.

    4) UI should be adaptable to any screen size.

    if you know how to support multiple screen size you can do so easily, if you do not know read the document. Supporting Multiple Screens

    5) Should be navigable with the arrow keys (for touchscreen-less devices)

    use below function

    mRecyclerView.scrollToPosition(position);
    

    6) Should work on a wide range of Android versions (possibly through the support library)

    import android.support.v7.widget.RecyclerView;

    7) Should be OK to use in an open-source app licensed under the GPL

    Ok

    happy coding!!

提交回复
热议问题