Esta extensión proporciona un paquete de activos con fuente impresionante para aplicaciones YII Framework 2.0 y auxil para usar iconos.
Para obtener información sobre la licencia, consulte el archivo de licencia.
| Versión de Font-Awesome | Versión de la extensión |
|---|---|
| 4.* | ~ 2.17 |
| 5.* | ~ 3.0 |
3.2 Tenga cuidado en la versión 3.2 rmrevinyiifontawesomeAssetBundle Package Use CDN de forma predeterminada. Más en el ChangeLog.
3.0Tenga cuidado en la versión 3.0 Los métodos desactivados se eliminaron. Más en el ChangeLog.
2.17Tenga cuidado en la versión 2.17 se eliminaron los métodos desactivados. Más en el ChangeLog.
La forma preferida de instalar esta extensión es a través del compositor.
O CORRE
composer require " rmrevin/yii2-fontawesome:~3.5 "o agregar
"rmrevin/yii2-fontawesome": "~3.5",
a la sección require su archivo composer.json .
Registre su dominio aquí-https://fontawesome.com/how-to-use/on-the-web/setup/getting-started
Agregue CdnProAssetBundle como depende de su paquete de activos de aplicación:
class AppAsset extends AssetBundle
{
// ...
public $ depends = [
// ...
' rmrevinyiifontawesomeCdnProAssetBundle '
];
} O inyectar CdnProAssetBundle en su opinión:
rmrevin yii fontawesome CdnProAssetBundle:: register ( $ this );Instale el paquete de fuente NPM:
npm install @fortawesome/fontawesome-pro
o
yarn add @fortawesome/fontawesome-pro
Y agregue NpmProAssetBundle como depende de su paquete de activos de aplicación:
class AppAsset extends AssetBundle
{
// ...
public $ depends = [
// ...
' rmrevinyiifontawesomeNpmProAssetBundle '
];
} O inyectar NpmProAssetBundle en su opinión:
rmrevin yii fontawesome NpmProAssetBundle:: register ( $ this ); Para no instalar la versión gratuita del paquete de fuentes, puede agregarla a la sección replace composer.json .
"replace": {
"fortawesome/font-awesome": "*"
},
Agregue CdnFreeAssetBundle como depende de su paquete de activos de aplicación:
class AppAsset extends AssetBundle
{
// ...
public $ depends = [
// ...
' rmrevinyiifontawesomeCdnFreeAssetBundle '
];
} O inyectar CdnFreeAssetBundle en su opinión:
rmrevin yii fontawesome CdnFreeAssetBundle:: register ( $ this ); Versión gratuita del paquete fortawesome/font-awesome ya instalado en el proveedor.
Agregue NpmFreeAssetBundle como depende de su paquete de activos de aplicación:
class AppAsset extends AssetBundle
{
// ...
public $ depends = [
// ...
' rmrevinyiifontawesomeNpmFreeAssetBundle '
];
} O inyectar NpmFreeAssetBundle en su opinión:
rmrevin yii fontawesome NpmFreeAssetBundle:: register ( $ this ); Espacio de nombres: rmrevinyiifontawesome ;
FAB , FAL , FAR , FAS o FontAwesomestatic FAR::icon($name, $options=[]) - Crea un componentIcon que se puede usar para fondais$name - Nombre del icono en Font Awesome Set.$options : atributos adicionales para la etiqueta HTML i.fastatic FAR::stack($name, $options=[]) - crea un componentStack que se puede usar para fontawesome html icon$options - Atributos adicionales para la etiqueta HTML span.fa-stack .componentIcon(string)$Icon - icono de renderizado$Icon->addCssClass($value) - agregar a la clase CSS de etiqueta html en $value$value - Nombre de la clase CSS$Icon->inverse() -Agregar a la clase HTML CSS Class fa-inverse$Icon->spin() -Agregar a la etiqueta HTML CSS Class fa-spin$Icon->fixedWidth() -Agregar a la clase HTML CSS Class fa-fw$Icon->ul() -Agregar a la etiqueta HTML CSS Class fa-ul$Icon->li() -Agregar a la clase HTML CSS Class fa-li$Icon->border() -Agregar a la etiqueta HTML CSS Class fa-border$Icon->pullLeft() -Agregar a la clase HTML CSS Class pull-left$Icon->pullRight() -Agregar a la etiqueta HTML CSS Class pull-right$Icon->size($value) : agregue a la clase CSS de etiqueta HTML con tamaño$value - valor de tamaño (variantes: FA::SIZE_LARGE , FA::SIZE_2X , FA::SIZE_3X , FA::SIZE_4X , FA::SIZE_5X )$Icon->rotate($value) : agregar a la clase CSS de etiqueta HTML con rotación$value - Rotate Value (Variants: FA::ROTATE_90 , FA::ROTATE_180 , FA::ROTATE_270 )$Icon->flip($value) - Agregar a la clase CSS de etiqueta HTML con rotación$value - valor flip (variantes: FA::FLIP_HORIZONTAL , FA::FLIP_VERTICAL )componentStack(string)$Stack - Render icon Stack$Stack->icon($icon, $options=[]) - Establecer icono para pila$icon - nombre de icono o componentIcon objeto$options : atributos adicionales para la etiqueta HTML icon.$Stack->icon($icon, $options=[]) - Establecer icono de fondo para pila$icon - nombre de icono o componentIcon objeto$options : atributos adicionales para la etiqueta HTML icon. use rmrevin yii fontawesome FAS ;
// or (only in pro version https://fontawesome.com/pro)
// use rmrevinyiifontawesomeFAR;
// use rmrevinyiifontawesomeFAL;
// use rmrevinyiifontawesomeFAB;
// normal use
echo FAS :: icon ( ' home ' ); // <i class="fas fa-home"></i>
// shortcut
echo FAS :: i ( ' home ' ); // <i class="fas fa-home"></i>
// icon with additional attributes
echo FAS :: icon (
' arrow-left ' ,
[ ' class ' => ' big ' , ' data-role ' => ' arrow ' ]
); // <i class="big fas fa-arrow-left" data-role="arrow"></i>
// icon in button
echo Html:: submitButton (
Yii:: t ( ' app ' , ' {icon} Save ' , [ ' icon ' => FAS :: icon ( ' check ' )])
); // <button type="submit"><i class="fas fa-check"></i> Save</button>
// icon with additional methods
echo FAS :: icon ( ' cog ' )-> inverse (); // <i class="fas fa-cog fa-inverse"></i>
echo FAS :: icon ( ' cog ' )-> spin (); // <i class="fas fa-cog fa-spin"></i>
echo FAS :: icon ( ' cog ' )-> fixedWidth (); // <i class="fas fa-cog fa-fw"></i>
echo FAS :: icon ( ' cog ' )-> li (); // <i class="fas fa-cog fa-li"></i>
echo FAS :: icon ( ' cog ' )-> border (); // <i class="fas fa-cog fa-border"></i>
echo FAS :: icon ( ' cog ' )-> pullLeft (); // <i class="fas fa-cog pull-left"></i>
echo FAS :: icon ( ' cog ' )-> pullRight (); // <i class="fas fa-cog pull-right"></i>
// icon size
echo FAS :: icon ( ' cog ' )-> size ( FAS :: SIZE_3X );
// values: FAS::SIZE_LARGE, FAS::SIZE_2X, FAS::SIZE_3X, FAS::SIZE_4X, FAS::SIZE_5X
// <i class="fas fa-cog fa-size-3x"></i>
// icon rotate
echo FAS :: icon ( ' cog ' )-> rotate ( FAS :: ROTATE_90 );
// values: FAS::ROTATE_90, FAS::ROTATE_180, FAS::ROTATE_180
// <i class="fas fa-cog fa-rotate-90"></i>
// icon flip
echo FAS :: icon ( ' cog ' )-> flip ( FAS :: FLIP_VERTICAL );
// values: FAS::FLIP_HORIZONTAL, FAS::FLIP_VERTICAL
// <i class="fas fa-cog fa-flip-vertical"></i>
// icon with multiple methods
echo FAS :: icon ( ' cog ' )
-> spin ()
-> fixedWidth ()
-> pullLeft ()
-> size ( FAS :: SIZE_LARGE );
// <i class="fas fa-cog fa-spin fa-fw pull-left fa-size-lg"></i>
// icons stack
echo FAS :: stack ()
-> icon ( ' twitter ' )
-> on ( ' square-o ' );
// <span class="fa-stack">
// <i class="fas fa-square-o fa-stack-2x"></i>
// <i class="fas fa-twitter fa-stack-1x"></i>
// </span>
// icons stack with additional attributes
echo FAS :: stack ([ ' data-role ' => ' stacked-icon ' ])
-> on ( FAS :: Icon ( ' square ' )-> inverse ())
-> icon ( FAS :: Icon ( ' cog ' )-> spin ());
// <span class="fa-stack" data-role="stacked-icon">
// <i class="fas fa-square-o fa-inverse fa-stack-2x"></i>
// <i class="fas fa-cog fa-spin fa-stack-1x"></i>
// </span>
// Stacking text and icons
echo FAS :: stack ()
-> on ( FAS :: Icon ( ' square ' ))
-> text ( ' 1 ' );
// <span class="fa-stack">
// <i class="fas fa-square fa-stack-2x"></i>
// <span class="fa-stack-1x">1</span>
// </span>
// Stacking text and icons with options
echo FAS :: stack ()
-> on ( FAS :: Icon ( ' square ' ))
-> text ( ' 1 ' , [ ' tag ' => ' strong ' , ' class ' => ' stacked-text ' ]);
// <span class="fa-stack">
// <i class="fas fa-square fa-stack-2x"></i>
// <strong class="stacked-text fa-stack-1x">1</strong>
// </span>
// Now you can add some css for vertical text positioning:
. stacked-text { margin-top: .3 em; }
// unordered list icons
echo FAS :: ul ([ ' data-role ' => ' unordered-list ' ])
-> item ( ' Bullet item ' , [ ' icon ' => ' circle ' ])
-> item ( ' Checked item ' , [ ' icon ' => ' check ' ]);
// <ul class="fa-ul" data-role="unordered-list">
// <li><i class="fas fa-circle fa-li"></i>Bullet item</li>
// <li><i class="fas fa-check fa-li"></i>Checked Item</li>
// </span>
// autocomplete icons name in IDE
echo FAS :: icon ( FAS :: _COG );
echo FAS :: icon ( FAS :: _DESKTOP );
echo FAS :: stack ()
-> on ( FAS :: _CIRCLE_O )
-> icon ( FAS :: _TWITTER );