聚合物纸对话框不居中 [英] Polymer paper-dialog not centered

问题描述

在我的聚合物应用程序中，当我使用iPhone打开纸质对话框时，它不居中，而不是使用Chrome或Safari使用桌面Mac或PC打开。

我动态地构造了paper-dialog元素并使用javascript将它放置在DOM模板中，然后调用 open（）：

  var d = document.createElement（'paper-dialog'）; 
 d.innerHTML =< h2>对话标题< / h2> 
< p>一些内容< / p>+ 
'< div class =buttons>'+ 
< paper-button>更多信息.. < / paper-button>+ 
<纸张 - 按钮对话框消失>拒绝< /纸张 - 按钮>+ 
<纸张按钮对话框 - 确认自动对焦>接受< / paper-button>+ 
< / div>; 
 var b = Polymer.dom（this.root）.appendChild（d）; 
 b.open（）; 
  

我没有使用任何特殊样式或媒体查询。
我以编程方式添加对话框的原因是因为我有许多不同的对话消息和不同的内容要在不同的时间显示，并且他们每个人都应该在不同的屏幕上调用回调，这取决于谁添加了对话框。换句话说，我需要添加我的对话框，如。

还修复了我的dialog-manager

In my polymer app, when I open a paper-dialog using an iPhone, it's not centered, as opposed to opening it using Chrome or Safari using the a desktop Mac or PC.

I'm dynamically constructing the paper-dialog element and placing it in the DOM template using javascript, and then calling open():

var d = document.createElement('paper-dialog');
d.innerHTML = "<h2>Dialog Title</h2>"
         "<p>some content</p>"+
         '<div class="buttons">'+
         "<paper-button >More Info...</paper-button>"+
         "<paper-button dialog-dismiss>Decline</paper-button>"+
         "<paper-button dialog-confirm autofocus>Accept</paper-button>"+
         "</div>";
var b = Polymer.dom(this.root).appendChild(d);
b.open();

I'm not using any special styles or media queries. The reason I'm adding the dialog programatically is because I have tons of different dialog messages and different contents to show at different times, and each of them should call a callback at a different screen, depends on who added the dialog. in other words, I need to have my dialogs added like in angular-material's $mdDialog, I know it's not that trivial for polymer, maybe not the intended use, but for my case that's what I need, unless there's a better way.

See screenshot of the problem below

iPhone:

Chrome:

解决方案

The issue was that I called b.open(); right after var b = Polymer.dom(this.root).appendChild(d);.

Since I add the element dynamically, I should have put b.open(); under a this.async() call, as mentioned in polymer's documentation for similar cases.

Also fixed the code in my dialog-manager

这篇关于聚合物纸对话框不居中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！