ActiveReportsは、Blazor WebデザイナコンポーネントをWebアプリケーションに統合するための豊富なAPIを提供します。プロジェクトにBlazor Webデザイナコンポーネントを埋め込むには、Blazor WebDesignerのAPIを使用します。APIを使用することで、レポートを作成、設計、および保存でき、デザイナのロケールの定義、レポートアイテムのデフォルト設定のカスタマイズ、データタブとプロパティタブの管理、アプリケーション情報の変更などの追加機能を使用できます。
GrapeCity.ActiveReports.Blazor.DesignerライブラリによってエクスポートされるGrapeCity.ActiveReports.Blazor.Designer.ReportDesignerオブジェクトの型。
ReportDesignerコンポーネントを<div>要素に描画します。「*.razor」ページには次のようなコードを使用します。
パラメータ(型):
戻り値:ユーザーインタフェイスのReportDesignerコンポーネントを描画します。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
Blazor Webデザイナでメニューバーの設定を取得または設定します。
パラメータ(型):
説明:Blazor Webデザイナの[開く]ボタンの設定を取得または設定します。
戻り値:[開く]ボタンの設定を表すOpenButtonオブジェクト。
説明:Blazor Webデザイナの[製品情報]ボタンの設定を取得または設定します。
戻り値:[製品情報]ボタンの設定を表すAboutButtonオブジェクト。
説明:[レポート]タブの設定を取得または設定します。
戻り値:[レポート]タブの設定を表すContextActionsTabオブジェクト。
説明:[ホーム]タブの設定を取得または設定します。
戻り値:[ホーム]タブの設定を表すHomeTabオブジェクト。
説明:[挿入]タブの設定を取得または設定します。
戻り値:[挿入]タブの設定を表すInsertTabオブジェクト。
説明:[パラメータ]タブの設定を取得または設定します。
戻り値:[パラメータ]タブの設定を表すParametersTabオブジェクト。
説明:[名前を付けて保存]ボタンの設定を取得または設定します。
戻り値:[名前を付けて保存]ボタンの設定を表すSaveAsButtonオブジェクト。
説明:[保存]ボタンの設定を取得または設定します。
戻り値:[保存]ボタンの設定を表すSaveAsButtonオブジェクト。
説明:[スクリプト]タブの設定を取得または設定します。
戻り値:[スクリプト]タブの設定を表すScriptTabオブジェクト。
説明:メニューバーを表示するかどうかを指定します。
戻り値:メニューバーを表示するかどうかを表す値。
戻り値:メニューバーの設定を含むAppBarSettingsオブジェクト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner AppBarSettings="@_appBar" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private AppBarSettings _appBar = new AppBarSettings { OpenButton = new OpenButton { Visible = true }, AboutButton = new AboutButton { Visible = false }, ContextActionsTab = new ContextActionsTab { Visible = true }, HomeTab = new HomeTab { Visible = true }, InsertTab = new InsertTab { Visible = false }, ParametersTab = new ParametersTab { Visible = true }, SaveAsButton = new SaveAsButton { Visible = false }, SaveButton = new SaveButton { Visible = false }, ScriptTab = new ScriptTab { Visible = false }, Visible = false }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
アプリケーションに関連するAPIを取得します。
パラメータ(型):
- Panels: Panels
説明:メニューおよびサイドバーパネルへのアクセスが含まれます。
戻り値:メニューとサイドバーのパネルを表すPanelsオブジェクト。- Focus(): Task
説明:デザイナにフォーカスを戻します。プラグイン要素を開いたり閉じたりする場合は、フォーカスが失われます。Ctrl+Z(元に戻す)、Ctrl+Y(やり直し)などのショートカットキーを使い続けるために、フォーカスを戻すことが必要です。
戻り値:非同期操作を表すTaskオブジェクト。- GetAbout(): ValueTask<About>
説明:アプリケーションの名前またはバージョンに関する情報が含まれます。
戻り値:アプリケーションの名前またはバージョンに関する情報を表すValueTask<About>オブジェクト。
戻り値:アプリケーションに関連するAPIを返します。
サンプルコード |
コードのコピー
|
---|---|
@page "/" @inject IJSRuntime JSRuntime <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner @ref="_designer" PreviewSettings="@_preview" /> </div> @code { private ReportDesigner _designer; private PreviewSettings _preview; private ReportViewer _viewer; public Index() { _preview = new PreviewSettings { CanPreview = true, OpenViewer = OpenViewer }; } private async void OpenViewer(ViewerSettings settings) { if (_viewer != null) { await _viewer.OpenReport(settings.DocumentInfo.Id); return; } _viewer = new ReportViewer(); GrapeCity.ActiveReports.Blazor.Designer.App api = _designer.App; var initOptions = new InitializationOptions(); initOptions.ReportID = settings.DocumentInfo.Id; initOptions.PanelsLocation = PanelsLocation.toolbar; initOptions.ReportLoaded = (reportInfo) => { }; await _viewer.Render(JSRuntime, settings.Element, initOptions); } } |
レポートデザイナコンポーネントのデータ設定を設定します。
パラメータ(型):
説明:[共通の値]セクションの設定を取得または設定します。
戻り値:[共通の値]セクションの設定。
説明:[データセット]セクションの設定を取得または設定します。
戻り値:[データセット]セクションの設定。
説明:[データソース]セクションの設定を取得または設定します。
戻り値:[データソース]セクションの設定。
説明:[データ]タブの設定を取得または設定します。
戻り値:[データ]タブの設定。
説明:[パラメータス]セクションの設定を取得または設定します。
戻り値:[パラメータ]セクションの設定。
戻り値:データの設定を含むDataSettingsオブジェクト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner DataSettings="@_dataSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private DataSettings _dataSettings = new DataSettings { DataSets = new DataSets { CanModify = true }, DataSources = new DataSources { CanModify = true }, DataSources = new DataSources { CanModify = true, Shared = new SharedDataSourceOptions() { Enabled = true } }, DataTab = new DataTab { Visible = true }, Parameters = new Parameters() { CanModify = true }, CommonValues = new CommonValues() { Visible = false } }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
デザイナを初期化する時に呼び出されるコールバックを取得または設定します。
パラメータ(型):
戻り値:デザイナを初期化する後に呼び出されるアクションを含むActionオブジェクト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner DesignerInitialized="@DesignerInitializedCallback" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private void DesignerInitializedCallback() { } public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
フォーカスタイマーを無効にします。デフォルトでは、フォーカスされた要素(ボタンなど)は、Tabキーが押された後、短時間だけ強調表示されます。この設定により、フォーカスされた要素が永続的に強調表示されます。
パラメータ(型):
戻り値:項目のフォーカスの現在の状態。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner DisableFocusTimer="true" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
システムクリップボードの使用を無効にします。
パラメータ(型):
戻り値:システムクリップボードの使用を無効にする現在の状態。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner DisableSystemClipboard="true" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
指定されたドキュメントを開きます。
パラメータ(型):
説明:サポートされているレポートの種類を取得または設定します。利用可能な値は、SupportedDocumentType.fpl、SupportedDocumentType.rpx、SupportedDocumentType.dashboard、SupportedDocumentType.msl、およびSupportedDocumentType.cplです。
戻り値:指定されたレポートの種類。
説明:レポートの識別子を取得または設定します。
戻り値:指定されたドキュメント。
戻り値:指定されたドキュメント。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner Document="@_doc" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private Document _doc = new Document() { Type = SupportedDocumentType.cpl, Id = "Example.rdlx" }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
ドキュメントに関するAPIを取得します。
パラメータ(型):
説明:指定されたCreateReportOptionsオブジェクトを使用して、デザイナで編集する新しいレポートを作成します。
戻り値:作成されたドキュメントに関する情報を表すValueTask<CreateDocumentInfo>オブジェクト。
説明:レポートに未保存の変更があるかどうかを示します。
戻り値:レポートに未保存の変更があるかどうかを示すValueTask<bool>。
説明:編集中のレポートに関する情報。
戻り値:ドキュメント情報を表すValueTask<CurrentDocumentInfo>オブジェクト。
説明:レポートが少なくとも1回保存されたかどうかを示します。
戻り値:レポートが少なくとも1回保存されたかどうかを示すValueTask<bool>オブジェクト。
説明:[開く]ダイアログを表示します。
戻り値:非同期操作を表すTaskオブジェクト。
説明:指定されたIDでデザイナに編集する既存のレポートを開きます。オプションで、レポート名とコンテンツを渡すことができます。そうしないと、サーバーから読み込まれます。
戻り値:開いたドキュメントに関する情報を表すValueTask<OpenDocumentInfo>オブジェクト。
Save():Task
説明:編集中のレポートをデザイナに保存します。レポートを新規作成した場合は、[名前を付けて保存]ダイアログを開きます。
戻り値:非同期操作を表すTaskオブジェクト。
説明:デザイナで[名前を付けて保存]ダイアログボックスを開きます。Description: Opens 'Save As' dialog.
戻り値:非同期操作を表すTaskオブジェクト。
説明:指定されたIDを使用して、編集中のレポートをデザイナに保存します。
戻り値:保存されたドキュメント情報を表すValueTask<SaveDocumentInfo>オブジェクト。
説明:指定された名前を使用して、編集中のレポートをデザイナに保存します。
戻り値:保存されたドキュメントの情報を表すValueTask<SaveDocumentInfo>オブジェクト。
戻り値:ドキュメントに関するAPI。
サンプルコード |
コードのコピー
|
---|---|
@page "/" @inject IJSRuntime JSRuntime <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner @ref="_designer" Document="@_doc" PreviewSettings="@_preview" /> </div> @code { private ReportDesigner _designer; private PreviewSettings _preview; private ReportViewer _viewer; private Document _doc = new Document { Id = "Example.rdlx", Type = SupportedDocumentType.cpl }; public Index() { _preview = new PreviewSettings { CanPreview = true, OpenViewer = OpenViewer }; } private async void OpenViewer(ViewerSettings settings) { if(_viewer != null) { await _viewer.OpenReport(settings.DocumentInfo.Id); return; } Documents api = _designer.Documents; _viewer = new ReportViewer(); var initOptions = new InitializationOptions(); initOptions.ReportID = settings.DocumentInfo.Id; initOptions.PanelsLocation = PanelsLocation.toolbar; initOptions.ReportLoaded = (reportInfo) => { }; await _viewer.Render(JSRuntime, settings.Element, initOptions); } } |
ドキュメントに関するAPIの設定を取得または設定します。
パラメータ(型):
説明:Blazor Webデザイナコンポーネントの[ファイル]タブの設定を取得または設定します。
戻り値:[ファイル]タブの現在の値。
説明:ハンドラを取得または設定します。
戻り値:ハンドラの現在の値。
戻り値:ドキュメントAPIに指定された設定。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner DocumentsSettings="@_documentsSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private DocumentsSettings _documentsSettings = new DocumentsSettings { FileView = new FileView { Visible = true }, Handlers = new Handlers() }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
OnDocumentChanged handlerのサンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner DocumentsSettings="_documentsSettings"/> </div> @code { private DocumentsSettings _documentsSettings; public Index() { _documentsSettings = new DocumentsSettings() { Handlers = new Handlers() { OnDocumentChanged = (options) => { ... } } }; } } |
エディタの設定を取得または設定します。
パラメータ(型):
説明:デフォルトでグリッドを表示するか非表示にするかを指定します。
戻り値:グリッド表示の現在の値。
説明:[グリッドにスナップ]オプションのデフォルト値を指定します。
戻り値:[グリッドにスナップ]オプションの現在の値。
説明:[ガイドにスナップ]オプションのデフォルト値を指定します。
戻り値:[ガイドにスナップ]オプションの現在の値。
説明:デフォルトのグリッドサイズを指定します。単位が「cm」の場合、デフォルト値は「0.5cm」です。それ以外の場合、デフォルト値は「0.25in」です。
戻り値:現在のグリッドサイズ。
説明:ルーラーの設定を取得または設定します。
戻り値:ルーラーの現在の値。
戻り値:エディタの設定。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner EditorSettings="@_editorSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private EditorSettings _editorSettings = new EditorSettings { ShowGrid = true, SnapToGrid = true, SnapToGuides = true, Rulers = new Rulers(), GridSize = "0.5cm" }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
コントロールに許可されるフォントのリストを取得または設定します。
パラメータ(型):
戻り値:コントロールに許可されるフォントのリスト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner Fonts="@_fonts" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private string[] _fonts = new string[1] { "Arial" }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
デザイナの高さを取得または設定します。
パラメータ(型):
戻り値:デザイナの高さ。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner Height="20%" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
説明:コントロールでサポートされている画像のMIMEタイプのリストを指定します。
パラメータ(型):
戻り値:コントロールでサポートされている画像のMIMEタイプのリスト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner ImageMimeTypes="@_imageMimeTypes" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private string[] _imageMimeTypes = new string[3] { "image/gif", "image/jpeg", "image/png" }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
説明:デザイナに使用する言語を指定します。Blazor Webデザイナは次の言語で利用できます:en、ja、zh。
パラメータ(型):
戻り値:指定された言語。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner Language="ja-JP" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
特定のロケールのローカリゼーション リソースを取得または設定します。
パラメータ(型):
説明:言語を取得または設定します。
戻り値:指定された言語。
説明:JSON配列内のローカリゼーション リソースを取得または設定します。
戻り値:JSON配列で表される指定されたローカリゼーション リソースを返します。
戻り値:カスタム ローカリゼーション リソースの配列を返します。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner LocalizationResources="@_localizationResources" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private LocalizationResources[] _localizationResources = { new LocalizationResources() { Language = "en", Resources = "[ { \"ns\": \"common\", \"lng\": \"en\", \"resources\": { \"units\": { \"cm\": { \"textShortName\": \"CustomName_cm\", \"textFullName\": \"CustomName_Centimeters\" } } } } ]" } }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
説明:レポートレイアウトとの対話を管理します。LockLayoutを有効にすると、既存のレポートアイテムの変更が可能です。新しいレポートアイテムを追加するや、既存のアイテムを削除するなどのレポートのレイアウトを変更することができません。
パラメータ(型):
戻り値:LockLayoutの現在の状態。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner LockLayout="true" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
Blazor Webデザイナコンポーネントのメニューの設定を取得または設定します。
パラメータ(型):
説明:Webデザイナの[エクスプローラ]ボタンの設定。
戻り値:エクスプローラの設定を表すオブジェクト。
説明:Webデザイナコンポーネントの[グループエディタ]ボタンの設定。
戻り値:グループエディタの設定を表すオブジェクト。
説明:Webデザイナコンポーネントの[レイヤー]ボタンの設定。
戻り値:レイヤーの設定を表すオブジェクト。
説明:ロゴの設定。
戻り値:ロゴ設定を表すオブジェクト。
説明:ツールボックスの設定。
戻り値:ツールボックスの設定を表すオブジェクト。
説明:メニューを表示する必要があるかどうかを指定します。
戻り値:現在の表示・非表示の状態を表す値。
戻り値:メニューの現在の設定。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner MenuSettings="@_menuSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private MenuSettings _menuSettings = new MenuSettings { DocumentExplorer = new DocumentExplorer { Visible = true }, GroupEditor = new GroupEditor { Visible = true }, LayerEditor = new LayerEditor { Visible = true }, Logo = new Logo { Visible = true }, ToolBox = new ToolBox { Visible = true }, Visible = true }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
通知に関するAPIを取得します。
パラメータ(型):
説明:指定されたレベル、キャプション、およびコンテンツの通知を送信します。
戻り値:非同期操作を表すTaskオブジェクト。
説明:警告を送信します。
戻り値:非同期操作を表すTaskオブジェクト。
説明:ユーザーのアクションが完了したときに通知するために使用できる、一般的な通知を送信します。
戻り値:非同期操作を表すTaskオブジェクト。
説明:エラー通知を送信します。
戻り値:非同期操作を表すTaskオブジェクト。
説明:すべての通知を閉じます。
戻り値:非同期操作を表すTaskオブジェクト。
戻り値:通知に関するAPI。
サンプルコード |
コードのコピー
|
---|---|
@page "/" @inject IJSRuntime JSRuntime <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner @ref="_designer" PreviewSettings="@_preview" /> </div> @code { private ReportDesigner _designer; private PreviewSettings _preview; private ReportViewer _viewer; public Index() { _preview = new PreviewSettings { CanPreview = true, OpenViewer = OpenViewer }; } private async void OpenViewer(ViewerSettings settings) { if (_viewer != null) { await _viewer.OpenReport(settings.DocumentInfo.Id); return; } Notifications api = _designer.Notifications; _viewer = new ReportViewer(); var initOptions = new InitializationOptions(); initOptions.ReportID = settings.DocumentInfo.Id; initOptions.PanelsLocation = PanelsLocation.toolbar; initOptions.ReportLoaded = (reportInfo) => { }; await _viewer.Render(JSRuntime, settings.Element, initOptions); } } |
プレビューに関する設定を取得または設定します。
パラメータ(型):
説明:[プレビュー]ボタンを表示するかどうかを取得または設定します。
説明:OpenViewer関数を提供することで、レポートビューワのコンポーネントをプラグインできます。
戻り値:プレビュー設定。
サンプルコード |
コードのコピー
|
---|---|
@page "/" @inject IJSRuntime JSRuntime <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner @ref="_designer" PreviewSettings="@_preview" /> </div> @code { private ReportDesigner _designer; private PreviewSettings _preview; private ReportViewer _viewer; public Index() { _preview = new PreviewSettings { CanPreview = true, OpenViewer = OpenViewer }; } private async void OpenViewer(ViewerSettings settings) { if (_viewer != null) { await _viewer.OpenReport(settings.DocumentInfo.Id); return; } _viewer = new ReportViewer(); var initOptions = new InitializationOptions(); initOptions.ReportID = settings.DocumentInfo.Id; initOptions.PanelsLocation = PanelsLocation.toolbar; initOptions.ReportLoaded = (reportInfo) => { }; await _viewer.Render(JSRuntime, settings.Element, initOptions); } } |
プロパティグリッドの設定を取得または設定します。
パラメータ(型):
説明:[プロパティ]タブの設定を取得または設定します。
戻り値:[プロパティ]タブの現在の設定を表すPropertiesTabオブジェクト。
説明:デフォルトのプロパティモードを指定します。使用可能な値は、Mode.BasicおよびCourier New Mode.Advancedです。
戻り値:[プロパティ]タブの現在のモード。
説明:デフォルトのプロパティの並べ替え(ソート)方法を指定します。使用可能な値は、Sort.categorizedおよびSort.alphabeticalです。
戻り値:[プロパティ]タブの現在の並べ替え方法。
戻り値:プロパティグリッドの現在の設定を表すPropertyGridSettings。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner PropertyGridSettings="@_propertyGridSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private PropertyGridSettings _propertyGridSettings = new PropertyGridSettings { Mode = Mode.Advanced, Sort = Sort.categorized, PropertiesTab = new PropertiesTab { Visible = false } }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
RDLXプラットフォーム固有の設定を取得または設定します。
パラメータ(型):
説明:デザイナで使用される式構文を取得または設定します。使用可能な値は、ExpressionSyntax.i11nおよびExpressionSyntax.rdlです。
戻り値:現在の式構文の設定を表すオブジェクト。
ToolBoxContent:ToolBoxContent
説明:ツールボックスでのコントロールとその表示順序を取得または設定します。
戻り値:現在の設定を持つ使用可能なレポートアイテムとその順序を表すToolBoxContentオブジェクト。
InitTemplates:InitTemplates
説明:レポートをrdlx-json文字列として取得または設定します。これらのレポートのレポートアイテムは、新しいアイテムを作成するためのテンプレートとして使用されます。
戻り値:現在のテンプレート設定を表すInitTemplatesオブジェクト。
ReportItemsFeatures:RdlxReportItemsSettings
説明:カスタマイズ可能なレポートアイテムの機能を取得または設定します。
戻り値:現在のカスタマイズ可能なレポートアイテムの機能を表すRdlxReportItemsSettingsオブジェクト。
ReportStyles:ReportStyles[]
説明:レポートアイテムのスタイルに追加するスタイルを取得または設定します。
戻り値:レポート要素スタイルに追加する現在の追加スタイルを表すReportStylesオブジェクトの配列。
Msl:Msl
説明:複数エリアを持つRDLレポートの設定を取得または設定します。
戻り値:複数エリアを持つRDLレポートの設定を表すMslオブジェクト。
Dashboard:Dashboard
説明:ダッシュボードレポートの設定を取得または設定します。
戻り値:現在のダッシュボードレポートの設定を表すDashboardオブジェクト。
戻り値:現在のRDLXレポートの設定を表すRdlxSettingsオブジェクト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner RdlxSettings="@_rdlxSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private RdlxSettings _rdlxSettings = new RdlxSettings { Dashboard = new Dashboard { Enabled = true }, Msl = new Msl { Enabled = true }, ExpressionSyntax = ExpressionSyntax.rdl, InitTemplates = new InitTemplates(), ReportItemsFeatures = new RdlxReportItemsSettings(), ReportStyles = { }, ToolBoxContent = new ToolBoxContent { Cpl = new[] { RdlxToolBoxItem.formattedtext } } }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
RPXプラットフォーム固有の設定を取得または設定します。これらの設定を行うには、RPXレポートが存在する必要があります。
パラメータ(型):
説明:セクションレポート(RPXファイル)の設定を有効にするかどうかを取得または設定します。
戻り値:RPXレポートの現在のアクティブ化値を表すオブジェクト。
説明:レポートをrdlx-json文字列として取得または設定します。これらのレポートのレポートアイテムは、新しいアイテムを作成するためのテンプレートとして使用されます。
戻り値:現在のテンプレート設定を表すInitTemplatesオブジェクト。
戻り値:現在のRPXレポートも設定を表すRpxSettingsオブジェクト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner RpxSettings="@_rpxSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private RpxSettings _rpxSettings = new RpxSettings { Enabled = true, InitTemplates = new InitTemplates() }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
サーバーに関する設定を取得または設定します。
パラメータ(型):
説明:WebデザイナのサーバーAPIのベースURLを取得または設定します。
戻り値:WebデザイナのサーバーAPIの現在のベースURLを表す文字列。
説明:Webデザイナで要求を変更するためのハンドラを取得または設定します。
戻り値:要求を変更する現在のハンドラを表すFunc<RequestInit, RequestInit>オブジェクト。
戻り値:サーバーに関する現在の設定を表すServerSettingsオブジェクト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner ServerSettings="@_serverSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private ServerSettings _serverSettings = new ServerSettings { OnBeforeRequest = delegate (RequestInit requestInit) { return requestInit; }, Url = "http://localhost:5098/" }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
Webデザイナコンポーネントのステータスバーの設定を取得または設定します。
パラメータ(型):
説明:Webデザイナの[寸法の単位]ボタンの設定を取得または設定します。
戻り値:現在の[寸法の単位]ボタンの設定を表すToggleUnitsButtonオブジェクト。
説明:Webデザイナの[グリッドの幅]エディタの設定を取得または設定します。
戻り値:現在の[グリッドの幅]エディタの設定を表すGridSizeEditorオブジェクト。
説明:Webデザイナコンポーネントのルーラーボタンの設定を取得または設定します。
戻り値:現在のルーラーボタンの設定を表すRulersButtonオブジェクト。
説明:Webデザイナでステータスバーを表示するかどうかを指定します。
戻り値:ステータスバーを表示するかどうかを指定する値。
戻り値:現在のステータスバーの設定を表すStatusBarSettings。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner StatusBarSettings="@_statusBarSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private StatusBarSettings _statusBarSettings = new StatusBarSettings { GridSizeEditor = new GridSizeEditor { Visible = true }, PropertiesModeButton = new PropertiesModeButton { Visible = true }, RulersButton = new RulersButton { Visible = true }, ToggleGridButton = new ToggleGridButton { Visible = true }, ToggleUnitsButton = new ToggleUnitsButton { Visible = true }, Visible = true }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
レポートの保存を管理します。StoreUnsavedReportを有効にすると、ブラウザタブまたはブラウザ自体が誤って閉じられた場合、未保存レポートを復元します。
パラメータ(型):
戻り値:StoreUnsavedReportの現在の状態を表す値。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner StoreUnsavedReport="false" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
ユーザー設定を管理します。StoreUserPreferencesを有効にすると、ユーザー設定はブラウザに保存されます。
パラメータ(型):
戻り値:StoreUserPreferencesの現在の状態を表す値。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner StoreUserPreferences="false" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
セクションレポートのスタイル設定を取得または設定します。
パラメータ(型):
説明:[スタイル]タブの設定を取得または設定します。
戻り値:現在のスタイルタブの設定を表すStylesTabオブジェクト。
説明:Webデザイナでスタイルシートの設定を取得または設定します。
戻り値:現在のスタイルシート設定を表すStylesheetオブジェクト。
戻り値:セクションレポートの現在のスタイル設定を表すStylesSettingsオブジェクト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner StylesSettings="@_styleSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private StylesSettings _styleSettings = new StylesSettings { Stylesheet = new Stylesheet { CanModify = true }, StylesTab = new StylesTab { Visible = true } }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
ドキュメントのタイトルの設定を取得または設定します。
パラメータ(型):
説明:ドキュメントのタイトルが無効かどうかを示す値を取得または設定します。
戻り値:ドキュメントのタイトルが無効かどうかを表す値。
戻り値:現在のドキュメントのタイトル設定を表すTitleSettingsオブジェクト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner TitleSettings="@_titleSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private TitleSettings _titleSettings = new TitleSettings { Disabled = false }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
ツールバーの設定を取得または設定します。
パラメータ(型):
説明:ツールバーを表示するかどうかを表す値を取得または設定します。
戻り値:ツールバーを表示するかどうかを表す値。
戻り値:現在のツールバー設定を表すToolBarSettingsオブジェクト。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner ToolBarSettings="@_toolbarSettings" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; private ToolBarSettings _toolbarSettings = new ToolBarSettings { Visible = true }; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
デザイナで使用されるデフォルトの寸法の単位を指定します。使用可能な値は、Units.InおよびUnits.Cmです。
パラメータ(型):
戻り値:レポートデザイナのデフォルトの寸法単位の現在値。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner Units="Units.Cm" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
デザイナの幅を取得または設定します。
パラメータ(型):
戻り値:デザイナの幅を返します。
サンプルコード |
コードのコピー
|
---|---|
@page "/" <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <div id="designerContainer"> <ReportDesigner Width="20%" PreviewSettings="@_preview" /> </div> @code { private PreviewSettings _preview; public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
エクスプローラパネルを管理します。BlazorデザイナのAPIからパネルを管理するには、「*.razor」ページではサンプルコードを使用します。
次の例では、BlazorデザイナのAPIを使用してレポートのエクスプローラパネルを呼び出しています。
コードのコピー
|
|
---|---|
<button @onclick="OpenDocumentExplorer">エクスプローラを開く</button>
|
コードのコピー
|
|
---|---|
private async void OpenDocumentExplorer() { await _designer.App.Panels.Menu.Open("document-explorer"); } |
完全なコードは次のようになります。
サンプルコード |
コードのコピー
|
---|---|
@page "/" @inject IJSRuntime JSRuntime <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <button @onclick="OpenDocumentExplorer">エクスプローラを開く</button> <div id="designerContainer"> <ReportDesigner @ref="_designer" PreviewSettings="@_preview" /> </div> @code { private ReportDesigner _designer; private PreviewSettings _preview; private ReportViewer _viewer; private async void OpenDocumentExplorer() { await _designer.App.Panels.Menu.Open("document-explorer"); } public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |
アプリケーションのAPIのクリップボードと選択状態を管理します。アプリケーションAPIのクリップボードと選択状態を管理するには、「*.razor」ページではサンプルコードを使用します。
次の例では、カスタムボタンを使用してデザイナでの最後の操作を元に戻します。
コードのコピー
|
|
---|---|
<button @onclick="UndoLastOperation">最後の操作を元に戻す</button>
|
コードのコピー
|
|
---|---|
private async void UndoLastOperation() { await _designer.App.Editor.Undo(); } |
完全なコードは次のようになります。
サンプルコード |
コードのコピー
|
---|---|
@page "/" @inject IJSRuntime JSRuntime <link href="_content/GrapeCity.ActiveReports.Blazor.Viewer/jsViewer.min.css" rel="stylesheet" /> <button @onclick="UndoLastOperation">最後の操作を元に戻す</button> <div id="designerContainer"> <ReportDesigner @ref="_designer" PreviewSettings="@_preview" /> </div> @code { private ReportDesigner _designer; private PreviewSettings _preview; private ReportViewer _viewer; private async void UndoLastOperation() { await _designer.App.Editor.Undo(); } public Index() { _preview = new PreviewSettings { CanPreview = false }; } } |