登录
目录
当前位置： 首页 > 文档资料 > FuelPHP 入门教程 >

主题（Themes）

优质
小牛编辑
129浏览
2023-12-01

主题用于为应用程序启用多个外观。 它为用户/开发人员提供了选项，可以在不影响应用程序功能的情况下更改应用程序的外观。 应用程序可以包含一个或多个主题。 每个主题都位于自己的文件夹中。 让我们在本章中学习如何创建主题。

主题配置

FuelPHP为themes提供了一个单独的配置文件， fuel/app/config/themes.php 。 所有与主题相关的设置都在此文件中配置。 一些主要的主题设置如下 -

  • active - 活动主题的名称

  • fallback - 如果找不到活动主题，则回退主题的名称

  • paths - 搜索和查找主题的路径数组

  • assets_folder - 通常，资产需要位于DOCPATH内部，以便可以通过Web访问。 它指的是DOCPATH中主题的资产文件夹

  • view_ext - 主题视图文件的扩展

  • info_file_name - 具有关于主题的扩展信息的文件

  • require_info_file - 是否需要主题信息文件info_file_name

  • use_modules - 是否使用当前模块

主题文件的简单配置如下。

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

我们在这里设定，

  • 作为tpthemes的活动和后备主题的名称
  • 主题文件夹的路径为fuel/app/themes/
  • 资产文件夹的路径为/ public/assets/tpthemes/

主题类

配置完成后，我们可以使用FuelPHP提供的类​​，主题来完成主题的功能。 让我们知道本章Theme类中可用的方法。

instance

instance方法可以创建新主题。 它有以下两个参数，

  • $name - 主题的名称（可选）

  • $config - 主题配置数组（与配置部分相同）

两个参数都是可选的。 如果未指定参数，它将尝试从配置文件中获取默认主题。 如果指定了主题名称，它将尝试从配置文件中获取其他设置。 如果还指定了配置，那么它将使用用户指定的设置而不是配置文件中的设置。

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

forge

forge与实例类似，只是它只有配置数组。

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

视图

view方法在后台使用View::forge() 。 这两个API都是相似的，除了查看方法搜索themes文件夹中的视图文件，fuel/app/themes/tpthemes /而不是fuel/app/views /文件夹。

$theme = \Theme::instance(); 
$view = $theme->view('template/index'); 
// *fuel/app/themes/tpthemes/template/index.php

主持人(presenter)

presenter方法在后台使用Presenter::forge() 。 两种API都类似，只是presenter方法搜索themes文件夹中的视图文件，fuel/app/themes/tpthemes /而不是fuel/app/views /文件夹。

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

asset_path

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

active方法允许设置活动主题。

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

fallback

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

如果找到主题的路径，则find返回true，否则返回false。

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

all

all方法返回所有主题路径中所有主题的数组。

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

get_info

get_info方法返回主题信息数组中的特定变量。 如果未指定主题，则使用活动主题的info数组。

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

这里，方法获得的颜色在'newtheme'中定义。 如果未定义，则使用“绿色”作为默认颜色。

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

工作示例 (Working Example)

让我们在员工申请中添加主题支持。

Step 1 - 添加新的主题配置文件，fuel/app/config/theme.php，其中包含以下内容。

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

Step 2 - 为主题添加新的资产文件夹，public/assets/tpthemes/css，tpthemes。

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

Step 3 - 下载最新的bootstrap并将bootstrap.min.css置于public/assets/tpthemes/css下

Step 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，并添加以下代码。

<!DOCTYPE html> 
<html lang = "en"> 
   <head> 
      <title>Theme example</title> 
      <meta charset = "utf-8"> 
      <meta name = "viewport" content = "width = device-width, initial-scale = 1"> 
      <!-- Bootstrap core CSS --> 
      <?php echo \Theme::instance()->asset->css('bootstrap.min.css'); ?> 
   </head> 
   <body> 
      <?php echo $header; ?> 
      <div class = "container"> 
         <div class = "row">
            <div class = "col-sm-12"> 
               <?php echo $content; ?> 
            </div> 
         </div> 
      </div> 
   </body>
</html>

在这里，我们使用主题实例和资产方法来获取引导程序文件的路径。 我们定义了两个变量，标题和内容。 header定义为动态设置标头详细信息。 content定义为动态设置页面的实际内容。

Step 6 - 在fuel/app/themes/tpthemes/partials中添加新的标题模板header.php，如下所示。

<div class = "jumbotron text-center">
   <h1>Theme support in fuelphp</h1> 
   <p>bootstrap based template</p>  
</div>

Step 7 - 在fuel/app/classes/controller/themesample.php创建一个新控制器ThemeSample ，在action_index创建action ，如下所示。

<?php  
   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类的方法进行Theme的初始化。 使用的一些方法是实例，get_template，set_template和view。

Step 8 - 最后，在fuel/app/themes/tpthemes/themesample中添加索引操作视图index.php，如下所示。

<p>The data comes from *fuel/app/themes/tpthemes/themesample/index.html* file.</p> 
<p> 
   <?php echo $message; ?> 
</p>

在这里，我们定义了一个变量message，它需要在控制器中动态设置。

我们创建了一个新的主题， tpthemes并在ThemeSample控制器中使用它。 现在让我们通过请求URL http:// localhost:8080/themesample/index来检查结果。 结果如下。

主题支持
免责声明： 以上内容版权归原作者所有，如有侵犯您的原创版权请告知，我们将尽快删除相关内容。感谢每一位辛勤著写的作者，感谢每一位的分享。
@小牛知识库 xnip.cn