0

我想在 Sencha touch 2 应用程序中创建图像按钮。为此，我为按钮定义了一个 cls 属性并添加到 app.css 文件中。但是按钮的背景没有显示..

这是我的 index.html 类

    <!DOCTYPE html>
<!-- Auto Generated with Sencha Architect -->
<!-- Modifications to this file will be overwritten. -->
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Teritree</title>
    <script type="text/javascript" id="phonegap" src="cordova-1.8.1.js"></script>
    <script src="sencha-touch-all.js" type="text/javascript"></script> 
    <link rel="stylesheet" type="text/css" href="app.css"/>
    <script type="text/javascript" src="app/app.js"></script>
     <script>
        Ext.Loader.setConfig({ disableCaching: false });
        Ext.Ajax.setDisableCaching(false);    
    </script>
    <script type="text/javascript">
        if (!Ext.browser.is.WebKit) {
            alert("The current browser is unsupported.\n\nSupported browsers:\n" +
                "Google Chrome\n" +
                "Apple Safari\n" +
                "Mobile Safari (iOS)\n" +
                "Android Browser\n" +
                "BlackBerry Browser"
            );
        }
    </script>
</head>
<body></body>
</html>

这是我的按钮代码：

xtype: 'button',
                            docked: 'left',
                            cls: 'wishlogbtn',
                            height: 200,
                            margin: 50,
                            width: 150

我在 app.css 文件中添加了这一行：

  .wishlogbtn
{
    background-image: url('../wishlog.png');
}

我不知道我是否在做 coreect，因为我是这个平台的新手。请帮忙..

4

2 回答 2

1

我不确定，但你可以试试这个：

.wishlogbtn
{
    background-image: url('../wishlog.png') !important;
}

或者

.wishlogbtn
    {
-webkit-mask-image: url('../wishlog.png');
background: white;/*or smthing*/
}

如果所有其他都失败了，你可以只使用 html 属性

xtype:'button',
html:'<img src="..."/>'

<sencha_dir>\resources\themes\images\default\pictos\ 中还有很多可用的图标，您可以将它们包含在您的 .scss (SASS) 文件中

@include pictos-iconmask('user');/*replace "user" with any name of .png file in that folder"*/

然后你可以像在 sencha 中那样使用它：

xtype: 'button',
iconMask: true,
iconCls: 'user' /* use the same name as in .scss*/
于 2012-07-05T14:07:12.713 回答
0

我能够解决它。问题在于图像的路径。

于 2012-07-05T14:17:18.947 回答