fuelphp 主題
主題用于為應用程序啟用多種外觀。它為用戶/開發人員提供了在不干擾應用程序功能的情況下更改應用程序外觀和感覺的選項。一個應用程序可以有一個或多個主題。每個主題都位于自己的文件夾中。讓我們在本章中學習如何創建主題。
主題配置
fuelphp 為主題提供了一個單獨的配置文件, fuel/app/config/themes.php。所有與主題相關的設置都在此文件中配置。一些主要的主題設置如下:
- active-活動主題的名稱
- fallback-如果未找到活動主題,則后備主題的名稱
- paths-搜索和查找主題的路徑數組
- assets_folder-通常,資產需要在 docpath 中,以便它將可以通過網絡訪問。它指的是 docpath 中主題的資產文件夾
- view_ext-主題視圖文件的擴展
- info_file_name-包含有關主題的擴展信息的文件
- require_info_file-是否需要主題信息文件,info_file_name
- use_modules-是否使用當前模塊
主題文件的簡單配置如下。
return array ( 'active' =--> 'tpthemes', 'fallback' => 'tpthemes', 'paths' => array ( apppath.'themes', ), 'assets_folder' => 'assets', 'view_ext' => '.html', 'require_info_file' => false, 'info_file_name' => 'themeinfo.php', 'use_modules' => false, );
這里我們已經設置了,
- 活動主題和后備主題的名稱為 tpthemes
- 主題文件夾的路徑為fuel/app/themes/
- 資產文件夾的路徑為/public/assets/tpthemes/
主題班
配置完成后,我們就可以使用fuelphp提供的theme類來完成主題的功能了。讓我們了解本章中 theme 類中可用的方法。
實例
instance 方法可以創建一個新的主題。它有以下兩個參數,
- $name-主題名稱(可選)
- $config-主題配置數組(與配置部分相同)
這兩個參數都是可選的。如果沒有指定參數,它會嘗試從配置文件中獲取默認主題。如果指定了主題名稱,它會嘗試從配置文件中獲取其他設置。如果還指定了配置,那么它將使用用戶指定的設置,而不是從配置文件中進行設置。
$theme = \theme::instance(); $theme = \theme::instance('tpthemes'); $theme = \theme::instance ('mytheme', array ( 'active' => 'mytheme', 'view_ext' => '.php'));
鍛造
forge 與 instance 類似,只是它只有配置數組。
$theme = \theme::forge (array( 'active' => 'tpthemes', 'fallback' => 'tpthemes', 'view_ext' => '.php', ));
查看
view 方法在后臺使用 view::forge()。兩個 api 都相似,除了 view 方法搜索主題文件夾中的視圖文件,fuel/app/themes/tpthemes/而不是 fuel/app/views/文件夾。
$theme = \theme::instance(); $view = $theme->view('template/index'); // *fuel/app/themes/tpthemes/template/index.php
主持人
presenter 方法在后臺使用 presenter::forge()。除了presenter方法在themes文件夾中搜索view文件,fuel/app/themes/tpthemes/而不是fuel/app/views/文件夾外,這兩個api是相似的。
$theme = \theme::instance(); $presenter = $theme->presenter('template/index');
資產路徑
asset_path 方法返回相對于當前選擇的主題所請求資產的路徑。
$theme = \theme::instance(); // public/assets/tpthemes/css/style.css $style = \html::css($theme->asset_path('css/style.css'));
add_path
add_path 方法允許在運行時添加主題路徑。
$theme = \theme::instance(); $theme->add_path(docroot.'newthemes');
add_paths
add_paths 方法允許在運行時添加多個主題路徑。
$theme = \theme::instance(); $theme->add_path(docroot.'newthemes');
活動
active 方法允許設置活動主題。
$theme = \theme::instance(); $active = $theme->active('newtheme');
后備
fallback 方法允許設置后備主題。
$theme = \theme::instance(); $fallback = $theme->fallback('custom');
get_template
get_template 方法將返回當前加載的主題模板的 view 實例。
$theme = \theme::instance(); $theme->get_template()->set('body', 'theme can change the look and feel of your app');
set_template
set_template 方法允許設置頁面的主題模板。
$theme = \theme::instance(); $theme->set_template('layouts/index')->set('body', 'set theme template');
查找
find 返回真,如果找到主題的路徑,否則返回假。
$theme = \theme::instance(); $path = $theme->find('newtheme')
全部
all 方法返回所有主題路徑中所有主題的數組。
$theme = \theme::instance(); $themes = $theme->all();
獲取信息
get_info 方法從主題信息數組中返回一個特定的變量。如果未指定主題,則使用活動主題的信息數組。
$theme = \theme::instance(); $var = $theme->get_info('color', 'green', 'newtheme');
這里,獲取顏色的方法定義在‘newtheme’中。如果未定義,則將使用"green"作為默認顏色。
set_info
set_info 方法在活動或后備主題中設置一個變量。
$theme->set_info('color', 'green', 'fallback');
set_partial
set_partial 方法允許為頁面模板的命名部分設置視圖部分。通常是通過 hmvc 調用完成的。
$theme = \theme::instance(); $theme->set_template('layouts/homepage'); $theme->set_partial('navbar', 'homepage/navbar');
get_partial
get_partial 方法允許在頁面模板的命名部分中獲取先前設置的部分的視圖實例。
$theme = \theme::instance(); $theme->set_partial('sidebar', 'partials/menu'); $theme->get_partial('sidebar', 'partials/menu')->set('class', 'menu green');
工作示例
讓我們在員工應用程序中添加主題支持。
步驟 1-添加新的主題配置文件,fuel/app/config/theme.php,內容如下。
return array ( 'active' =--> 'tpthemes', 'fallback' => 'tpthemes', 'paths' => array (apppath.'themes', ), 'assets_folder' => 'assets', 'view_ext' => '.html', 'require_info_file' => false, 'info_file_name' => 'themeinfo.php', 'use_modules' => false, );
步驟 2-為主題添加新的資產文件夾,public/assets/tpthemes/css,tpthemes。
cd /go/to/app/root/path mkdir-p public/assets/tpthemes/css
步驟 3-下載最新的引導程序并將 bootstrap.min.css 放在 public/assets/tpthemes/css 下
第 4 步-在fuel/app/themes 文件夾下添加新文件夾tpthemes。
cd /go/to/app/root/path mkdir-p fuel/app/themes/tpthemes
step 5-在fuel/app/themes/tpthemes/layout/下添加新的布局模板bootstrap.html并添加以下代碼。
<title>theme example</title> <meta charset="utf-8"> <meta name="viewport" content="width = device-width, initial-scale = 1"> <!--bootstrap core css--> echo \theme::instance()--->asset->css('bootstrap.min.css'); ?> echo $header;echo $content;
這里,我們使用了主題實例和資產方法來獲取引導文件的路徑。我們定義了兩個變量,header 和 content。 header 定義為動態設置標題詳細信息。 content 定義為動態設置頁面的實際內容。
step 6-在fuel/app/themes/tpthemes/partials 中添加新的標題模板header.php,如下所示。
<h1>theme support in fuelphp</h1>bootstrap based template
步驟 7-創建一個新控制器, themesample 在fuel/app/classes/controller/themesample.php 和 action 在action_index 為如下。
class controller_themesample extends \controller { public function before() { $this--->theme = \theme::instance(); $this->theme->set_template('layouts/bootstrap'); $header = $this->theme->view('partials/header'); $this->theme->get_template()->set('header', $header); } public function action_index() { $content = $this->theme ->view('themesample/index') ->set('message', 'this data comes from action page'); $this->theme ->get_template() ->set('content', $content); } public function after($response) { if (empty($response) or ! $response instanceof response) { $response = \response::forge(\theme::instance()->render()); } return parent::after($response); } }
這里,我們使用了 before 和 after 方法來使用 theme 類的方法來初始化主題。使用的一些方法是實例、get_template、set_template 和 view。
第 8 步-最后,為 index 操作添加視圖,在fuel/app/themes/tpthemes/themesample 中的 index.php 如下所示。
the data comes from *fuel/app/themes/tpthemes/themesample/index.html* file.
echo $message;
這里,我們定義了一個變量,message,需要在控制器中動態設置。
我們創建了一個新主題 tpthemes 并在 themesample 控制器中使用它。現在讓我們通過請求 url http://localhost:8080/themesample/index 來檢查結果。結果如下。