1

我最近发现使用 app2sdk 时可以访问一些fontawesome字体，效果非常好。例如，在这里我使用它们来显示拉力网格中的趋势箭头：

在此处输入图像描述

这比任何替代方案都容易得多，因为您可以像字体一样轻松地设置这些图标的样式（在本例中为颜色）。它还提供了许多可供使用的有用图标。

但是使用此功能是否明智？此功能在 rc2 中有效，但在 rc1 中无效，而且我认为它在任何地方都没有记录。有人知道它是否可能在 SDK 的未来版本中继续工作？

此外，并非所有图标都可用 - 这会在 Rally 中定期更新吗？

4

1 回答 1

2

我们有基于Entypo的 Rally 图标。这是一项正在进行的工作，因此字体可能会在未来发生变化，但它是 Rally 自己的设置，并不是所有的 Entypo 图标都可用。

您可以通过运行此自定义应用程序以编程方式找出 AppSDK2 给定版本中可用的“Rally”字体系列图标：

<!DOCTYPE html>
<html>
<head>
    <title>FontExplorer</title>

    <script type="text/javascript" src="/apps/2.0rc2/sdk.js"></script>

    <script type="text/javascript">
        Rally.onReady(function () {
                Ext.define('CustomApp', {
    extend: 'Rally.app.App',
    componentCls: 'app',
    launch: function() {
        var fontStyles = _.find(document.styleSheets, function(styleSheet) {
            return styleSheet.href.match(/rui-fonts\.css$/);
        });
        var iconRules = _.filter(fontStyles.rules, function(rule) { 
            return rule.selectorText && rule.selectorText.match(/\.icon\-\w+\:\:before/) && rule.style[0] === 'content';  
        });

        this.add(_.map(iconRules, function(cssRule) {
            var iconName = cssRule.selectorText.substring(1).replace('::before', '');
            return {
                xtype: 'component',
                html: '<span style="font-family:courier" >' + iconName + '</span>',
                style: {
                    fontSize: '20px',
                    display: 'block'
                },
                cls: iconName,
                listeners: {
                    afterrender: function() {
                        if(this.getEl().getStyle('fontFamily') !== 'Rally') {
                            this.destroy();
                        }
                    }
                }
            };    
        }, this));
    }
});


            Rally.launchApp('CustomApp', {
                name:"FontExplorer",
           parentRepos:""
            });

        });
    </script>


    <style type="text/css">
        .app {
     /* Add app styles here */
}

    </style>
</head>
<body></body>
</html>
于 2014-01-30T16:52:59.833 回答