resizable_dialog.html
<link rel="import" href="../../packages/polymer/polymer.html">
<link rel="import" href="../../packages/paper_elements/paper_dialog.html">
<link rel="import" href="../../packages/paper_elements/paper_button.html">
<link rel="import" href="../../packages/paper_elements/paper_tabs.html">
<link rel="import" href="../../packages/paper_elements/paper_tab.html">
<link rel="import" href="../../packages/paper_elements/paper_icon_button.html">
<link rel="import" href="../../packages/core_elements/core_toolbar.html">
<link rel="import" href="../../packages/core_elements/core_pages.html">
<polymer-element name="resizeable-dialog">
<template>
<style>
:host {
display: block;
}
</style>
<paper-button on-click="{{open}}">Open Dialog</paper-button>
<paper-dialog id="dialog" transition="core-transition-bottom" backdrop>
<paper-tabs selected="{{selected}}">
<paper-tab>Page 1</paper-tab>
<paper-tab>Page 2</paper-tab>
</paper-tabs>
<section>
<core-pages selected="{{selected}}">
<div style="width: 100px; height: 100px;">
<div>Page 1: 100x100</div>
<paper-button on-click="{{notifyResize}}">Call 'notifyResize'</paper-button>
</div>
<div style="width: 400px; height: 400px;">
<div>Page 2: 400x400</div>
<paper-button on-click="{{notifyResize}}">Call 'notifyResize'</paper-button>
</div>
</core-pages>
</section>
</paper-dialog>
</template>
<script type="application/dart" src="resizeable_dialog.dart"></script>
</polymer-element>
resizable_dialog.dart
library resizable_dialog;
import 'package:polymer/polymer.dart';
import 'package:paper_elements/paper_dialog.dart';
@CustomTag('resizeable-dialog')
class ResizeableDialog extends PolymerElement {
ResizeableDialog.created() : super.created();
@observable int selected = 0;
notifyResize() {
$['dialog'] as PaperDialog..notifyResize();
print('"notifyResize" called.');
}
open() {
$['dialog'] as PaperDialog..open();
}
}
这是我的对话,我认为您可以通过塔巴尔(Tabbar)明白。我的问题是<paper-dialog>
在显示之前在某个时候计算其尺寸。但是,由于我的<core-pages>
可以具有不同的宽度&amp;高度,我必须在用户选择选项卡以确保当前选定页面的整个内容时,我必须调整对话框的大小。
由于某些原因,DART中不存在该方法<paper-dialog>.notifyResize()
。它是在paper-elements
文档中指定的,但我无法调用它,因为它不存在于Dart中。
我该怎么做?如何要求对话框重新测量其尺寸?
您应该能够像
一样工作import 'dart:js' as js;
...
new js.JsObject.fromBrowserObject($['dialog'])
.callMethod('notifyResize', []);
或
import 'package:paper_elements/paper_dialog.dart';
...
($['dialog'] as PaperDialog).jsElement
.callMethod('notifyResize', []);
请在github.com/dart-lang/paper-elements repo(或core-elements)中创建一个错误报告,因为我认为此函数应从核心范围内继承)