Как создать одностраничное приложение с автоматической прокруткой вкладок в Android?

Я видел несколько веб-сайтов single page Application, на которых всякий раз, когда мы нажимаем на любую вкладку, страница прокручивается по вертикали, чтобы показать этот выбранный раздел, и наоборот, если мы прокручиваем страницу по вертикали, то вкладки автоматически меняются в соответствии с отображаемый раздел. Что-то вроде это

Я хочу что-то подобное в моем приложении для Android. Пожалуйста, дайте мне знать, с чего начать. Пожалуйста, подскажите мне направление или предложите что-нибудь, что может мне в этом помочь.

stackoverflow.com/questions/7561353/… взгляните на это, это то, что вы ищете?
jle 10.03.2018 12:08

Я думаю, что простой вид прокрутки с плавной прокруткой до позиции будет работать для вас при выборе вкладки.

Killer 10.03.2018 12:10

@HituBansal Вы проверили решение, приведенное ниже?

Rahul Khurana 28.03.2018 08:37
12
3
668
2

Ответы 2

Вам нужно использовать VerticalViewPager, как показано в это сообщение SO, и использовать вместе с ним TabLayout.

Сообщите мне, если у вас возникнут проблемы.

Код из данной ссылки SO:

/**
* Uses a combination of a PageTransformer and swapping X & Y coordinates
* of touch events to create the illusion of a vertically scrolling ViewPager. 
* 
* Requires API 11+
* 
*/
public class VerticalViewPager extends ViewPager {

    public VerticalViewPager(Context context) {
        super(context);
        init();
    }

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

    private void init() {
        // The majority of the magic happens here
        setPageTransformer(true, new VerticalPageTransformer());
        // The easiest way to get rid of the overscroll drawing that happens on the left and right
        setOverScrollMode(OVER_SCROLL_NEVER);
    }

    private class VerticalPageTransformer implements ViewPager.PageTransformer {

        @Override
        public void transformPage(View view, float position) {

            if (position < -1) { // [-Infinity,-1)
                // This page is way off-screen to the left.
                view.setAlpha(0);

            } else if (position <= 1) { // [-1,1]
                view.setAlpha(1);

                // Counteract the default slide transition
                view.setTranslationX(view.getWidth() * -position);

                //set Y position to swipe in from top
                float yPosition = position * view.getHeight();
                view.setTranslationY(yPosition);

            } else { // (1,+Infinity]
                // This page is way off-screen to the right.
                view.setAlpha(0);
            }
        }
    }

    /**
     * Swaps the X and Y coordinates of your touch event.
     */
    private MotionEvent swapXY(MotionEvent ev) {
        float width = getWidth();
        float height = getHeight();

        float newX = (ev.getY() / height) * width;
        float newY = (ev.getX() / width) * height;

        ev.setLocation(newX, newY);

        return ev;
    }

    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev){
        boolean intercepted = super.onInterceptTouchEvent(swapXY(ev));
        swapXY(ev); // return touch coordinates to original reference frame for any child views
        return intercepted;
    }

    @Override
    public boolean onTouchEvent(MotionEvent ev) {
        return super.onTouchEvent(swapXY(ev));
    }

}

В этом случае я бы использовал RecyclerView. Если вы установите его в вертикальной ориентации и установите высоту элемента на match_parent, пользователь сможет прокручивать вверх и вниз, как на одностраничном веб-сайте. Кроме того, нажав на конкретную вкладку, вы можете прокрутить список до определенной позиции. Вы также можете использовать анимацию, когда каждый элемент появляется / исчезает.

У вас будет контроль над дизайном и содержанием каждого раздела, поскольку RecyclerView дает вам возможность иметь разный дизайн и контент для каждого элемента.

Надеюсь, поможет.

Другие вопросы по теме