philippfrenzel/yiimetroui

Yii2 MetroUI Widget 扩展

维护者

详情

github.com/philippfrenzel/yiimetroui

主页

源代码

问题

安装次数: 145

依赖者: 0

建议者: 0

安全: 0

星标: 2

关注者: 1

分支: 2

开放问题: 0

语言:CSS

类型:yii2-extension

dev-master 2014-05-15 11:47 UTC

Requires

BSD-3-Clause 7823b495ac19134418070fe0e59222c43404bd75

extensionyiimetrouiyii2

This package is not auto-updated.

Last update: 2024-09-23 14:07:55 UTC

README

yiimetroui

yii metroui 扩展

此扩展将在 yii2 基础上构建，目前处于开发状态。如果您想查看并改进它，非常欢迎！

由于我不是受过教育的程序员，部分代码可能很糟糕，但我试图从其他我认为技术高超的开发者那里学习！：）

如果您有任何问题，请随时联系我！

philipp at frenzel dot net

安装

将源添加到您的 composer.json > repositories 文件中

{
    "type": "package",
    "package": {
        "name": "yiiext/yiimetroui",
        "version": "0.1.10",
        "authors": [
            {
                "name": "Philipp Frenzel",
                "homepage": "http://frenzel.net"
            }
        ],
        "source": {
            "url": "https://github.com/philippfrenzel/yiimetroui.git",
            "type": "git",
            "reference": "master"
        },
        "autoload": {
            "psr-0": { "yiimetroui\\": "/" }
        }
    }
}

虽然该包已在 packagist.org 注册，所以您只需添加一行代码即可运行！

"require": {
        "yiisoft/yii2": "dev-master",
        "yiisoft/yii2-composer":"dev-master",
        "philippfrenzel/yiimetroui":"*"
},

重要

将 class="metrouicss" 添加到您的 body 中

<body class="metrouicss">

MetroUI 已经加载了吗？

  • 由于我使用 assetparser 扩展将 less 文件解析到我的发行版中，所以我注释了 assets.php 以避免静态 CSS 加载。如果您需要以静态方式加载 CSS 文件，请取消注释条目！

将以下行添加到 /www 下的 index.php 中

Yii::setAlias('@yiimetroui', __DIR__ . '/../vendor/philippfrenzel/yiimetroui/yiimetroui/');

用法

手风琴（折叠）

将以下代码放入您的视图文件中并享受它！

use yiimetroui\Accordion;

echo Accordion::widget(array(
	'Accordion Group Label'=>array(
			// required, the content (HTML) of the group
			'content'=>'Anim pariatur cliche...',
			// optional the HTML attributes of the content group
	       'contentOptions'=> array(),
	       // optional the HTML attributes of the group
	       'options'=> array(),
		),
	)
));

轮播

将以下代码放入您的视图文件中并享受它！

use yiimetroui\Carousel;

echo Carousel::widget(array(
	'items'=>array(
		array(
			'content'=>'<img src="http://lorempixel.com/550/200/animals"/>',
			'id'=>'slide1',
		),
		array(
			'content'=>'<img src="http://lorempixel.com/550/200/sports"/>',
			'id'=>'slide2',
		)
	),
	'options'=>array(
		'style'=>'height:200px',
	)
));

标签页

将以下代码放入您的视图文件中并享受它！

注意，为了简化，启动时总是显示第一个标签页

use yiimetroui\Tabs;

echo Tabs::widget(array(
     'items' => array(
         array(
             'header' => 'One',
             'content' => 'Mauris mauris ante, blandit et, ultrices a, suscipit eget...',
         ),
         array(
             'header' => 'Two',
             'headerOptions' => array(...),
             'content' => 'Sed non urna. Phasellus eu ligula. Vestibulum sit amet purus...',
             'options' => array(...),
         ),
     ),
));

磁贴

将以下代码放入您的视图文件中并享受它！

use yiimetroui\Tile;

echo Tile::widget(array(
    'items'=>array(
        array(
            'content'=>'<i class="icon-github"></i>',
            'brand'=>'<div class="name">Frenzel.NET</div>',                    
        ),
    ),
    'options'=>array('class'=>'icon bg-color-green'),
));