README

用于在Yii2中实现FezVrasta的新版Bootstrap材料设计（MDB 6）的Composer包 https://github.com/mdbootstrap/mdb-ui-kit

安装

首选的安装方式是通过Composer。

composer require exocet/yii2-bootstrap-material-design

使用

要加载MDB的CSS和JS文件，将MaterialAsset集成到您的应用程序中。有两种方法可以实现这一点：在主布局中注册资产

// @app/views/layouts/main.php

\exocet\bootstrap5md\MaterialAsset::register($this); // include css and js
\exocet\bootstrap5md\FontawesomeAsset::register($this); // include icons (optional)
// further code

或者在应用程序范围内的AppAsset.php中作为依赖项

// @app/assets/AppAsset.php

public $depends = [
    // include mdb assets
    'exocet\bootstrap5md\MaterialAsset',
    
    // include Fontawesome icons (optional)
    'exocet\bootstrap5md\FontawesomeAsset',

    // include material icons (optional)
    'exocet\bootstrap5md\MaterialIconsAsset',
    
    // more dependencies
    //...
];

为了使其正常工作，文件必须进行修改以接受与原始Bootstrap相同的设置。因此，我们必须在composer.json中添加以下内容，以确保它始终自动完成。

    "scripts": {
        "post-install-cmd": [
            "@composer run-script post-install-cmd --working-dir=vendor/exocet/yii2-bootstrap-material-design"
        ],
        "post-update-cmd": [
            "@composer run-script post-update-cmd --working-dir=vendor/exocet/yii2-bootstrap-material-design"
        ]
    }

小部件

此附加组件通过替换依赖项为MDB依赖项，并纠正某些组件中HTML的生成方式，使其与MDB的使用方式一致，从而扩展了Bootstrap 5。

为此，我们必须按照以下方式覆盖原始AssetBundle

// @app/config/web.php
'components' => [
    'assetManager' => [
        'bundles' => [
            'yii\bootstrap5\BootstrapAsset' => [
                'class' => \exocet\bootstrap5md\BootstrapAsset::class,
            ],
            'yii\bootstrap5\BootstrapPluginAsset' => [
                'class' => \exocet\bootstrap5md\BootstrapPluginAsset::class,
            ],
        ],
    ],

最好与https://github.com/kartik-v/yii2-widgets一起使用。

Gii支持

如果您使用Gii创建CRUD控制器和视图文件，可以通过集成修改后的Gii模板来获取材料化视图文件。

// @app/config/main-local.php

$config['modules']['gii'] = [
    'class' => 'yii\gii\Module',      
    'allowedIPs' => ['127.0.0.1', '::1'],  
    'generators' => [
        'crud' => [
            'class' => 'yii\gii\generators\crud\Generator',
            'templates' => [
                'material-bootstrap' => '@vendor/exocet/yii2-bootstrap-material-design/src/generators/crud',
            ]
        ]
    ],
];

您可以复制这些模板到您希望的任何位置进行进一步定制。确保在配置中相应地修改路径。