sencha touch 2 将设备方向设置为纵向，横向除外 1 个视图答案

【问题标题】：sencha touch 2 stick device orientation to portrait except landscape for 1 viewsencha touch 2 将设备方向设置为纵向，横向除外 1 个视图
【发布时间】：2012-04-23 18:49:57
【问题描述】：

我有一个应用程序，我尝试在 android 和 iphone 上使用 sencha touch 2 框架进行开发。我希望应用程序方向仅设置为纵向，除了一个视图。如果设备方向为“纵向”，则此视图将加载纵向视图；如果设备方向为“横向”，则此视图将加载横向视图

目前我在 android 上使用 phonegap，我已将方向固定为纵向。

但是在创建将根据方向加载“纵向视图”或“横向视图”的视图时，我很迷茫。如果我在 phonegap 中将方向固定为纵向，也会检测到方向吗？

感谢您的帮助

【问题讨论】：

标签： cordova sencha-touch-2

【解决方案1】：

如果我的问题没有任何答案，我会回答自己。

例如，在 Android (phonegap) 上，在清单中将方向定义为：

android:screenOrientation="sensor"

然后，在 Activity 中启动应用程序之前，如果您希望应用程序使用 Portrait 只需将其设置为 Portrait ： setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT); super.loadUrl("file:///android_asset/www/index.html");

在您的 JS 中，当您想要使用横向/纵向时，向主应用程序发送一个命令，其中包含一个调用自定义 setOrientation 代码的操作：

onSetOrientationSuccess: function(result) {
    ...
},
onSetOrientationError: function(err) {
    ... 
},

setOrientation: function(orientation) {

    PhoneGap.exec(this.onSetOrientationSuccess, this.onSetOrientationError, "OrientationPlugin", orientation, []);
},

OrientationPlugin 只是一个简单的 phonegap 插件，您可以在其中检查操作并调用正确的代码：

public class OrientationPlugin extends Plugin {

public static final String ACTION="undefined";

@Override
public PluginResult execute(String action, JSONArray data, String callbackId) {
    Log.d("OrientationPlugin", "Plugin called");
    PluginResult result = null;
    YourActivity activity = (YourActivity) this.ctx;
    Log.d("OrientationPlugin", "Plugin Got context");

    if (ACTION.equals(action)) {
        Log.d("OrientationPlugin", "Plugin set SCREEN_ORIENTATION_SENSOR");         
        activity.setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_SENSOR);
    }
    else {
        Log.d("OrientationPlugin", "Plugin set SCREEN_ORIENTATION_PORTRAIT");               
        activity.setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);         
    }
    Log.d("OrientationPlugin", "Plugin set ALL OK");            
    result = new PluginResult(Status.OK, "ok");
    return result;
}

}

然后，您可以随时从 JS 中将其设置回 PORTRAIT。

希望有所帮助！

【讨论】：

【解决方案2】：

在您希望标准方向的一个视图中，添加一个自定义值，例如 doLandscape: 1。我喜欢在 app.config.Runtime 类中设置运行时“全局”值，否则我会将它附加到导航栏，如果它适用于整个应用程序。

Ext.define(‘MyApp.config.Runtime’,{
    singleton : true,
    config : {
        doLandscape: 0   // initialize to 0
    },
    constructor : function(config){
        this.initConfig(config);
    }
});

在视口上，添加：

onOrientationChange: function(viewport, orientation, width, height) {
    // test trigger and values
    console.log('o:' + orientation + ' w:' + width + ' h:' + height);

    if (orientation == 'landscape' && MyApp.config.Runtime.doLandscape === 0) {
        // most often this is all that's needed to prevent change
        return false;

        // alternatively / additionally set it back to portrait manually.
        viewport.orientation = this.PORTRAIT;
    }
}

查看更新后的源代码，这是处理和触发方向更改的视口默认代码。

onOrientationChange: function() {
    var currentOrientation = this.getOrientation(),
        newOrientation = this.determineOrientation();

    if (newOrientation !== currentOrientation) {
        this.fireOrientationChangeEvent(newOrientation, currentOrientation);
    }
},

fireOrientationChangeEvent: function(newOrientation, oldOrientation) {
    var clsPrefix = Ext.baseCSSPrefix;
    Ext.getBody().replaceCls(clsPrefix + oldOrientation, clsPrefix + newOrientation);

    this.orientation = newOrientation;

    this.updateSize();
    this.fireEvent('orientationchange', this, newOrientation, this.windowWidth, this.windowHeight);
}

当您打包原生时，此选项可作为另一种选择：

Ext.device.Orientation.on({
    scope: this,
    orientationchange: function(e) {
        console.log('Alpha: ', e.alpha);
        console.log('Beta: ', e.beta);
        console.log('Gamma: ', e.gamma);
    }
});

【讨论】：