如何在 Dart 中使用 window.matchMedia?
我找到了相应的方法:
MediaQueryList matchMedia(String query)
和“MediaQueryList”方法:
void addListener(MediaQueryListListener listener)
但是:MediaQueryListListener
没有构造函数,看起来像某种生成的 stub 。
我有JS example :
var mq = window.matchMedia( "(min-width: 500px)" );
// media query event handler
if (matchMedia) {
var mq = window.matchMedia("(min-width: 500px)");
mq.addListener(WidthChange);
WidthChange(mq);
}
// media query change
function WidthChange(mq) {
if (mq.matches) {
// window width is at least 500px
}
else {
// window width is less than 500px
}
}
并且它有很好的支持http://caniuse.com/#feat=matchmedia
最佳答案
如pointed in a comment目前似乎还没有在 Dart 中实现。
但是您可以使用 dart:js 来执行此操作:
import 'dart:js';
main() {
if (context['matchMedia'] != null) {
final mq = context.callMethod('matchMedia', ['(min-width: 500px)']);
mq.callMethod('addListener', [widthChange]);
widthChange(mq);
}
}
widthChange(mq) {
if (mq['matches']) {
print('window width is at least 500px');
} else {
print('window width is less than 500px');
}
}
关于media-queries - "matchMedia"Dart 支持,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19745361/