用键盘滚动煎茶列表 [英] Sencha list scrolling with keyboard

问题描述

我在我的应用程序中使用 sencha 列表.它是一个可滚动的列表.我想通过 up、down 键和键盘上的手势滚动列表.有人知道怎么做吗?

请帮帮我.

这是我的代码:

<代码>{xtype: '列表',针头:假，变量高度:假，项目Tpl:'
'+'<div>{名称}</div>'+'</div>',商店:'我的商店'，分组:真实，onItemDisclosure: 真}

解决方案

查看这个 fiddle https://fiddle.sencha.com/#fiddle/53t

您可以在应用程序启动功能中的 keydown 事件上添加文档事件侦听器，然后滚动列表项的高度.

Ext.application({name: '小提琴',启动:函数(){Ext.Viewport.add({xtype: '幻灯片'});document.addEventListener("keydown", Ext.bind(onBackKeyDown, this), false);函数 onBackKeyDown(e) {开关(e.keyIdentifier){案例向上":Ext.ComponentQuery.query('slidelist')[0].getScrollable().getScroller().scrollBy(0, -47);休息;案例下":Ext.ComponentQuery.query('slidelist')[0].getScrollable().getScroller().scrollBy(0, 47);休息;默认:休息;}}}});

I am using sencha list in my application. It is a scrollable list. I want to scroll the list by up, down key and hand gesture in keyboard. Does anyone know how to do it?

Please help me.

This is my code:

{      
    xtype: 'list',
    pinHeaders: false,
    variableHeights: false,
    itemTpl:
            '<div>' +
            '<div>{name}</div>' +
            '</div>',
    store: 'myStore',
    grouped: true,
    onItemDisclosure: true
}

解决方案

Check out this fiddle https://fiddle.sencha.com/#fiddle/53t

You can add a document eventlistener on keydown event in your application launch function and then scroll by the height of your list item.

Ext.application({
    name: 'Fiddle',
    launch: function() {
        Ext.Viewport.add({
            xtype: 'slidelist'
        });
        document.addEventListener("keydown", Ext.bind(onBackKeyDown, this), false);
        function onBackKeyDown(e) {
            switch(e.keyIdentifier)
            {
                case "Up":
                    Ext.ComponentQuery.query('slidelist')[0].getScrollable().getScroller().scrollBy(0, -47);
                break;
                case "Down":
                    Ext.ComponentQuery.query('slidelist')[0].getScrollable().getScroller().scrollBy(0, 47);
                break;
                default:
                break;
            }
        }
    }
});

这篇关于用键盘滚动煎茶列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！