Photino.Blazor - プロジェクト構成

概要

Photino Blazorのプロジェクト構成は、標準的なBlazorプロジェクトの構成に似ている。
しかし、Photinoを使用してデスクトップアプリケーションとして実行される点が特徴である。

プロジェクト構成

基本的なプロジェクト構成を、以下に示す。

PhotinoBlazorApp/
│
├── wwwroot/              # 静的ファイル (CSS, JavaScript, 画像等)
│   ├── css/
│   ├── js/
│   └── images/
├── Pages/                # Blazorのページコンポーネント
├── Shared/               # 共有コンポーネント
├── Data/                 # データサービス
├── Properties/           # プロジェクト設定
├── _Imports.razor        # 共通インポート
├── App.razor             # アプリケーションのルート
├── Program.cs            # アプリケーションのエントリーポイント
└── appsettings.json      # アプリケーション設定

各ディレクトリ / ファイルの役割

Photino Blazorアプリケーションでは、Program.csが重要であり、PhotinoウィンドウとBlazorの統合が設定される場所である。
PhotinoはネイティブUIレイヤーを提供し、BlazorのWebViewとして機能する。

wwwroot/

静的ファイルを格納するディレクトリである。
CSS、JavaScript、画像等が含まれる。

Pages/

Blazorのページコンポーネントを格納する。
各ページは通常、.razor拡張子を持つ。

Shared/

複数のページで共有されるコンポーネント (ナビゲーションメニュー、レイアウト等) を格納する。

Data/

データモデルやサービスクラスを格納する。

Properties/

プロジェクト設定ファイルを格納する。

_Imports.razor

プロジェクト全体で使用される共通のimport文を定義する。

App.razor

Blazorアプリケーションのルートコンポーネントであり、ルーティングの設定等が含まれている。

主な役割

• Router

  ルーティング設定の定義

• Found

  有効なルートが見つかった場合の表示

• NotFound

  無効なルートの場合の表示

  一般的には、MainLayoutをデフォルトレイアウトとして設定

 <Router AppAssembly="@typeof(Program).Assembly">
    <Found Context="routeData">
       <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
    </Found>
    <NotFound>
       <LayoutView Layout="@typeof(MainLayout)">
          <p>Sorry, there's nothing at this address.</p>
       </LayoutView>
    </NotFound>
 </Router>

Program.cs

アプリケーションのエントリーポイントである。
Photinoの初期化と設定が行われる。

appsettings.json

アプリケーションの設定を格納するJSONファイルである。

主な設定項目

• Logging

  ログ出力の詳細レベル設定

• AllowedHosts

  アプリケーションにアクセスできるホスト

• ApplicationSettings

  Photinoウィンドウの設定 (タイトル、サイズ等)

 {
   "Logging": {
     "LogLevel": {
       "Default": "Information",
       "Microsoft": "Warning",
       "Microsoft.Hosting.Lifetime": "Information"
     }
   },
   "AllowedHosts": "*",
   "ApplicationSettings": {
     "WindowTitle": "Photino.Blazor App",
     "WindowWidth": 800,
     "WindowHeight": 600
   }
 }