README

yii2-icons

此扩展提供了一种简单的方法来设置各种图标框架以与 Yii Framework 2.0 一起使用。目前支持最流行和免费的图标框架。根据需求和反馈，此列表可能在将来扩展。

Bootstrap Glyphicons
Font Awesome
Unicode Icons: Krajee 提供的作为 CSS 图标的 Unicode 符号集合
Elusive Icons
Typicons
Web Hosting Hub Glyphs
JQuery UI Icons
Socicon Icons: 需要您添加图标来源的归属。
Octicons: Github 图标集合
Flag-Icons
Open Iconic Icons
IcoFont Icons

演示

您可以在这里看到演示，并在API 代码文档中了解如何使用此扩展（包括文档和示例）。

安装

安装此扩展的首选方式是通过 composer。

注意：请检查此扩展的 composer.json 以获取其需求和依赖项。阅读此 web 提示 /wiki 了解如何设置您应用程序的 composer.json 的 minimum-stability 设置。

运行

$ php composer.phar require kartik-v/yii2-icons "@dev"

或添加

"kartik-v/yii2-icons": "@dev"

到您的 composer.json 文件的 require 部分。

使用方法

全局设置

如果您想全局设置一个图标框架，请将 icon-framework 参数设置在您的 Yii 配置文件的 params 数组中。

'params' => [
  'icon-framework' => \kartik\icons\Icon::FAS,  // Font Awesome Icon framework
]

要初始化全局设置的框架，请在您的视图或视图布局文件中调用此代码。

use kartik\icons\Icon;
Icon::map($this);

视图设置

您也可以像下面这样在视图或视图布局中单独调用每个图标框架。在每个视图中映射任何图标框架，如下例所示。

use kartik\icons\Icon;
Icon::map($this, Icon::EL); // Maps the Elusive icon font framework

显示图标

在将图标框架映射到上述选项之一后，您可以使用 Icon::show 方法显示图标。图标可以使用以下选项之一显示

use kartik\icons\Icon;

// Option 1: Uses the `icon-framework` setup in Yii config params. 
echo Icon::show('user'); 

// Option 2: Specific Icon Call in a view. Additional options can also be passed to style the icon.
echo Icon::show('user', ['class'=>'fa-2x', 'framework' => Icon::FAS]);

注意：kartik\icons\Icon::show 方法输出 HTML 格式的文本。因此，为了在 Yii-2 组件（如 Navbar 或 Nav）中显示图标，您必须将 encodeLabels 设置为 false。

$items = [
    ['label' => Icon::show('home') . 'Home', 'url' => ['/site/index']],
];

// Your other code

/* Note you must encodeLabels to false to display icons in labels */
echo \kartik\nav\NavX::widget([
    'items' => $items,
    'encodeLabels' => false
]);

// Your other code

显示堆叠图标

您还可以显示堆叠图标，例如支持 Font Awesome 的框架。例如

use kartik\icons\Icon;
// fa-twitter on fa-square
 Icon::showStack('twitter', 'square', ['class'=>'fa-lg'], ['framework' => Icon::FAB], ['framework' => Icon::FAR])

// fa-flag on fa-circle
 Icon::showStack('flag', 'circle', ['class'=>'fa-lg'], ['class'=>'fa-inverse']);

添加自定义图标

您可以将自定义图标集添加到可用框架的列表中。

use kartik\icons\Icon;
// add framework
Icon::addFramework('custom', [
    'class' => '\common\icons\CustomIconAsset',
    'prefix' => 'custom-icon',
]);

// map to view file
Icon::map($this, 'custom');

// show the icon
echo Icon::show('menu',['framework' => 'custom']);

namespace common\icons;
class CustomIconAsset extends \yii\web\AssetBundle
{
    public $sourcePath = '@common/icons/assets/custom';
    public $depends = array(
        'yii\web\YiiAsset',
        'yii\bootstrap4\BootstrapAsset'
    );
    public $css=[
        'css/animation.css',
        'css/custom-codes.css',
        'css/custom-embedded.css',
        'css/custom-ie7.css',
        'css/custom-ie7-codes.css',
        'css/custom.css',
    ];
}

上述资源包使用由 http://fontello.com/ 生成的文件。

许可证

yii2-icons 在 BSD-3-Clause 许可证下发布。有关详细信息，请参阅捆绑的 LICENSE.md 文件。

kartik-v / yii2-icons

维护者

详细信息