2017-06-08 149 views
0

我正在使用Cordova 7.0.1正確處理Ionic 3.3.0中的Android TV控件。由於設備沒有觸摸屏,我必須使用遙控器。我正在使用以編程方式觸發Android上按鈕的點擊事件

@HostListener('document:keydown', ['$event']) 
handleKeyboardEvent(event: KeyboardEvent) { 
    // Check the key code and determine the next element to focus 
    // ... 

    // Focus the element 
    this.renderer.invokeElementMethod(nextElement._elementRef.nativeElement,'focus'); 
} 

檢查遙控器是否推動改變焦點。這工作正常。當按下回車鍵時,我希望激活按鈕的點擊動作。現在我嘗試使用類似

@HostListener('document:keydown', ['$event']) 
handleKeyboardEvent(event: KeyboardEvent) { 
    if(event.key == 'Enter') { 
    var focusedButton = Helper.getCurrentlyFocusedButton(); 
    focusedButton._elementRef.nativeElement.click(); 
    // Using the debugger I know that these lines are triggered, but nothing happens 
    } 
} 

以編程方式按下按鈕。當在Chrome上使用離子服務器時,此功能正常工作,但在Android設備上不起作用(使用Android TV 6.0.1的Sony KD-49XD7005)。據我可以從谷歌收集,這是因爲點擊不支持。但是,必須有另一種方式來觸發這一事件?我也嘗試手動創建觸摸事件

var e1 = document.createEvent('TouchEvent'); // Also tried 'UIEvent' 
e1.initEvent('touchstart', true, true); 

var e2 = document.createEvent('TouchEvent'); 
e2.initEvent('touchend', true, true); 

this.renderer.invokeElementMethod(focusedButton._elementRef.nativeElement, 'dispatchEvent', [e1]); 
this.renderer.invokeElementMethod(focusedButton._elementRef.nativeElement, 'dispatchEvent', [e2]); 

// Also tried 
// focusedButton._elementRef.nativeElement.dispatchEvent(e1); 
// focusedButton._elementRef.nativeElement.dispatchEvent(e2); 

但最終沒有奏效。有沒有辦法做到這一點?

回答

0

我通過查看離子角的源代碼自己弄明白了。在文件node_modules/ionic-angular/tap-click/tap-click.js是一個處理click事件的方法。它調用另一種稱爲shouldCancelClick(ev)的方法,當this.dispatchClick未定義或爲false時,返回truethis.dispatchClick由綁定到mousedown事件的pointerStart(ev)設置。

因此,所有必須做的事情是在觸發click事件之前觸發mousedown事件。

我解決了它這樣的:

var e1 = document.createEvent('MouseEvents'); 
e1.initEvent('mousedown', true, true); 
focusedButton.dispatchEvent(e1); 

var e2 = document.createEvent('MouseEvents'); 
e2.initEvent('click', true, true); 
focusedButton.dispatchEvent(e2);