lifer

Titanium 用户界面之事件处理

事件触发
自定义事件
App级别的事件
移除事件监听器
特殊的事件
注意事项及最佳实践
延伸阅读

内容

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

例如：

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

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

每个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

注意事项及最佳实战

1、事件监听器必须定义在事件触发之前

2、想好事件被监听的时间，一般是越晚越好，这样可以提升应用的响应速度，用户体验要好。

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