Fuelphp-themes

提供：Dev Guides
移動先:案内、検索

FuelPHP-テーマ

テーマは、アプリケーションの複数のルックアンドフィールを有効にするために使用されます。 アプリケーションの機能を乱すことなく、アプリケーションのルックアンドフィールを変更するオプションをユーザー/開発者に提供します。 アプリケーションには、1つ以上のテーマを含めることができます。 各テーマは独自のフォルダーにあります。 この章でテーマを作成する方法を学びましょう。

テーマ設定

FuelPHPは、テーマ用に個別の設定ファイル fuel/app/config/themes.php を提供します。 すべてのテーマ関連の設定は、このファイルで構成されます。 主なテーマ設定のいくつかは次のとおりです-

  • active -アクティブなテーマの名前
  • fallback -アクティブなテーマが見つからない場合のフォールバックテーマの名前
  • paths -テーマを検索および検索するパスの配列
  • assets_folder -通常、アセットはWebからアクセスできるようにDOCPATH内にある必要があります。 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' => 'l',
      'require_info_file' => false,
      'info_file_name' => 'themeinfo.php',
      'use_modules' => false,
   );

ここで設定しました、

  • tpthemesとしてのアクティブおよびフォールバックテーマの名前
  • fuel/app/themes/としてのテーマフォルダーのパス */public/assets/tpthemes/としてのアセットフォルダーのパス

テーマクラス

構成が完了したら、FuelPHPが提供するThemeクラスを使用して、テーマの機能を実行できます。 この章のThemeクラスで利用可能なメソッドについて教えてください。

実例

インスタンスメソッドを使用すると、新しいテーマを作成できます。 次の2つのパラメーターがあります。

  • $ name -テーマの名前（オプション）
  • $ config -テーマ構成配列（構成セクションで見られるものと同じ）

両方のパラメーターはオプションです。 パラメーターが指定されていない場合、構成ファイルからデフォルトのテーマを取得しようとします。 テーマ名が指定されている場合、構成ファイルから他の設定を取得しようとします。 構成も指定されている場合、構成ファイルの設定ではなく、ユーザー指定の設定が使用されます。 

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

フォージ

forgeはインスタンスに似ていますが、構成配列のみを持つ点が異なります。 

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

view

viewメソッドは、バックグラウンドで* View
forge（）*を使用します。 ビューメソッドが、fuel/app/views/フォルダーではなく、themesフォルダー内のfuel/app/themes/tpthemes/内のビューファイルを検索することを除いて、両方のAPIは似ています。
$theme = \Theme::instance();
$view = $theme->view('template/index');
//*fuel/app/themes/tpthemes/template/index.php

プレゼンター

presenterメソッドは、バックグラウンドで* Presenter
forge（）*を使用します。 プレゼンターメソッドがテーマフォルダー、fuel/app/views/フォルダーではなくfuel/app/themes/tpthemes/内のビューファイルを検索することを除いて、両方のAPIは似ています。
$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メソッドは、アクティブなテーマを設定できます。 

$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

テーマへのパスが見つかった場合、findはtrueを返し、そうでない場合はfalseを返します。 

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

all

allメソッドは、すべてのテーマパスのすべてのテーマの配列を返します。 

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

情報を取得

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

実施例

従業員アプリケーションにテーマサポートを追加しましょう。

  • ステップ1 *-次の内容の新しいテーマ設定ファイルfuel/app/config/theme.phpを追加します。
<?php
   return array (
      'active' => 'tpthemes',
      'fallback' => 'tpthemes',
      'paths' => array (APPPATH.'themes', ),
      'assets_folder' => 'assets',
      'view_ext' => 'l',
      'require_info_file' => false,
      'info_file_name' => 'themeinfo.php',
      'use_modules' => false,
   );
  • ステップ2 *-テーマtpthemesの新しいアセットフォルダーpublic/assets/tpthemes/cssを追加します。
cd/go/to/app/root/path
mkdir -p public/assets/tpthemes/css
  • ステップ3 *-最新のブートストラップをダウンロードし、bootstrap.min.cssをpublic/assets/tpthemes/cssの下に配置します
  • ステップ4 *-新しいフォルダーtpthemesをfuel/app/themesフォルダーの下に追加します。
cd/go/to/app/root/path
mkdir -p fuel/app/themes/tpthemes
  • ステップ5 *-新しいレイアウトテンプレートを追加して、fuel/app/themes/tpthemes/layout/にbootstraplを追加し、次のコードを追加します。
<!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>

ここでは、テーマインスタンスとアセットメソッドを使用して、ブートストラップファイルのパスを取得しました。 ヘッダーとコンテンツの2つの変数を定義しました。 header は、ヘッダーの詳細を動的に設定するために定義されます。 content は、ページの実際のコンテンツを動的に設定するために定義されています。

  • ステップ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>

ステップ7 *-新しいコントローラー、 *ThemeSample をfuel/app/classes/controller/themesample.phpに、 action をaction_indexに次のように作成します。 

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

ここでは、 Theme クラスのメソッドを使用してテーマの初期化を行うために、 before および after メソッドを使用しました。 使用されるメソッドのいくつかは、instance、get_template、set_template、およびviewです。

  • ステップ8 *-最後に、次のように、fuel/app/themes/tpthemes/themesampleでindex.phpのインデックスアクションのビューを追加します。
<p>The data comes from *fuel/app/themes/tpthemes/themesample/indexl* file.</p>
<p>
   <?php echo $message; ?>
</p>

ここでは、コントローラーで動的に設定する必要がある1つの変数messageを定義しました。

新しいテーマ tpthemes を作成し、それを ThemeSample コントローラーで使用しました。 次に、URL http：//localhost：8080/themesample/indexをリクエストして結果を確認します。 結果は次のとおりです。

テーマのサポート

「https://www.finddevguides.com/index.php?title=Fuelphp-themes&oldid=15300」から取得
Powered by MediaWiki