Sencha Environment Detectionを探していた答えは簡単な手段を通じて大規模なスペクトルを提供しています。
NB:この値は、 "?deviceType ="をURLに追加することによっても見分けることができます。
http://localhost/mypage.html?deviceType=Tablet
Ext.os名前がシングルトンを返すです:
- のiOS
- Androidの橋渡し
- BlackBerryの
- RIMTablet
- MacOSの
- のWindows
- 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...
}
私はこのように見ましたが、これはデバイスがモバイルデバイスであるかタブレットであるかを指定したいという問題です。たとえば、Androidはタブレットまたはモバイルの両方で動作します。 –