fuelphp 主題

主題用于為應(yīng)用程序啟用多種外觀。它為用戶/開(kāi)發(fā)人員提供了在不干擾應(yīng)用程序功能的情況下更改應(yīng)用程序外觀和感覺(jué)的選項(xiàng)。一個(gè)應(yīng)用程序可以有一個(gè)或多個(gè)主題。每個(gè)主題都位于自己的文件夾中。讓我們?cè)诒菊轮袑W(xué)習(xí)如何創(chuàng)建主題。

主題配置

fuelphp 為主題提供了一個(gè)單獨(dú)的配置文件， fuel/app/config/themes.php。所有與主題相關(guān)的設(shè)置都在此文件中配置。一些主要的主題設(shè)置如下：

• active-活動(dòng)主題的名稱
• fallback-如果未找到活動(dòng)主題，則后備主題的名稱
• paths-搜索和查找主題的路徑數(shù)組
• assets_folder-通常，資產(chǎn)需要在 docpath 中，以便它將可以通過(guò)網(wǎng)絡(luò)訪問(wèn)。它指的是 docpath 中主題的資產(chǎn)文件夾
• view_ext-主題視圖文件的擴(kuò)展
• info_file_name-包含有關(guān)主題的擴(kuò)展信息的文件
• require_info_file-是否需要主題信息文件，info_file_name
• use_modules-是否使用當(dāng)前模塊

主題文件的簡(jiǎn)單配置如下。

  
   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, 
   ); 

這里我們已經(jīng)設(shè)置了，

• 活動(dòng)主題和后備主題的名稱為 tpthemes
• 主題文件夾的路徑為fuel/app/themes/
• 資產(chǎn)文件夾的路徑為/public/assets/tpthemes/

主題班

配置完成后，我們就可以使用fuelphp提供的theme類(lèi)來(lái)完成主題的功能了。讓我們了解本章中 theme 類(lèi)中可用的方法。

實(shí)例

instance 方法可以創(chuàng)建一個(gè)新的主題。它有以下兩個(gè)參數(shù)，

• $name-主題名稱（可選）
• $config-主題配置數(shù)組（與配置部分相同）

這兩個(gè)參數(shù)都是可選的。如果沒(méi)有指定參數(shù)，它會(huì)嘗試從配置文件中獲取默認(rèn)主題。如果指定了主題名稱，它會(huì)嘗試從配置文件中獲取其他設(shè)置。如果還指定了配置，那么它將使用用戶指定的設(shè)置，而不是從配置文件中進(jìn)行設(shè)置。

$theme = \theme::instance(); 
$theme = \theme::instance('tpthemes'); 
$theme = \theme::instance ('mytheme', array ( 
   'active' => 'mytheme', 'view_ext' => '.php')); 

鍛造

forge 與 instance 類(lèi)似，只是它只有配置數(shù)組。

$theme = \theme::forge (array( 
   'active'   => 'tpthemes', 
   'fallback' => 'tpthemes', 
   'view_ext' => '.php', 
));

查看

view 方法在后臺(tái)使用 view::forge()。兩個(gè) 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 方法在后臺(tái)使用 presenter::forge()。除了presenter方法在themes文件夾中搜索view文件，fuel/app/themes/tpthemes/而不是fuel/app/views/文件夾外，這兩個(gè)api是相似的。

$theme = \theme::instance(); 
$presenter = $theme->presenter('template/index');

資產(chǎn)路徑

asset_path 方法返回相對(duì)于當(dāng)前選擇的主題所請(qǐng)求資產(chǎn)的路徑。

$theme = \theme::instance();  
// public/assets/tpthemes/css/style.css 
$style = \html::css($theme->asset_path('css/style.css')); 

add_path

add_path 方法允許在運(yùn)行時(shí)添加主題路徑。

$theme = \theme::instance(); 
$theme->add_path(docroot.'newthemes');

add_paths

add_paths 方法允許在運(yùn)行時(shí)添加多個(gè)主題路徑。

$theme = \theme::instance();   
$theme->add_path(docroot.'newthemes'); 

活動(dòng)

active 方法允許設(shè)置活動(dòng)主題。

$theme = \theme::instance(); 
$active = $theme->active('newtheme'); 

后備

fallback 方法允許設(shè)置后備主題。

$theme = \theme::instance();
$fallback = $theme->fallback('custom'); 

get_template

get_template 方法將返回當(dāng)前加載的主題模板的 view 實(shí)例。

$theme = \theme::instance(); 
$theme->get_template()->set('body', 'theme can change the look and feel of your app');

set_template

set_template 方法允許設(shè)置頁(yè)面的主題模板。

$theme = \theme::instance(); 
$theme->set_template('layouts/index')->set('body', 'set theme template');

查找

find 返回真，如果找到主題的路徑，否則返回假。

$theme = \theme::instance(); 
$path = $theme->find('newtheme')

全部

all 方法返回所有主題路徑中所有主題的數(shù)組。

$theme = \theme::instance(); 
$themes = $theme->all(); 

獲取信息

get_info 方法從主題信息數(shù)組中返回一個(gè)特定的變量。如果未指定主題，則使用活動(dòng)主題的信息數(shù)組。

$theme = \theme::instance(); 
$var = $theme->get_info('color', 'green', 'newtheme');

這里，獲取顏色的方法定義在‘newtheme’中。如果未定義，則將使用"green"作為默認(rèn)顏色。

set_info

set_info 方法在活動(dòng)或后備主題中設(shè)置一個(gè)變量。

$theme->set_info('color', 'green', 'fallback'); 

set_partial

set_partial 方法允許為頁(yè)面模板的命名部分設(shè)置視圖部分。通常是通過(guò) hmvc 調(diào)用完成的。

$theme = \theme::instance(); 
$theme->set_template('layouts/homepage'); 
$theme->set_partial('navbar', 'homepage/navbar'); 

get_partial

get_partial 方法允許在頁(yè)面模板的命名部分中獲取先前設(shè)置的部分的視圖實(shí)例。

$theme = \theme::instance(); 
$theme->set_partial('sidebar', 'partials/menu'); 
$theme->get_partial('sidebar', 'partials/menu')->set('class', 'menu green');

工作示例

讓我們?cè)趩T工應(yīng)用程序中添加主題支持。

步驟 1-添加新的主題配置文件，fuel/app/config/theme.php，內(nèi)容如下。

  
   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-為主題添加新的資產(chǎn)文件夾，public/assets/tpthemes/css，tpthemes。

cd /go/to/app/root/path 
mkdir-p public/assets/tpthemes/css 

步驟 3-下載最新的引導(dǎo)程序并將 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;  
            
 
         
 
      
 
   
   
 

這里，我們使用了主題實(shí)例和資產(chǎn)方法來(lái)獲取引導(dǎo)文件的路徑。我們定義了兩個(gè)變量，header 和 content。 header 定義為動(dòng)態(tài)設(shè)置標(biāo)題詳細(xì)信息。 content 定義為動(dòng)態(tài)設(shè)置頁(yè)面的實(shí)際內(nèi)容。

step 6-在fuel/app/themes/tpthemes/partials 中添加新的標(biāo)題模板header.php，如下所示。

   <h1>theme support in fuelphp</h1>
 
   
bootstrap based template
  
 

步驟 7-創(chuàng)建一個(gè)新控制器， 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 方法來(lái)使用 theme 類(lèi)的方法來(lái)初始化主題。使用的一些方法是實(shí)例、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;  

這里，我們定義了一個(gè)變量，message，需要在控制器中動(dòng)態(tài)設(shè)置。

我們創(chuàng)建了一個(gè)新主題 tpthemes 并在 themesample 控制器中使用它?，F(xiàn)在讓我們通過(guò)請(qǐng)求 url http://localhost:8080/themesample/index 來(lái)檢查結(jié)果。結(jié)果如下。