我有一个应用程序,我尝试在 android 和 iphone 上使用 sencha touch 2 框架开发。我希望应用程序方向仅设置为纵向,除了一个视图。如果设备方向为“纵向”,则此视图将加载纵向视图;如果设备方向为“横向”,则此视图将加载横向视图
目前我在android上使用phonegap,我将方向固定为纵向。
但是在创建将根据方向加载“纵向视图”或“横向视图”的视图时,我非常迷茫。如果我在 phonegap 中将方向固定为纵向,还会检测到方向吗?
谢谢你的帮助
我有一个应用程序,我尝试在 android 和 iphone 上使用 sencha touch 2 框架开发。我希望应用程序方向仅设置为纵向,除了一个视图。如果设备方向为“纵向”,则此视图将加载纵向视图;如果设备方向为“横向”,则此视图将加载横向视图
目前我在android上使用phonegap,我将方向固定为纵向。
但是在创建将根据方向加载“纵向视图”或“横向视图”的视图时,我非常迷茫。如果我在 phonegap 中将方向固定为纵向,还会检测到方向吗?
谢谢你的帮助
我的问题没有任何答案,我会回答自己。
例如,在 Android (phonegap) 上,在清单中定义方向为:
安卓:screenOrientation="传感器"
然后,在 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。
希望有帮助!
在您希望标准方向的一个视图上,添加一个自定义值,例如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);
}
});