Sencha touch 2 中的面板覆盖答案

【问题标题】：Panel overlay in Sencha touch 2Sencha touch 2 中的面板覆盖
【发布时间】：2012-05-04 07:59:01
【问题描述】：

我一直在使用 sencha touch 2 开发一个应用程序。
我在顶部有一个工具栏，其中包含一个按钮。
当我单击此按钮时，我将有一个面板覆盖。在这个面板中，我想要两个项目：

    var shareButton = {
                    xtype : 'button',
                    ui: 'action',
                    width:'36px',
                    height:'36px',  
                    handler : function(){ 
                    var panel=Ext.create('Ext.Panel',{
            right: 0,
            top: 20,
            modal: true,
            hideOnMaskTap: true,
            hidden: true,   
            width: 260,
            height:'70%' ,
        styleHtmlContent: true,
            scrollable: true,

items: [
{html:'<a href="https://twitter.com/share" class="twitter-share-button" data-url="https://www.google.com" data-lang="en">Tweet</a></body>',},
{html:'<div ><class="fb-like" data-href="http://test.com" data-send="false" data-layout="button_count" data-width="4" data-show-faces="false"></div>'}]});
    Ext.Viewport.add(panel);
    panel.show();}};

但这不起作用。
事实上，我希望第一个引导我到 twitter 分享 URL (www.google.com)。
第二个到 facebook 分享“test.com”。

不幸的是，面板中没有显示任何内容。
谢谢。

【问题讨论】：

标签： html facebook twitter panel sencha-touch-2

【解决方案1】：

由于在页面加载后调用了叠加层，因此应该再次呈现 facebook 和 twitter 按钮

这是显示叠加层后应添加的代码

FB.XFBML.parse();//facebook
$.ajax({ url: 'http://platform.twitter.com/widgets.js', dataType: 'script', cache:true}); //twitter

【讨论】：

【解决方案2】：

这对我有用。唯一的问题是 Facebook 的点赞按钮没有大小，所以你看不到它。

确保您的浮动面板不可滚动。如果它是可滚动的，给它一个固定的宽度和高度。

更新

这里是 Sencha Fiddle 的一个例子：http://www.senchafiddle.com/#jgXtj

确保您将面板添加到Ext.Viewport。

【讨论】：

我尝试了两种情况：1）可滚动且固定的宽度和高度 2）可滚动的 false .Not fixed
我按照您的示例进行操作。面板实际上正在工作，但没有出现类似 FB 的按钮，也没有显示 twitter 图标：S
只有单词 tweet 出现，允许我访问 twitter.com
是的，这是因为 Facebook 点赞按钮没有固定高度。因此，您需要在 CSS 中设置样式，或者使用该容器中的 width 和 height 属性。