Question

我想在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');
}

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

Answer 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="..."/>'

＆lt; sencha_dir＆gt; \ 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*/

Answer 2

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

如何在sencha touch中创建图像按钮？

2 个答案: