【问题标题】:Device check in sencha touch 2sencha touch 2 中的设备检查
【发布时间】:2012-06-01 13:08:48
【问题描述】:

我确定我只是忽略了这个问题,但我似乎找不到如何检查设备。
我想检查设备是手机、横向模式的平板电脑、纵向模式的平板电脑还是其他设备(计算机)。

我拥有的是这样的:

if (Ext.platform.isPhone) {
    console.log("phone");
}

if (Ext.platform.isTablet) {
    console.log("tablet");
}

var x = Ext.platform;

但是平台是未定义的(可能是因为这是Sencha Touch 1的方式)。

有人知道我访问设备检查的正确位置吗?

【问题讨论】:

    标签: sencha-touch-2


    【解决方案1】:

    Sencha Environment Detection 通过简单的方式提供大范围的频谱。

    除了 Ext.os.is.Tablet,您可以通过 Ext.os.deviceType 让生活更轻松,这将返回:

    • 电话
    • 平板电脑
    • 桌面

    注意:这个值也可以通过在 url 中添加“?deviceType=”来伪造。

    http://localhost/mypage.html?deviceType=Tablet
    

    Ext.os.name 是单例返回:

    • iOS
    • 安卓
    • 网络操作系统
    • 黑莓
    • RIMTablet
    • MacOS
    • 窗口
    • Linux
    • 八达
    • 其他

    通过Ext.browser.name可以使用通常的浏览器检测功能。

    我最近才遇到的东西,我喜欢的是特征检测 - 允许基于设备能力进行类似于 Modernizr / YepNope 的编码。 Ext.feature 提供:

    • Ext.feature.has.Audio
    • Ext.feature.has.Canvas
    • Ext.feature.has.ClassList
    • Ext.feature.has.CreateContextualFragment
    • Ext.feature.has.Css3dTransforms
    • Ext.feature.has.CssAnimations
    • Ext.feature.has.CssTransforms
    • Ext.feature.has.CssTransitions
    • Ext.feature.has.DeviceMotion
    • Ext.feature.has.Geolocation
    • Ext.feature.has.History
    • Ext.feature.has.Orientation
    • Ext.feature.has.OrientationChange
    • Ext.feature.has.Range
    • Ext.feature.has.SqlDatabase
    • Ext.feature.has.Svg
    • Ext.feature.has.Touch
    • Ext.feature.has.Video
    • Ext.feature.has.Vml
    • Ext.feature.has.WebSockets

    在 iOS 上检测全屏/应用/主屏浏览器模式:

    window.navigator.standalone == true
    

    方向Ext.device.Orientation和方向变化:

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

    方向基于视口。我通常会添加一个更可靠的监听器:

       onOrientationChange: function(viewport, orientation, width, height) {
            // test trigger and values
            console.log('o:' + orientation + ' w:' + width + ' h:' + height);
    
            if (width > height) {
                orientation = 'landscape';
            } else {
                orientation = 'portrait';
            }
            // add handlers here...
        }
    

    【讨论】:

      【解决方案2】:

      使用Ext.env.OS'sis()方法。

      请注意,只有版本的主要组件和简化值是 可通过直接财产检查获得。支持的值为:iOS、 iPad、iPhone、iPod、Android、WebOS、黑莓、Bada、MacOS、Windows、 Linux 及其他

      if (Ext.os.is('Android')) { ... }
      if (Ext.os.is.Android2) { ... } // Equivalent to (Ext.os.is.Android && Ext.os.version.equals(2))
      
      if (Ext.os.is.iOS32) { ... } // Equivalent to (Ext.os.is.iOS && Ext.os.version.equals(3.2))
      

      或者,您也可以使用PhoneGap Device API

      【讨论】:

      • 我确实看到了这种方式,但是这样做的问题是我还想指定设备是移动设备还是平板电脑。例如,Android 可以在平板电脑或移动设备上运行。
      【解决方案3】:

      我找到了答案:

      Ext.os.is.(平板电脑/手机或其他)似乎是真实的或未定义的。如果不是这种情况,它将是未定义的。 I.a. Ext.os.is.Tablet 在平板电脑上为真,在非平板电脑上为 undefined。

      这就是我一直在寻找的答案

      if(Ext.os.is.Tablet){
              this._bIsTablet = true;
          }else if(Ext.os.is.Phone){
              this._bIsPhone = true;
          }else{
              this._bIsOther = true;
          }
      

      【讨论】:

        猜你喜欢
        • 2014-06-02
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2013-11-14
        • 1970-01-01
        • 2013-08-21
        • 2012-06-08
        • 1970-01-01
        相关资源
        最近更新 更多