Создание плавной прокрутки Flex DataGrid - PullRequest
Новая
       5

Создание плавной прокрутки Flex DataGrid

2 голосов
/ 02 декабря 2009

Я заметил, что стандартное поведение вертикальной полосы прокрутки DataGrid - прокрутка по одной строке за раз. Это хорошо, когда все строки одинаковы и малы (например, отображают одну строку текста), но становятся ужасно, как только появляются строки с переменной высотой.

Мне любопытно, есть ли способ сделать прокрутку DataGrid "плавной"? Например, есть ли способ прокрутки DataGrid на заданное количество пикселей, строк текста и т. Д. Вместо прокрутки по одной строке за раз?

Пока что единственное решение, которое мне удалось найти, - это поместить DataGrid в Canvas и заставить Canvas выполнять прокрутку вместо DataGrid. Однако при таком подходе проблема заключается в том, что как только Canvas прокручивается достаточно далеко, заголовки DataGrid прокручиваются за пределы экрана. В идеале я хотел бы получить плавно прокручивающуюся природу Canvas, но также держать заголовки DataGrid видимыми. Это возможно?

Ответы [ 2 ]

1 голос
/ 12 января 2010

Попробуйте это ... Это все еще основано на коде Алекса, который был упомянут выше. Его по-прежнему должно стать отличным началом для снятия привязки к ряду. Первоначальный источник: http://blogs.adobe.com/aharui/2008/03/smooth_scrolling_list.html

Оригинальный код Алекса для плавной вертикальной прокрутки, но это не было проблемой, с которой я столкнулся в DataGrid. Это была плавная горизонтальная прокрутка, которая мне была нужна. Я использую DataGrid необычным способом для анализа текстовых отчетов, выводимых нашей базой данных (отличный способ обеспечить визуальную обратную связь с документом). Приведенный ниже код позволяет содержимому отключаться от экрана, и пользователь может прокручивать его без привязки к столбцу.

Вы можете приспособить это, чтобы использовать те же самые математические процедуры для вертикальной прокрутки, и тогда это сделает возможным прокрутку и проигнорирует поведение привязки к строке. В частности, переключите использование метода listContent.move для перемещения содержимого по вертикали и используйте обратное значение округленного пикселя, которое вы вычисляете по вертикальной полосе прокрутки (в отличие от моего использования горизонтальной).

Этот метод немного проще, чем метод Алекса по ссылке выше - кода гораздо меньше, поэтому попробуйте адаптировать и посмотрите, как он работает. 

override protected function scrollHandler(event:Event):void
        {           
            // Override the default scroll behavior to provide smooth horizontal scrolling and not the usual "snap-to-column" behavior
            var scrEvt:ScrollEvent = event as ScrollEvent;
            if(scrEvt.direction == ScrollEventDirection.HORIZONTAL) {
                // Get individual components of a scroll bar for measuring and get a horizontal position to use
                var scrDownArrow:DisplayObject = horizontalScrollBar.getChildAt(3);
                var sctThumb:DisplayObject = horizontalScrollBar.getChildAt(2);     
                // I replaced maxHorizontalScrollPosition in Alex's code with "1300" to fix my exact application. In other situations you may finding using some property or different value is more appropriate. Don't rely on my choice.
                var hPos:Number = Math.round((sctThumb.y - scrDownArrow.height) / (scrDownArrow.y - sctThumb.height - scrDownArrow.height) * 1300);     

                // Inverse the position to scroll the content to the left for large reports
                listContent.move(hPos * -1, listContent.y);
            }
            // Go ahead and use the default handler for vertical scrolling
            else {
                super.scrollHandler(event);
            }
        }
1 голос
/ 02 декабря 2009

Способ работы ItemRenderer в Flex 3 затрудняет плавную прокрутку. В основном Flex перерабатывает средства визуализации элементов, прокручиваемые из верхней части списка в качестве экранных объектов, используемых для новых данных в нижней части списка. Реализация Adobe большинства компонентов списков в Flex 3 создает и добавляет эти элементы по мере их появления на экране, а не просто за пределами экрана, поэтому они «всплывают», и плавная прокрутка недоступна. Я не уверен, почему они не могли сделать это подобным образом для элементов +/- на одну позицию выше или ниже текущей панели прокрутки, но они этого не сделали, и мы застряли с липкой прокруткой по умолчанию.

Обходные пути существуют, хотя тот, который вы заметили (перетаскивая сетку данных на холст), сводит на нет намерение сохранения экранного объекта средствами визуализации элементов и снижает производительность. Это будет исправлено для большинства Flex-компонентов на основе списка в Flex 4, хотя не будет исправлено немедленно для DataGrid. Компонент DataGrid / AdvancedDataGrid поддерживается отдельной группой, базирующейся в Индии, последний раз, когда я слышал, и поэтому он, как правило, немного отстает от остальной части SDK.

Я бы порекомендовал попробовать что-то похожее на эту реализацию с плавной прокруткой списка от Алекса Харуи . Я не совсем уверен, насколько хорошо он будет работать для DataGrid или AdvancedDataGrid, но это наиболее интуитивный метод, который я могу придумать для правильной прокрутки списка.

...