qcubed/plugin_bootstrap

QCubed 对 Twitter Bootstrap 的封装。

安装次数: 170

依赖: 0

建议者: 0

安全: 0

星标: 2

关注者: 10

分支: 5

开放问题: 4

类型:qcubed-plugin

v1.0.2 2016-05-24 16:55 UTC

This package is not auto-updated.

Last update: 2024-09-14 19:04:00 UTC


README

QCubed 插件,用于简化 Twitter Bootstrap 的集成

安装

  1. 使用 Composer 安装插件和 Twitter Bootstrap。从主安装目录的命令行执行以下命令
	composer require qcubed/plugin_bootstrap
	composer require twbs/bootstrap
  1. 接下来,您可能需要在其配置.inc.php 文件中设置一些配置设置。

BOOTSTRAP_CSS

此文件的默认设置是

	define ('__BOOTSTRAP_CSS__', __VENDOR_ASSETS__. '/twbs/bootstrap/dist/css/bootstrap.min.css');

如果您正在编译自己的自定义版本的 bootstrap css 文件,只需将此定义设置为指向您的版本。

  1. 将基础类指向 Bootstrap 类,以便它们添加其功能。

在您的项目/includes/controls/QControl.class.php 文件中,让您的 QControl 继承自基础类。例如,您应该将第一行更改为

abstract class QControl extends QCubed\Plugin\Bootstrap\Control {

BOOTSTRAP_JS

此插件中包含的默认机制仅加载需要它的插件小部件的 bootstrap.js 文件。如果您正在手动编码一些也需要 bootstrap.js 的 bootstrap 表单,您应该执行以下两个操作以避免加载多个 bootstrap.js 文件

  1. 在您的配置.inc.php 文件中定义 BOOTSTRAP_JS 并将其指向您希望的 bootstrap js 文件,如下所示
	define ('__BOOTSTRAP_JS__', __VENDOR_ASSETS__ . '/twbs/bootstrap/dist/js/bootstrap.js'); (or bootstrap.min.js if you prefer)
  1. 将此文件添加到您的 footer.inc.php 文件中,如下所示
	<script type="text/javascript" src="<?php echo(__BOOTSTRAP_JS__); ?>"></script>

或将其添加到您的 QForm.class.php 文件中自动加载的 JavaScript 表单列表中,如下所示

	protected function GetFormJavaScripts() {
		$scripts = parent::GetFormJavaScripts();
		$scripts[] = __BOOTSTRAP_JS__;
		return $scripts;
	}

用法

请参阅示例页面以获取详细信息。主要功能包括

  1. 使用 RenderFormGroup 替代 RenderWithName 来以 Bootstrap 方式绘制表单对象。Bootstrap 控制类公开了多个实用程序类,可以将 Bootstrap 类添加到对象、标签、包装器,甚至在特殊情况下的一些内部包装器。

  2. 特定的 Bootstrap 类型 QControls 来在屏幕上绘制特定内容。例如

  • 轮播图
  • 导航栏
  • 菜单按钮
  • 警告
  • 手风琴
  1. 扩展基本 QCubed 控件以添加额外的 Bootstrap 功能。包括
  • 复选框,以 Bootstrap 方式绘制复选框,标签包裹复选框
  • 文本框,添加将其作为内联组与另一个对象一起绘制的功能
  1. 定义,通过 PHP 常量提供对各种 Bootstrap 类名的轻松访问。这些定义位于 Bootstrap.php 文件中。