我们如何知道Dart中可触摸的屏幕？

Question

要开发响应式应用程序，我们需要知道用户是使用他的手指还是鼠标来调整应用程序的行为。例如，如果屏幕是可触摸的，则按钮会更大......

我们可以收听Window.onTouch个事件和Window.onMouse个事件来猜测屏幕是否可触摸。

但我想在应用程序加载时知道它：在用户进行任何交互之前。

我该怎么做？

Answer 1

您可以使用dart:js并使用此回答https://stackoverflow.com/a/2915912/217408

中显示的方法

将其添加到index.html

<script type="application/javascript">
  function hasTouchSupport() {
    return 'ontouchstart' in document.documentElement;
  }
</script>

从Dart调用它

import 'dart:html';
import 'dart:js' as js;

bool _hasTouchSupport;
bool get hasTouchSupport {
  if(_hasTouchSupport == null) {
    _hasTouchSupport = js.context.callMethod('hasTouchSupport');
  }
  return _hasTouchSupport;
}

void main() {
  print(hasTouchSupport);
}

Linux中的Dartium / Chrome中的

false 我的Android手机上的true

Answer 2

根据What's the best way to detect a 'touch screen' device using JavaScript?，要找到适用于所有浏览器的内容并不容易。

如果您使用Modernizr，则可以使用：

 import 'dart:js' as js;

 bool get isTouchDevice => js.context['Modernizr']['touch'];