创新互联鸿蒙OS教程：鸿蒙OS事件

事件主要包括手势事件和按键事件。手势事件主要用于智能穿戴等具有触摸屏的设备，按键事件主要用于智慧屏设备。

公司主营业务：成都网站建设、成都网站设计、移动网站开发等业务。帮助企业客户真正实现互联网宣传，提高企业的竞争能力。成都创新互联是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化，感谢他们对我们的高要求，感谢他们从不同领域给我们带来的挑战，让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。成都创新互联推出播州免费做网站回馈大家。

手势事件

手势表示由单个或多个事件识别的语义动作（例如：点击、拖动和长按）。一个完整的手势也可能由多个事件组成，对应手势的生命周期。JS UI 框架支持的手势事件有：

触摸

• touchstart：手指触摸动作开始。
• touchmove：手指触摸后移动。
• touchcancel：手指触摸动作被打断，如来电提醒、弹窗。
• touchend：手指触摸动作结束。

点击

click：用户快速轻敲屏幕。

长按

longpress：用户在相同位置长时间保持与屏幕接触。

具体的使用示例如下：

  

    {{onclick}}
  
  

    {{touchStart}}
  
  

    {{touchMove}}
  
  

    {{touchEnd}}
  
  

    {{touchCancel}}
  
  

    {{onLongPress}}
  

/* xxx.css */
.container {
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.text-container {
  padding-top: 10px;
  flex-direction: column;
}
.text-style {
  padding-top: 20px;
  padding-left: 100px;
  width: 750px;
  height: 100px;
  text-align: center;
  font-size: 50px;
  color: #ffffff;
  background-color: #09ba07;
}

// xxx.js
export default {
  data: {
    textData: '',
    touchStart: 'touchstart',
    touchMove: 'touchmove',
    touchEnd: 'touchend',
    touchCancel: 'touchcancel',
    onClick: 'onclick',
    onLongPress: 'onlongpress',
  },
  onInit() {
    this.textData = 'initdata';
  },
  onReady: function () {},
  onShow: function () {},
  onHide: function () {},
  onDestroy: function () {},
  touchCancel: function (event) {
    this.touchCancel = 'canceled';    
  },
  touchEnd: function(event) {
    this.touchEnd = 'ended';
  },
  touchMove: function(event) {
    this.touchMove = 'moved';
  }, 
  touchStart: function(event) {
    this.touchStart = 'touched';
  },
  longPress: function() {
    this.onLongPress = 'longpressed';
  },
  click: function() {
    this.onClick = 'clicked';
  },
}

按键事件

按键事件是智慧屏上特有的手势事件，当用户操作遥控器按键时触发。用户点击一个遥控器按键，通常会触发两次 key 事件：先触发 action 为 0，再触发 action 为 1，即先触发按下事件，再触发抬起事件。action 为 2 的场景比较少见，一般为用户按下按键且不松开，此时 repeatCount 将返回次数。每个物理按键对应各自的按键值（keycode）以实现不同的功能，常用的按键值请参考组件通用事件。具体的使用示例如下：

  

    {{up}}
  
  

    {{down}}
  

/* xxx.css */
.card-box {
  flex-direction: column;
  justify-content: center;
}
.content-box {
  align-items: center;
  height: 200px;
  flex-direction: column;
  margin-left: 200px;
  margin-right: 200px;
}
.content-text {
  font-size: 40px;
  text-align: center;
}

// xxx.js
export default {
  data: {
    up: 'up',
    down: 'down',
  },
  focusUp: function() {
    this.up = 'up focused';
  },
  blurUp: function() {
    this.up = 'up';
  },
  keyUp: function() {
    this.up = 'up keyed';
  },
  focusDown: function() {
    this.down = 'down focused';
  },
  blurDown: function() {
    this.down = 'down';
  },
  keyDown: function() {
    this.down = 'down keyed';
  },
}

按键事件通过获焦事件向下分发，因此示例中使用了 focus 事件和 blur 事件明确当前焦点的位置。点按上下键选中 up 或 down 按键，即相应的 focused 状态，失去焦点的按键恢复正常的 up 或 down 按键文本。按确认键后该按键变为 keyed 状态。

分享题目：创新互联鸿蒙OS教程：鸿蒙OS事件
文章位置：http://www.shufengxianlan.com/qtweb/news38/544788.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联