内容へ移動
Ground Sunlight
Windowsで作る - PHPプログラミングの開発環境
ユーザ用ツール
ログイン
サイト用ツール
検索
ツール
文書の表示
以前のリビジョン
バックリンク
最近の変更
メディアマネージャー
サイトマップ
ログイン
>
最近の変更
メディアマネージャー
サイトマップ
トレース:
apricot:app:home
この文書は読取専用です。文書のソースを閲覧することは可能ですが、変更はできません。もし変更したい場合は管理者に連絡してください。
====== Apricot ホーム画面 ====== --- //[[http://www.y2sunlight.com|y2sunlight]] 2020-05-08// [[apricot:top|Apricot に戻る]] 関連記事 * [[apricot:configuration|Apricot プロジェクトの作成]] * [[apricot:public|Apricot 公開フォルダ]] * [[apricot:core:top|Apricot コア]] * Apricot アプリ * [[apricot:app:top|Apricot アプリ作成の準備]] * Apricot ホーム画面 * [[apricot:app:error|Apricot エラー画面]] * [[apricot:app:db-model|Apricot データベースとモデル]] * [[apricot:app:user-list|Apricot ユーザ一覧画面]] * [[apricot:app:user-edit|Apricot ユーザ登録画面]] * [[apricot:app:validation|Apricot バリデーション]] * [[apricot:app:transaction|Apricot トランザクション]] * [[apricot:ext:middleware|Apricot 拡張]] アプリのホーム画面を作ります。\\ 画面の作り方の基本は[[apricot:app:top#スタブ画面|スタブ画面]]と同じです。本章の前にそちらもご覧下さい。 ---- ===== ルーティング ===== 以下のように config/routes.php を変更し、ホームコントローラのルートを作ります。 {{fa>folder-open-o}} ** /apricot/config ** <code php routes.php> <?php //------------------------------------------------------------------- // Route Definition Callback //------------------------------------------------------------------- return function (FastRoute\RouteCollector $r) { $base = Core\Application::getInstance()->getRouteBase(); $r->addGroup($base, function (FastRoute\RouteCollector $r) use($base) { // Home $r->get ('/home', 'HomeController@index'); $r->get('/', function() use($base){ header("Location: " . $base.'/home'); }); // Stub $r->get('/stub[/{no:\d+}]', 'StubController@index'); }); }; </code> * /home --- ホームコントローラへのルート * /stub --- スタブコントローラへのルート * / --- ホームコントローラ(/home)へリダイレクト ルーティング設定に関しては[[https://github.com/nikic/FastRoute|FastRoute]]を参照して下さい。 \\ ===== ホームコントローラ ===== Controller を継承してホームコントローラを作ります。 {{fa>folder-open-o}} ** /apricot/app/Controllers ** <code php HomeController.php> <?php namespace App\Controllers; use App\Foundation\Controller; /** * ホームコントローラ */ class HomeController extends Controller { /** * Home Page * @return \Core\Foundation\Response */ public function index() { $message = __('messages.home.msg_hello', [':account'=>env('APP_NAME')]); return render('home',['message'=>$message]); } } </code> * ''<nowiki>__</nowiki>()'' はトランスレータ [[apricot:core:basic-class#langクラス|Core\Lang::get()]] を呼び出すヘルパー関数です。\\ トランスレータへの引数は言語テキスト(assests/lang/ja/messages.php)のキーです(ドット表記)。 * ''env()'' は環境設定を取得する[[apricot:core:top#ヘルパー|ヘルパー関数]]です。 * ボイラープレートのrender()関数を呼び出してレスポンスをレンダリングしています * **render(string $view=null, array $variables=[])** - $view : テンプレート名\\ 上例では assets/views/home.blade.php がテンプレートファイルになります - $variables : テンプレート変数の連想配列\\ 上例では $message をテンプレートに渡しています。 \\ ===== HTMLテンプレート ===== 以下にホームコントローラのindexアクションでレンダリングしているHTMLテンプレートを示します。 {{fa>folder-open-o}} ** /apricot/assets/views ** <code php home.blade.php> {{-- 親レイアウト --}} @extends('layout') {{-- 追加スクリプト --}} @push('scripts') @endpush {{-- タイトル --}} @section('title') @endsection {{-- コンテンツ --}} @section('content') <h1 class="text-center">{{__('messages.home.title')}} <span class="small">{{env('APP_VERSION')}}</span></h1> <div class="text-center"> <img src="{{url_ver('img/apricot.jpg')}}" width="300"> </div> <div class="text-center mt-2">{{$message}}</div> @endsection </code> * ''extends'', ''push'', ''section'' の各ディレクティブについては、[[apricot:app:top#htmlテンプレート|スタブ画面]] を参照して下さい。 * ボイラープレート'' __()'', '' env()'', '' url_ver()'' については、[[apricot:app:top#layoutbladephp|layout.blade.php]] を参照して下さい。 \\ ==== 画像ファイル ==== HTMLテンプレートで使用している画像 apricot.jpg は apricot/public/img の下に設置して下さい。 {{fa>folder-open-o}} ** apricot/public/img **\\ apricot.jpg\\ {{:apricot:apricot.jpg?360px}} \\ ===== 翻訳テキスト ===== ホーム画面用の翻訳テキストを言語ファイル( messages.php )に追加します。 {{fa>folder-open-o}} ** apricot/assets/lang/ja ** <code php messages.php> <?php return [ ... 'home'=>[ 'title'=>env('APP_NAME'), 'msg_hello'=>'Hello, :account !', ], ]; </code> \\ ===== テスト実行 ===== ホーム画面を表示してみましょう。ブラウザ上で以下のURLにアクセスしてみて下さい。 <code> http://localhost/ws2019/apricot/public/ </code> 次の画面が表示されます [{{apricot:app:app02.png?nolink}}] ■ [menu1],[menu2],[menu3]を押すとそれぞれのスタブ画面が表示されます。\\ ■ [About Me]を押すと [[http://y2sunlight.com/ground/doku.php?id=apricot:top|y2sunlight.com]] が開きます。 \\
apricot/app/home.txt
· 最終更新: 2020/05/23 16:18 by
y2sunlight
ページ用ツール
文書の表示
以前のリビジョン
バックリンク
文書の先頭へ