博客 RSS订阅

屏幕方向插件
作者: Vishal Mishra
2017年3月30日

最初发布于此PhoneGap 博客

Cordova 屏幕方向插件

最近发布了 cordova 屏幕方向插件的新版本(2.0.0)。该插件的目的是以一种通用的方式为所有主要平台设置/锁定屏幕方向。这个新版本符合 W3C 屏幕方向 API 中提到的规范,目前处于公开草案阶段。

该插件包含以下主要更新

  1. 锁定/解锁屏幕方向。
  2. 访问当前屏幕方向。
  3. 向 screen.orientation 对象添加了 'onchange' 事件处理程序。
  4. 一个演示应用程序。

锁定/解锁屏幕方向

可以使用以下代码将屏幕方向锁定为特定方向,例如,横向:

screen.orientation.lock('landscape').then(function success() {
    console.log("Successfully locked the orientation");
}, function error(errMsg) {
    console.log("Error locking the orientation :: " + errMsg);
});

以上代码将屏幕方向设备设置为任何横向模式(landscape-primary 或 landscape-secondary),具体取决于旋转。 screen.orientation.lock(OrientationLockType); 方法返回一个 Promise。成功设置方向后,它会解析一个 Promise。如果屏幕未成功锁定,Promise 将拒绝并返回 'NotSupportedError'。可以使用以下代码解锁屏幕方向:

screen.orientation.unlock();

以上代码使屏幕适应设备的默认方向。 unlock 方法不返回 Promise。

访问当前屏幕方向

可以使用以下方式访问当前屏幕方向:

console.log('Orientation is' + screen.orientation.type);

向 screen.orientation 对象添加 'onchange' 属性

'onchange' 事件处理程序的示例用法

screen.orientation.onchange = function(){
 	console.log(screen.orientation.type);
};

也可以将 'change' 事件添加到 screen.orientation 对象:

screen.orientation.addEventListener('change', function(){
 	console.log(screen.orientation.type);
});

演示应用程序

演示应用程序包含在 github 存储库中。将插件添加到其中后,演示应用程序允许用户使用 screen.orientation.lock() 方法测试方向类型。演示应用程序的详细说明 在此处