HTML CSS JAVASCRIPT PYTHON PYTHON2 JAVA C C++ C# SQL Excel Linux AI BOOTSTRAP PHP 教程库 参考手册 技术文章 测验 练习 HOWTO FAQ
❮ 上一节 下一节 ❯

Sencha Touch - 原生 API

Sencha Touch 最大的优势在于它提供了原生 API 的封装。

Ext.device API 用于提供对不同原生 API 的访问。它充当包装器，可进一步用于访问不同的 API，例如 Ext.device.Camera、Ext.device.Connection 等。

Ext.device 提供以下 API −

Sr.No API &描述
1

Ext.device.Camera

此 API 允许您的应用点击图片并访问相机图库中的图像。
2

Ext.device.Connection

此 API 用于检查设备是否已连接到互联网。
3

Ext.device.Notification

此 API 用于显示本机消息窗口。
4

Ext.device.Orientation

此 API 用于检查您的手机方向，例如纵向或横向。

相机

此 API 允许使用设备相机点击图片并授予对手机图库中可用图像的访问权限。

要访问任何 API，我们需要使用 Ext.require('Ext.device.Camera') 来要求该 API

以下代码用于使用此 API 点击图片。

Ext.device.Camera.capture({
   source: 'camera',
   destination: 'file',
   success: function(url) {
      Ext.create('Ext.Img', {
         src: url,
         fullscreen: true
      });
   }
});

在上面的例子中，我们使用源作为相机来捕获图像。我们还可以将源作为库来访问图库图像。

成功是一个回调函数，当图像捕获成功时调用。当图像捕获不成功时，我们可以有一个失败回调。

上面的示例打开相机应用程序并点击图片。

连接

此 API 用于检查您的设备是否已连接到互联网。如今，几乎所有应用程序都需要互联网才能运行。因此，如果尚未连接，可以使用此 API 进行预先检查并发送连接到网络的通知。

以下程序显示了连接 API 的使用

<!DOCTYPE html>
<html>
   <head>
      <link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet" />
      <script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-all.js"></script>
      <script type = "text/javascript">
         Ext.require('Ext.device.Connection');
         Ext.application({
            name: 'Sencha',
            launch: function() {
               if (Ext.device.Connection.isOnline()) {
                  Ext.Msg.alert('You are currently connected');
               } else {
                  Ext.Msg.alert('You are not currently connected');
               }
            }
         });
      </script>
   </head>
   <body>
   </body>
</html>

它将产生以下结果 −

通知

此 API 用于将通知显示为 Ext.Msg，并带有多个按钮。

以下程序显示了通知 API 的工作原理。

<!DOCTYPE html>
<html>
   <head>
      <link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet" />
      <script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-all.js"></script>
      <script type = "text/javascript">
         Ext.require('Ext.device.Notification');
         Ext.application({
            name: 'Sencha',
            launch: function() {
               Ext.device.Notification.show({
                  title: 'Multiple Buttons',
                  message: 'This is a notification with multiple buttons.',
                  buttons: ["Yes", "No", "Cancel"],
                  callback: function(button) {
                     Ext.device.Notification.show({
                        message: 'You pressed: "' + button + '"'
                     });
                  }
               });
            }
         });
      </script>
   </head>
   <body>
   </body>
</html>

它将产生以下结果 −

方向

此 API 显示当前设备的方向。以下示例显示当前方向。只要检测到任何变化，处理程序就会注册它。

Ext.device.Orientation.on('orientation', function(e) {
   var alpha = Math.round(e.alpha),
   beta = Math.round(e.beta),
   gamma = Math.round(e.gamma);
   console.log(alpha, beta, gamma);
});

sencha_touch_packaging.html

❮ 上一节 下一节 ❯