Titanium 用户界面之事件处理


  • 件触发 javascript

  • 定义事件 html

  • App级别的事件 java

  • 除事件监听器 react

  • 殊的事件 android

  • 意事项及最佳实践 数据库

  • 伸阅读 json



内容

事件是能够被javascript检测到的一种行为。应用程序应该能够捕获和处理事件。固然,你必须得为组件添加一些监听器。 api

例如: app

element.addEventListener('event_type', function(e) { // 当事件触发时须要执行的代码 // 对象E 将会描述这个事件 Ti.API.info('The '+e.type+' event happened'); });

如上所示,第一个参数(event_type)用来指定咱们正在监听的事件类型。 第二个参数一个回调函数,当事件触发时将会执行。 ide

每一个Ti组件都有一些特殊的时间。这些API上面都有,好比说:

click事件,swipe  事件,touchstart事件等等。具体参考API。

除了一些普通的事件外,一些组件还有其本身特殊的事件,好比说:定位服务中的方向改变和位置改变事件。而还有一些事件能够监听到手机的震动和摇摆,等等,你均可以参考API。

这里列出一些对象E(传过来的event对象)的属性:

x,y :事件触发时 事件的触发点(好比说点击操做)在View上的坐标值。

globalPoint :表示事件触发时,事件触发点在屏幕上的点的坐标,eg.(12,12)。他是一个点。(IOS特有的哦)

type:事件的类型的名称。

source:事件源。

除了可使用匿名函数做为回调,你还有使用正常的函数:



function doSomething(e) {

// This function will be called by multiple handlers

// The event object is accessible within this function 

    Ti.API.info('The '+e.type+' event happened'); 

} 

button1.addEventListener('click', doSomething); 

button2.addEventListener('click', doSomething);



提示:若是你想给一些元素设置事件监听器的话,你必须设置其 touchEnabled 为true,好比说:click事件。

大多数状况下,UI组件的touchEnabled 的默认值是true,若是当你发现不响应你的事件,你能够试着设置其属性touchEnabled =true看是否起做用。

触发事件

除了能够监听外,固然也能够触发。

someButton.fireEvent('click');

也能够为触发事件传值。

someButton.fireEvent('click', {kitchen: 'sink'});

正如你看到的,事件传值的时候是使用json来传的,你能够像下面同样使用其值:

someButton.addEventListener('click', function(e){ Ti.APP.info('The value of kitchen is '+e.kitchen); });

显示:

[INFO] The value of kitchen is sink


自定义事件

除了上面一些事件,你能够自定义事件,何时用呢???例如,当你的数据库更新了,你能够须要及时的展现其数据,你能够利用事件监听。你能够监听其事件,而后触发tableView的事件。

   

deleteButton.addEventListener('click', function(e){ 
        // when something happens in your app 
        database.doDelete(e.whichRecord);
        // fire an event so components can react 
        theTable.fireEvent('db_updated'); }); 
         // ... elsewhere in your code 
         theTable.addEventListener('db_updated', function(e){                                            theTable.setData(database.getCurrentRecords()); });


有时,你有个事件须要不止一个组件来监听,你能够设置Application级别的事件



Application-level events

App级别的事件是一个全局的事件, 能够在全部的上下文(contexts), functional scopes, CommonJS modules等被访问。

Ti.App.addEventListener。。。。 

这是一些示例代码:


deleteButton.addEventListener('click', function(e){  // when something happens in your app database.doDelete(e.whichRecord);  // fire a global event so components can react  Ti.App.fireEvent('db_updated'); }); // ... elsewhere in your code  Ti.App.addEventListener('db_updated', function(e){ theTable.setData(database.getCurrentRecords());  someOtherComponent.doSomethingElse(); });



请你记住了,当你的App一直运行时,app级的事件是常驻内存的,除非你移除它。


移除事件监听器

示例代码:

 function doSomething(e) { // do something } deleteButton.addEventListener('click', doSomething); // ... elsewhere in your code ... deleteButton.removeEventListener('click', doSomething); });

一些特殊的事件

android里面有一些特殊的按钮:如back,Home,Search,Menu等,在Ti里面,你也能够监听到。

Event

Fired when ...

android:back

The back button is released

android:home

The home button is released

android:search

The search button is released

android:camera

The camera button is released

android:focus

Fired when the camera button is pressed halfway and then released.

android:volup

The volume-up rocker button is released

android:voldown

The volume-down rocker button is released


注意事项及最佳实战

一、事件监听器必须定义在事件触发以前

二、想好事件被监听的时间,通常是越晚越好,这样能够提高应用的响应速度,用户体验要好。

三、由于全局的事件监听器是常驻内存的,直到你取消或者APP中止运行了,这样的话,在事件监听器中使用的局部变量也将常驻内存。这可能会致使内存泄露,具体关于参见内存的管理和发现内存泄露 。咱们给的建议是若是全局事件触发后,若是不须要继续监听,你直接移除监听器。


延伸阅读

相关文章
相关标签/搜索