Android: картинка с верхним слоем, который прокручивается

Вдохновился новым видом Google Play Market и решил, что пора что-то сделать с отображением информации о продукте.
Придумал показывать как картинку с верхним слоем, который можно прокрутить вниз и открыть всю картинку целиком.

Вот как это выглядит в работе:

Решение оказалось не самым простым — несколько дней думал как это реализовать.
Лэйаут выглядит так:



    
    
            
            

.....
 
            
        



А вот что нужно было добавить в коде:

int viewHeight = 0;
    int innerViewHeight = 0;
final View view = inflater.inflate(R.layout.itemview,
                container, false);
final LinearLayout innerView = (LinearLayout)view.findViewById(R.id.innerView);
ViewTreeObserver vto = view.getViewTreeObserver();
            vto.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {

                @Override
                public void onGlobalLayout() {

                    viewHeight = view.getHeight();
                    innerViewHeight = innerView.getHeight();

                    innerView.setPadding(0, viewHeight, 0, 0);

                    ViewTreeObserver obs = view.getViewTreeObserver();

                    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
                        obs.removeOnGlobalLayoutListener(this);
                    } else {
                        obs.removeGlobalOnLayoutListener(this);
                    }
                }

            });
            final ScrollView scrollview = ((ScrollView) view.findViewById(R.id.ScrollView));
            scrollview.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
                @Override
                public void onGlobalLayout() {
                    scrollview.post(new Runnable() {
                        public void run() {
                            
                            if (innerViewHeight >= viewHeight)
                            {
                                scrollview.scrollTo(0, viewHeight-100);
                            }else {
                                scrollview.fullScroll(View.FOCUS_DOWN);
                            }
                        }
                    });
                }
            });

Немного пояснений:
— innerView динамически получает паддинг, чтобы было достаточно пустого места для отображения всей картинки на экране.
— вычисление размера viewHeight происходит в OnGlobalLayoutListener потому что весь вью должен загрузиться и только после этого можно определить его реальные размеры.
— на момент открытия страницы я хотел, чтобы сразу был виден верхний слой, но не до конца загруженный. Для этого в OnGlobalLayoutListener запускаем тред с прокруткой. По-другому решить не получалось и похоже это самое лучшее решение. Опять же хотелось, чтобы всегда был отступ и поэтому скрол реализован таким образом.

Добавить комментарий

%d такие блоггеры, как: