Xamarin. Mac のウィンドウWindows in Xamarin.Mac

この記事では、Xamarin. Mac アプリケーションでのウィンドウとパネルの使用について説明します。Xcode と Interface Builder でのウィンドウとパネルの作成、ストーリーボードと xib ファイルからの読み込み、プログラムによる作業について説明します。This article covers working with windows and panels in a Xamarin.Mac application. It describes creating windows and panels in Xcode and Interface Builder, loading them from storyboards and .xib files, and working with them programmatically.

Xamarin. Mac アプリケーションで C# と .NET を使用している場合、開発者が 目的の C および Xcode で作業しているのと同じウィンドウとパネルにアクセスできます。When working with C# and .NET in a Xamarin.Mac application, you have access to the same Windows and Panels that a developer working in Objective-C and Xcode does. Xcode は直接統合されているため、Xcode の Interface Builder を使用して、ウィンドウとパネルを作成および管理できます (または、必要に応じて C# コードで直接作成することもできます)。Because Xamarin.Mac integrates directly with Xcode, you can use Xcode's Interface Builder to create and maintain your Windows and Panels (or optionally create them directly in C# code).

Xamarin アプリケーションでは、その目的に基づいて、画面上に1つまたは複数のウィンドウを表示して、表示および操作する情報を管理および調整できます。Based on its purpose, a Xamarin.Mac application can present one or more Windows on screen to manage and coordinate the information it displays and works with. ウィンドウの主な機能は次のとおりです。The principal functions of a window are:

  1. ビューとコントロールを配置および管理できる領域を提供する。To provide an area in which Views and Controls can be placed and managed.
  2. キーボードとマウスの両方を使用したユーザーの操作に応じて、イベントを受け入れて応答する。To accept and respond to events in response to user interaction with both the keyboard and mouse.

ウィンドウは、モードレス状態 (複数のドキュメントを一度に開くことができるテキストエディターなど) またはモーダル (アプリケーションを続行する前に閉じる必要があるエクスポートダイアログなど) で使用できます。Windows can be used in a Modeless state (such as a text editor that can have multiple documents open at once) or Modal (such as an Export dialog that must be dismissed before the application can continue).

パネルとは、特殊な種類のウィンドウ (基本クラスのサブクラス NSWindow ) です。通常は、テキスト形式のインスペクターやシステムカラーピッカーなどのユーティリティウィンドウなど、アプリケーションで補助関数を提供します。Panels are a special kind of Window (a subclass of the base NSWindow class), that typically serve an auxiliary function in an application, such as utility windows like Text format inspectors and system Color Picker.

Xcode でのウィンドウの編集Editing a window in Xcode

この記事では、Xamarin. Mac アプリケーションで Windows とパネルを操作するための基本について説明します。In this article, we'll cover the basics of working with Windows and Panels in a Xamarin.Mac application. この記事で使用する主要な概念と手法について説明しているように、最初に Hello, Mac の記事「 Xcode と Interface Builder の概要 」と「 アウトレットとアクション 」セクションをご覧になることを強くお勧めします。It is highly suggested that you work through the Hello, Mac article first, specifically the Introduction to Xcode and Interface Builder and Outlets and Actions sections, as it covers key concepts and techniques that we'll be using in this article.

C# のクラス/メソッドを Xamarin. Mac の内部 ドキュメントの前に公開する」セクションを参照して Register Export ください。 c# クラスを目的の c オブジェクトと UI 要素に接続するために使用されるコマンドとコマンドについても説明します。You may want to take a look at the Exposing C# classes / methods to Objective-C section of the Xamarin.Mac Internals document as well, it explains the Register and Export commands used to wire-up your C# classes to Objective-C objects and UI Elements.

Windows の概要Introduction to windows

前述のように、ウィンドウには、ビューとコントロールを配置および管理し、ユーザーの操作 (キーボードまたはマウスを使用) に基づいてイベントに応答する領域が用意されています。As stated above, a Window provides an area in which Views and Controls can be placed and managed and responds to events based on user interaction (either via keyboard or mouse).

Apple によれば、macOS アプリには次の5つの主要な種類のウィンドウがあります。According to Apple, there are five main types of Windows in a macOS App:

  • ドキュメントウィンドウ -ドキュメントウィンドウには、スプレッドシートやテキストドキュメントなどのファイルベースのユーザーデータが含まれています。Document Window - A document window contains file-based user data such as a spreadsheet or a text document.
  • アプリウィンドウ -アプリウィンドウは、ドキュメントベースではないアプリケーションのメインウィンドウです (Mac 上の予定表アプリなど)。App Window - An app window is the main window of an application that is not document-based (like the Calendar app on a Mac).
  • パネル -他のウィンドウの上にフローティングし、ドキュメントが開いている間にユーザーが操作できるツールまたはコントロールが用意されています。Panel - A panel floats above other windows and provides tools or controls that users can work with while documents are open. 場合によっては、パネルを半透明にすることができます (大規模なグラフィックスを操作する場合など)。In some cases, a panel can be translucent (such as when working with large graphics).
  • ダイアログ -ユーザーの操作に応答してダイアログが表示され、通常、ユーザーがアクションを完了する方法が示されます。Dialog - A dialog appears in response to a user action and typically provides ways users can complete the action. ダイアログを閉じるには、ユーザーからの応答が必要です。A dialog requires a response from the user before it can be closed. (「 ダイアログの操作」を参照)(See Working with Dialogs)
  • アラート -アラートは、重大な問題 (エラーなど) が発生したとき、または警告 (ファイルの削除の準備など) が発生したときに表示される特別な種類のダイアログです。Alerts - An alert is a special type of dialog that appears when a serious problem occurs (such as an error) or as a warning (such as preparing to delete a file). アラートはダイアログであるため、閉じる前にユーザーの応答も必要です。Because an alert is a dialog, it also requires a user response before it can be closed. (「 アラートの操作」を参照)(See Working with Alerts)

詳細については、Apple のmacOS デザインテーマの「 About Windows 」セクションを参照してください。For more information, see the About Windows section of Apple's macOS design themes.

メイン、キー、および非アクティブなウィンドウMain, key, and inactive windows

Xamarin. Mac アプリケーションのウィンドウは、ユーザーが現在どのように対話しているかに基づいて、外観と動作が異なります。Windows in a Xamarin.Mac application can look and behave differently based on how the user is currently interacting with them. 現在ユーザーの注目に重点を置いている最も重要なドキュメントまたはアプリウィンドウは、 _メインウィンドウ_と呼ばれます。The foremost Document or App Window that is currently focus of the user’s attention is called the Main Window. ほとんどの場合、このウィンドウは キーウィンドウ (現在ユーザー入力を受け入れているウィンドウ) にもなります。In most instances this Window will also be the Key Window (the window that is currently accepting user input). ただし、これは常にではありません。たとえば、カラーピッカーが開いている場合や、ユーザーが対話して、ドキュメントウィンドウ内の項目の状態を変更するためにユーザーが操作しているキーウィンドウである場合があります (これはメインウィンドウでもあります)。But this isn't always the case, for example, a Color Picker could be open and be the Key window that the user is interacting with to change the state of an item in the Document Window (which would still be the Main Window).

メインウィンドウとキーウィンドウ (これらが分離されている場合) は常にアクティブであり、 非アクティブウィンドウ は開いているウィンドウであり、フォアグラウンドにはありません。The Main and Key Windows (if they are separate) are always active, Inactive Windows are open windows that are not in the foreground. たとえば、テキストエディターアプリケーションでは、一度に複数のドキュメントを開くことができ、メインウィンドウだけがアクティブになり、その他はすべて非アクティブになります。For example, a text editor application could have more than one document open at a time, only the Main Window would be active, all others would be inactive.

詳細については、Apple のmacOS デザインテーマの「 About Windows 」セクションを参照してください。For more information, see the About Windows section of Apple's macOS design themes.

Windows の名前付けNaming windows

ウィンドウにはタイトルバーを表示できます。タイトルが表示されるときは、通常、アプリケーションの名前、作業中のドキュメントの名前、またはウィンドウの機能 (インスペクターなど) が表示されます。A Window can display a Title Bar and when the Title is displayed, it's usually the name of the application, the name of the document being worked on or the function of the window (such as Inspector). アプリケーションによっては、タイトルバーが表示されない場合があります。これは、表示によって認識され、ドキュメントを使用しないためです。Some applications don't display a Title Bar because they are recognizable by sight and don't work with documents.

Apple では、次のガイドラインを提案します。Apple suggest the following guidelines:

  • ドキュメント以外のメインウィンドウのタイトルには、アプリケーション名を使用します。Use your application name for the title of a main, non-document window.
  • 新しいドキュメントウィンドウに名前を指定 untitled します。Name a new document window untitled. 最初の新しいドキュメントでは、タイトルに数字 (など) を追加しないで untitled 1 ください。For the first new document, don't append a number to the Title (such as untitled 1). 保存する前にユーザーが別の新しいドキュメントを作成し、最初の文書にタイトルを追加した場合は、そのウィンドウ、などを呼び出し untitled 2 untitled 3 ます。If the user creates another new document before saving and titling the first, call that window untitled 2, untitled 3, etc.

詳細については、Apple のmacOS デザインテーマに関するWindows の名前付けに関するセクションを参照してください。For more information, see the Naming Windows section of Apple's macOS design themes.

全画面表示ウィンドウFull-screen windows

MacOS では、アプリケーションのウィンドウが全画面表示され、アプリケーションのメニューバー (画面の上部にカーソルを移動すると表示されることがあります) をすべて非表示にすることができます。In macOS, an application's window can go full screen hiding everything including the Application Menu Bar (which can be revealed by moving the cursor to the top of the screen) to provide distraction free interaction with it's content.

Apple では、次のガイドラインが提案されています。Apple suggests the following guidelines:

  • ウィンドウが全画面表示に適しているかどうかを判断します。Determine whether it makes sense for a window to go full screen. 簡単な操作 (電卓など) を提供するアプリケーションは、全画面表示モードを提供してはいけません。Applications that provide brief interactions (such as a Calculator) shouldn't provide a full screen mode.
  • 全画面表示のタスクで必要な場合は、ツールバーを表示します。Show the toolbar if the full-screen task requires it. 通常、全画面表示モードでは、ツールバーは非表示になります。Typically the toolbar is hidden while in full screen mode.
  • 全画面表示ウィンドウには、ユーザーがタスクを完了するために必要なすべての機能が含まれている必要があります。The full-screen window should have all the features users need to complete the task.
  • 可能であれば、ユーザーが全画面表示のウィンドウにある間は Finder の対話を避けてください。If possible, avoid Finder interaction while the user is in a full-screen window.
  • メインタスクからフォーカスを移動せずに、増加した画面領域を活用します。Take advantage of the increased screen space without shifting the focus away from the main task.

詳細については、Apple のmacOS デザインテーマ全画面ウィンドウのセクションを参照してください。For more information, see the Full-Screen Windows section of Apple's macOS design themes.

パネルPanels

パネルは、アクティブなドキュメントまたは選択 (システムカラーピッカーなど) に影響を与えるコントロールとオプションを含む補助ウィンドウです。A Panel is an auxiliary window that contains controls and options that affect the active document or selection (such as the system Color Picker):

カラーパネルA color panel

パネルには、 アプリ固有 またはシステム _全体_を使用できます。Panels can be either App-Specific or Systemwide. アプリ固有のパネルは、アプリケーションのドキュメントウィンドウの上部に表示され、アプリケーションがバックグラウンドで表示されると消えます。App-Specific Panels float over the top of the application's document windows and disappear when the application is in the background. システム全体のパネル ([ フォント ] パネルなど) では、アプリケーションに関係なく、すべての開いているウィンドウの上にフローティングします。Systemwide Panels (such as the Fonts panel), float on top of all open windows no matter the application.

Apple では、次のガイドラインが提案されています。Apple suggests the following guidelines:

  • 一般に、標準パネルを使用すると、透明なパネルは控えめに使用する必要があるだけで、グラフィックを多用するタスクにも使用できます。In general, use a standard panel, transparent panels should only be used sparingly and for graphically intensive tasks.
  • ユーザーが自分のタスクに直接影響を与える重要なコントロールや情報に簡単にアクセスできるようにするには、パネルを使用することを検討してください。Consider using a panel to give users easy access to important controls or information that directly affects their task.
  • 必要に応じて、パネルを非表示にして表示します。Hide and show panels as required.
  • パネルには常にタイトルバーを含める必要があります。Panels should always include title bar.
  • パネルには、アクティブな [最小化] ボタンを含めないでください。Panels should not include an active minimize button.

インスペクターInspectors

最新の macOSアプリケーションでは、パネルウィンドウを使用するのではなく、メインウィンドウの一部である_インスペクター_として、アクティブなドキュメントまたは選択項目に影響を与える補助コントロールとオプションが用意されています。Most modern macOS applications present auxiliary controls and options that affect the active document or selection as Inspectors that are part of the Main Window (like the Pages app shown below), instead of using Panel Windows:

インスペクターの例An example inspector

詳細については、「Apple のmacOS デザインテーマ」と「 macinspectorサンプルアプリ」の「パネル」セクションを参照して、Xamarin. Mac アプリでインスペクターインターフェイスを完全に実装してください。For more information, see the Panels section of Apple's macOS design themes and our MacInspector sample app for a full implementation of an Inspector Interface in a Xamarin.Mac app.

Xcode でのウィンドウの作成と保守Creating and maintaining windows in Xcode

新しい Xamarin. Mac Cocoa アプリケーションを作成すると、既定で標準の空白のウィンドウが表示されます。When you create a new Xamarin.Mac Cocoa application, you get a standard blank, window by default. このウィンドウは .storyboard 、プロジェクトに自動的に含まれるファイルに定義されています。This windows is defined in a .storyboard file automatically included in the project. Windows のデザインを編集するには、 ソリューションエクスプローラーで、ファイルをダブルクリックし Main.storyboard ます。To edit your windows design, in the Solution Explorer, double click the Main.storyboard file:

メインストーリーボードの選択Selecting the main storyboard

これにより、Xcode の Interface Builder でウィンドウのデザインが開きます。This will open the window design in Xcode's Interface Builder:

Xcode で UI を編集するEditing the UI in Xcode

属性インスペクターには、ウィンドウの定義と制御に使用できるプロパティがいくつかあります。In the Attribute Inspector, there are several properties that you can use to define and control your window:

  • Title -これは、ウィンドウのタイトルバーに表示されるテキストです。Title - This is the text that will be displayed in the window's titlebar.
  • [自動保存]-位置が指定され、設定が自動的に保存されるときにウィンドウを ID するために使用される_キー_です。Autosave - This is the key that will be used to ID the window when it's position and settings are automatically saved.
  • タイトルバー -ウィンドウにタイトルバーが表示されます。Title Bar - Does the window display a title bar.
  • 統合されたタイトルとツールバー -ウィンドウにツールバーが含まれている場合は、タイトルバーの一部である必要があります。Unified Title and Toolbar - If the window includes a Toolbar, should it be part of the title bar.
  • 全サイズのコンテンツビュー -ウィンドウのコンテンツ領域をタイトルバーの下に配置できるようにします。Full Sized Content View - Allows the content area of the window to be under the Title bar.
  • Shadow -ウィンドウに影が付きます。Shadow - Does the window have a shadow.
  • テクスチャ が適用されたウィンドウは、vibrancy のような効果を使用して、本体の任意の場所にドラッグすることによって移動できます。Textured - Textured windows can use effects (like vibrancy) and can be moved around by dragging anywhere on their body.
  • [閉じる]: ウィンドウに [閉じる] ボタンがあります。Close - Does the window have a close button.
  • 最小化 -ウィンドウに最小化ボタンが表示されます。Minimize - Does the window have a minimize button.
  • [サイズ変更]-ウィンドウにサイズ変更コントロールがあります。Resize - Does the window have a resize control.
  • ツールバーボタン -ウィンドウにツールバーボタンが表示されます。Toolbar Button - Does the window have a hide/show toolbar button.
  • 復元 可能-ウィンドウの位置と設定を自動的に保存および復元します。Restorable - Is the window's position and settings automatically saved and restored.
  • 起動時に表示 -ファイルが読み込まれるときに、ウィンドウが自動的に表示され .xib ます。Visible At Launch - Is the window automatically shown when the .xib file is loaded.
  • アクティブ化時に非表示にする-アプリケーションが背景に入ったときにウィンドウが非表示になります。Hide On Deactivate - Is the window hidden when the application enters the background.
  • [終了時にリリース]-ウィンドウが閉じられたときにメモリから削除されます。Release When Closed - Is the window purged from memory when it is closed.
  • 常にツールヒントを表示 する-ツールヒントが常に表示されます。Always Display Tooltips - Are the tooltips constantly displayed.
  • 計算ビューループ-ウィンドウが描画される前に、ビューの順序が再計算されます。Recalculates View Loop - Is the view order recalculated before the window is drawn.
  • スペースexposé 、および 循環 -すべての macOS 環境でのウィンドウの動作を定義します。Spaces, Exposé and Cycling - All define how the window behaves in those macOS environments.
  • 全画面 -このウィンドウが全画面表示モードに入ることができるかどうかを決定します。Full Screen - Determines if this window can enter the full screen mode.
  • アニメーション -ウィンドウで使用できるアニメーションの種類を制御します。Animation - Controls the type of animation available for the window.
  • [外観]-ウィンドウの外観を制御します。Appearance - Controls the appearance of the window. ここでは、水色だけが表示されます。For now there is only one appearance, Aqua.

詳細については、Apple の Windows とNswindow概要に関するドキュメントを参照してください。See Apple's Introduction to Windows and NSWindow documentation for more details.

既定のサイズと場所の設定Setting the default size and location

ウィンドウの初期位置を設定し、サイズを制御するには、 サイズインスペクターに切り替えます。To set the initial position of your window and to control it's size, switch to the Size Inspector:

既定のサイズと場所The default size and location

ここでは、ウィンドウの初期サイズを設定し、それに最小値と最大サイズを設定し、画面の最初の位置を設定して、ウィンドウの周囲の境界線を制御できます。From here you can set the initial size of the window, give it a minimum and maximum size, set the initial location on the screen and control the borders around the window.

カスタムメインウィンドウコントローラーの設定Setting a custom main window controller

UI 要素を C# コードに公開するためのアウトレットとアクションを作成できるようにするには、Xamarin. Mac アプリでカスタムウィンドウコントローラーを使用する必要があります。To be able to create Outlets and Actions to expose UI elements to C# code, the Xamarin.Mac app will need to be using a Custom Window Controller.

次の手順を実行します。Do the following:

  1. Xcode の Interface Builder でアプリのストーリーボードを開きます。Open the app's Storyboard in Xcode's Interface Builder.

  2. デザインサーフェイスでを選択し NSWindowController ます。Select the NSWindowController in the Design Surface.

  3. [ Identity Inspector ] ビューに切り替え、 WindowController クラス名として「」と入力します。Switch to the Identity Inspector view and enter WindowController as the Class Name:

    クラス名の設定Setting the class name

  4. 変更を保存し、Visual Studio for Mac に戻って同期します。Save your changes and return to Visual Studio for Mac to sync.

  5. ファイルは、 WindowController.cs Visual Studio for Mac の ソリューションエクスプローラー にプロジェクトに追加されます。A WindowController.cs file will be added to your Project in the Solution Explorer in Visual Studio for Mac:

    Windows コントローラーの選択Selecting the windows controller

  6. Xcode の Interface Builder でストーリーボードを再度開きます。Reopen the Storyboard in Xcode's Interface Builder.

  7. この WindowController.h ファイルは、次のように使用できます。The WindowController.h file will be available for use:

    WindowController .h ファイルを編集していますEditing the WindowController.h file

UI 要素の追加Adding UI elements

ウィンドウのコンテンツを定義するには、 ライブラリインスペクター から インターフェイスエディターにコントロールをドラッグします。To define the content of a window, drag controls from the Library Inspector onto the Interface Editor. Interface Builder を使用してコントロールを作成および有効にする方法の詳細については、 Xcode の概要と Interface Builder のドキュメントを参照してください。Please see our Introduction to Xcode and Interface Builder documentation for more information about using Interface Builder to create and enable controls.

例として、 ライブラリインスペクター から インターフェイスエディターのウィンドウにツールバーをドラッグしてみましょう。As an example, let's drag a Toolbar from the Library Inspector onto the window in the Interface Editor:

ライブラリからのツールバーの選択Selecting a Toolbar from the Library

次に、 テキストビュー をドラッグして、ツールバーの下の領域に合わせてサイズを変更します。Next, drag in a Text View and size it to fill the area under the toolbar:

テキストビューの追加Adding a Text View

ウィンドウのサイズが変更されたときに テキストビュー を縮小して拡大する必要があるため、 制約エディター に切り替えて、次の制約を追加してみましょう。Since we want the Text View to shrink and grow as the window's size changes, let's switch to the Constraint Editor and add the following constraints:

制約の編集Editing constraints

エディターの上部にある4つの 赤の I ビーム をクリックし、[4 つの 制約の追加] をクリックすると、指定された X、Y 座標に収まるようにテキストビューが表示され、ウィンドウのサイズが変更されると、水平方向および垂直方向に拡大または縮小されます。By clicking the four Red I-Beams at the top of the editor and clicking Add 4 Constraints, we are telling the text view to stick to the given X,Y coordinates and grow or shrink horizontally and vertically as the window is resized.

最後に、アウトレットを使用してテキストビューをコードに公開します (ファイルを確実に選択し ViewController.h ます)。Finally, expose the Text View to code using an Outlet (making sure to select the ViewController.h file):

アウトレットの構成Configuring an outlet

変更を保存し、Visual Studio for Mac に戻って Xcode と同期します。Save your changes and switch back to Visual Studio for Mac to sync with Xcode.

アウトレット****とアクションの操作の詳細については、アウトレットとアクションのドキュメントを参照してください。For more information about working with Outlets and Actions, please see our Outlet and Action documentation.

標準ウィンドウワークフローStandard window workflow

Xamarin. Mac アプリケーションで作成して使用するすべてのウィンドウについて、このプロセスは基本的に上記の手順と同じです。For any window that you create and work with in your Xamarin.Mac application, the process is basically the same as what we have just done above:

  1. プロジェクトに自動的に追加されない新しいウィンドウの場合は、新しいウィンドウ定義をプロジェクトに追加します。For new windows that are not the default added automatically to your project, add a new window definition to the project. 詳細については、以下で詳しく説明します。This will be discussed in detail below.
  2. ファイルをダブルクリックして Main.storyboard 、Xcode の Interface Builder で編集するためのウィンドウデザインを開きます。Double-click the Main.storyboard file to open the window design for editing in Xcode's Interface Builder.
  3. 新しいウィンドウをユーザーインターフェイスのデザインにドラッグし、_セグエ_を使用してウィンドウをメインウィンドウにフックします (詳細については、ストーリーボードの操作に関するドキュメントのセグエに関するセクションを参照してください)。Drag a new Window into the User Interface's design and hook the window into Main Window using Segues (for more information see the Segues section of our Working with Storyboards documentation).
  4. 属性インスペクターサイズインスペクターで必要なウィンドウプロパティを設定します。Set any required window properties in the Attribute Inspector and the Size Inspector.
  5. インターフェイスを構築するために必要なコントロールをドラッグして、 属性インスペクターで構成します。Drag in the controls required to build your interface and configure them in the Attribute Inspector.
  6. サイズインスペクターを使用して、UI 要素のサイズ変更を処理します。Use the Size Inspector to handle the resizing for your UI Elements.
  7. ウィンドウの UI 要素を、 コンセントアクションを使用して C# コードに公開します。Expose the window's UI elements to C# code via Outlets and Actions.
  8. 変更を保存し、Visual Studio for Mac に戻って Xcode と同期します。Save your changes and switch back to Visual Studio for Mac to sync with Xcode.

基本的なウィンドウが作成されたので、windows を操作するときに、Xamarin アプリケーションが実行する一般的なプロセスを見ていきます。Now that we have a basic window created, we'll look at the typical processes a Xamarin.Mac application does when working with windows.

既定のウィンドウを表示するDisplaying the default window

既定では、新しい Xamarin. Mac アプリケーションは、 MainWindow.xib 開始時にファイルに定義されているウィンドウを自動的に表示します。By default, a new Xamarin.Mac application will automatically display the window defined in the MainWindow.xib file when it is started:

実行中のウィンドウの例An example window running

上のウィンドウのデザインを変更したため、既定のツールバーと テキストビュー コントロールが追加されました。Since we modified the design of that window above, it now includes a default Toolbar and Text View control. ファイルの次のセクションで Info.plist は、このウィンドウを表示します。The following section in the Info.plist file is responsible for displaying this window:

情報を編集しています。 plistEditing Info.plist

メインの [ インターフェイス ] ドロップダウンを使用して、メインアプリの UI (この場合は) として使用するストーリーボードを選択し Main.storyboard ます。The Main Interface dropdown is used to select the Storyboard that will be used as the main app UI (in this case Main.storyboard).

ビューコントローラーがプロジェクトに自動的に追加され、表示されるメインウィンドウ (およびそのプライマリビュー) が制御されます。A View Controller is automatically added to the project to control that Main Windows that is displayed (along with its primary View). これは、ファイルで定義され、 ViewController.cs id インスペクターの Interface Builder のファイルの所有者にアタッチされます。It is defined in the ViewController.cs file and attached to the File's Owner in Interface Builder under the Identity Inspector:

ファイルの所有者を設定していますSetting the file's owner

ウィンドウでは、最初にを開いたときにのタイトルが表示されるようにするため untitled 、のメソッドをオーバーライドして ViewWillAppear ViewController.cs 次のようにします。For our window, we'd like it to have a title of untitled when it first opens so let's override the ViewWillAppear method in the ViewController.cs to look like the following:

public override void ViewWillAppear ()
{
    base.ViewWillAppear ();

    // Set Window Title
    this.View.Window.Title = "untitled";
}

注意

ウィンドウの Title プロパティは、メソッドの代わりにメソッドで設定され ViewWillAppear ViewDidLoad ます。これは、ビューがメモリに読み込まれても、まだ完全にインスタンス化されていないためです。The window's Title property is set in the ViewWillAppear method instead of the ViewDidLoad method because, while the view might be loaded into memory, it is not yet fully instantiated. メソッド内のプロパティにアクセスする Title ViewDidLoad null と、ウィンドウがまだ構築されていないため、例外が発生します。Accessing the Title property in the ViewDidLoad method we will get a null exception since the window hasn't been constructed and wired-up to the property yet.

プログラムによるウィンドウの終了Programmatically closing a window

ユーザーがウィンドウの [ 閉じる ] ボタンをクリックしたり、メニュー項目を使用したりするのではなく、プログラムによって Xamarin. Mac アプリケーションでウィンドウを閉じることが必要になる場合があります。There might be times that you wish to programmatically close a window in a Xamarin.Mac application, other than having the user click the window's Close button or using a menu item. macOS では、との2つの異なる方法で、プログラムによってを閉じることが NSWindow PerformClose できます。 ClosemacOS provides two different ways to close an NSWindow programmatically: PerformClose and Close.

パフォーマンスを閉じるPerformClose

PerformCloseのメソッドを呼び出す NSWindow と、ユーザーがウィンドウの [閉じる] ボタンをクリックすると、そのボタンが一時的に強調表示され、ウィンドウが閉じます。Calling the PerformClose method of an NSWindow simulates the user clicking the window's Close button by momentarily highlighting the button and then closing the window.

アプリケーションがのイベントを実装する場合は、 NSWindow WillClose ウィンドウが閉じられる前に発生します。If the application implements the NSWindow's WillClose event, it will be raised before the window is closed. イベントからが返された場合、ウィンドウは閉じられ false ません。If the event returns false, then the window will not be closed. ウィンドウに [ 閉じる ] ボタンがない場合、または何らかの理由で閉じることができない場合は、OS によって警告音が出力されます。If the window does not have a Close button or cannot be closed for any reason, the OS will emit the alert sound.

次に例を示します。For example:

MyWindow.PerformClose(this);

はインスタンスを終了しようとし MyWindow NSWindow ます。Would attempt to close the MyWindow NSWindow instance. 成功した場合、ウィンドウは閉じられます。それ以外の場合は、警告音が出力され、が開いたままになります。If it was successful, the window will be closed, else the alert sound will be emitted and the will stay open.

閉じるClose

のメソッドを呼び出すと、 Close NSWindow ウィンドウを一時的に強調表示してウィンドウの [ 閉じる ] ボタンをクリックしても、ウィンドウが閉じられるだけではありません。Calling the Close method of an NSWindow does not simulates the user clicking the window's Close button by momentarily highlighting the button, it simply closes the window.

ウィンドウは閉じられている必要はなく、 NSWindowWillCloseNotification 閉じられているウィンドウの既定の通知センターに通知が投稿されます。A window does not have to be visible to be closed and an NSWindowWillCloseNotification notification will be posted to the default Notification Center for the window being closed.

メソッドは、 Close メソッドの2つの重要な方法で異なり PerformClose ます。The Close method differs in two important ways from the PerformClose method:

  1. イベントの発生を試みることはありません WillCloseIt does not attempt to raise the WillClose event.
  2. ユーザーが [ 閉じる ] ボタンをクリックしても、ボタンを一時的に強調表示することはできません。It does not simulate the user clicking the Close button by momentarily highlighting the button.

次に例を示します。For example:

MyWindow.Close();

インスタンスを閉じ MyWindow NSWindow ます。Would to close the MyWindow NSWindow instance.

変更された windows コンテンツModified windows content

MacOS では、ユーザーにウィンドウ () の内容が変更されていること、および保存する必要があることをユーザーに通知する方法が Apple から提供されてい NSWindow ます。In macOS, Apple has provided a way to inform the user that the contents of a Window (NSWindow) has been modified by the user and needs to be saved. ウィンドウに変更されたコンテンツが含まれている場合は、小さい黒い点が 閉じ たウィジェットに表示されます。If the Window contains modified content, a small black dot will be displayed in it's Close widget:

変更されたマーカーを含むウィンドウA window with the modified marker

ウィンドウのコンテンツに未保存の変更があるときに、ユーザーがウィンドウを閉じたり、Mac アプリを終了しようとしたりした場合は、 ダイアログボックス または モーダルシート を表示し、ユーザーが最初に変更を保存できるようにする必要があります。If the user attempts to close the Window or quit the Mac App while there are unsaved changes to the Window's content, you should present a Dialog Box or Modal Sheet and allow the user to save their changes first:

ウィンドウを閉じたときに表示される保存シートA save sheet being shown when the window is closed

ウィンドウを変更済みとしてマークするMarking a window as modified

ウィンドウを変更されたコンテンツとしてマークするには、次のコードを使用します。To mark a Window as having modified content, use the following code:

// Mark Window content as modified
Window.DocumentEdited = true;

変更が保存されたら、次のように変更したフラグをクリアします。And once the change has been saved, clear the modified flag using:

// Mark Window content as not modified
Window.DocumentEdited = false;

ウィンドウを閉じる前に変更を保存するSaving changes before closing a window

ユーザーがウィンドウを閉じ、変更されたコンテンツを事前に保存できるようにするには、のサブクラスを作成し、そのメソッドをオーバーライドする必要があり NSWindowDelegate WindowShouldClose ます。To watch for the user closing a Window and allowing them to save modified content beforehand, you will need to create a subclass of NSWindowDelegate and override its WindowShouldClose method. 次に例を示します。For example:

using System;
using AppKit;
using System.IO;
using Foundation;

namespace SourceWriter
{
    public class EditorWindowDelegate : NSWindowDelegate
    {
        #region Computed Properties
        public NSWindow Window { get; set;}
        #endregion

        #region constructors
        public EditorWindowDelegate (NSWindow window)
        {
            // Initialize
            this.Window = window;

        }
        #endregion

        #region Override Methods
        public override bool WindowShouldClose (Foundation.NSObject sender)
        {
            // is the window dirty?
            if (Window.DocumentEdited) {
                var alert = new NSAlert () {
                    AlertStyle = NSAlertStyle.Critical,
                    InformativeText = "Save changes to document before closing window?",
                    MessageText = "Save Document",
                };
                alert.AddButton ("Save");
                alert.AddButton ("Lose Changes");
                alert.AddButton ("Cancel");
                var result = alert.RunSheetModal (Window);

                // Take action based on result
                switch (result) {
                case 1000:
                    // Grab controller
                    var viewController = Window.ContentViewController as ViewController;

                    // Already saved?
                    if (Window.RepresentedUrl != null) {
                        var path = Window.RepresentedUrl.Path;

                        // Save changes to file
                        File.WriteAllText (path, viewController.Text);
                        return true;
                    } else {
                        var dlg = new NSSavePanel ();
                        dlg.Title = "Save Document";
                        dlg.BeginSheet (Window, (rslt) => {
                            // File selected?
                            if (rslt == 1) {
                                var path = dlg.Url.Path;
                                File.WriteAllText (path, viewController.Text);
                                Window.DocumentEdited = false;
                                viewController.View.Window.SetTitleWithRepresentedFilename (Path.GetFileName(path));
                                viewController.View.Window.RepresentedUrl = dlg.Url;
                                Window.Close();
                            }
                        });
                        return true;
                    }
                    return false;
                case 1001:
                    // Lose Changes
                    return true;
                case 1002:
                    // Cancel
                    return false;
                }
            }

            return true;
        }
        #endregion
    }
}

次のコードを使用して、このデリゲートのインスタンスをウィンドウにアタッチします。Use the following code to attach an instance of this delegate to the window:

// Set delegate
Window.Delegate = new EditorWindowDelegate(Window);

アプリを閉じる前に変更を保存するSaving changes before closing the app

最後に、Xamarin アプリで、変更されたコンテンツが含まれている Windows があるかどうかを確認し、終了する前にユーザーが変更を保存できるようにする必要があります。Finally, your Xamarin.Mac App should check to see if any of its Windows contain modified content and allow the user to save the changes before quitting. これを行うには、ファイルを編集し、 AppDelegate.cs メソッドをオーバーライドして、 ApplicationShouldTerminate 次のようにします。To do this, edit your AppDelegate.cs file, override the ApplicationShouldTerminate method and make it look like the following:

public override NSApplicationTerminateReply ApplicationShouldTerminate (NSApplication sender)
{
    // See if any window needs to be saved first
    foreach (NSWindow window in NSApplication.SharedApplication.Windows) {
        if (window.Delegate != null && !window.Delegate.WindowShouldClose (this)) {
            // Did the window terminate the close?
            return NSApplicationTerminateReply.Cancel;
        }
    }

    // Allow normal termination
    return NSApplicationTerminateReply.Now;
}

複数のウィンドウの操作Working with multiple windows

ほとんどのドキュメントベースの Mac アプリケーションでは、複数のドキュメントを同時に編集できます。Most document based Mac applications can edit multiple documents at the same time. たとえば、テキストエディターでは、複数のテキストファイルを同時に編集することができます。For example, a text editor can have multiple text files open for edit at the same time. 既定では、新しい Xamarin. Mac アプリケーションには [ファイル] メニューがあり、自動的に新しい項目がアクションに自動的に接続され newDocument: Actionます。By default, a new Xamarin.Mac application has a File menu with a New item automatically wired-up to the newDocument: Action.

次のコードでは、この新しい項目をアクティブ化し、ユーザーがメインウィンドウの複数のコピーを開いて、一度に複数のドキュメントを編集できるようにします。The code below will activate this new item and allow the user to open multiple copies of the Main Window to edit multiple documents at once.

ファイルを編集 AppDelegate.cs し、次の計算されたプロパティを追加します。Edit the AppDelegate.cs file and add the following computed property:

public int UntitledWindowCount { get; set;} =1;

これを使用して、保存されていないファイルの数を追跡し、ユーザーにフィードバックを提供することができます (前述のように、Apple のガイドラインに従ってください)。Use this to track the number of unsaved files so we can give feedback to the user (per Apple's guidelines as discussed above).

次に、次のメソッドを追加します。Next, add the following method:

[Export ("newDocument:")]
void NewDocument (NSObject sender) {
    // Get new window
    var storyboard = NSStoryboard.FromName ("Main", null);
    var controller = storyboard.InstantiateControllerWithIdentifier ("MainWindow") as NSWindowController;

    // Display
    controller.ShowWindow(this);

    // Set the title
    controller.Window.Title = (++UntitledWindowCount == 1) ? "untitled" : string.Format ("untitled {0}", UntitledWindowCount);
}

このコードは、ウィンドウコントローラーの新しいバージョンを作成し、新しいウィンドウを読み込み、メインウィンドウとキーウィンドウにして、タイトルを設定します。This code creates a new version of our Window Controller, loads the new Window, makes it the Main and Key Window, and sets it title. ここでアプリケーションを実行し、[ファイル] メニューから [新規] を選択すると、新しいエディターウィンドウが開き、表示されます。Now if we run our application, and select New from the File menu a new editor window will be opened and displayed:

新しい無題のウィンドウが追加されましたA new untitled window was added

Windowsメニューを開くと、アプリケーションが自動的に追跡し、開いているウィンドウを処理していることがわかります。If we open the Windows menu, you can see the application is automatically tracking and handling our open windows:

Windows のメニューThe windows menu

Xamarin. Mac アプリケーションでのメニューの操作の詳細については、「 メニューの操作 」のドキュメントを参照してください。For more information on working with Menus in a Xamarin.Mac application, please see our Working with Menus documentation.

現在アクティブなウィンドウを取得していますGetting the currently active window

複数のウィンドウ (ドキュメント) を開くことができる Xamarin アプリケーションでは、現在の最上位ウィンドウ ([キー] ウィンドウ) を取得する必要がある場合があります。In a Xamarin.Mac application that can open multiple windows (documents), there are times when you will need to get the current, topmost window (the key window). 次のコードは、キーウィンドウを返します。The following code will return the key window:

var window = NSApplication.SharedApplication.KeyWindow;

現在のキーウィンドウにアクセスする必要がある任意のクラスまたはメソッドで呼び出すことができます。It can be called in any class or method that needs to access the current, key window. 現在開いているウィンドウがない場合は、が返され null ます。If no window is currently open, it will return null.

すべてのアプリウィンドウにアクセスするAccessing all app windows

Xamarin. Mac アプリで現在開いているすべてのウィンドウにアクセスする必要がある場合があります。There might be times where you need to access all of the windows that your Xamarin.Mac app currently has open. たとえば、ユーザーが開こうとしているファイルが既に開いているウィンドウで開かれているかどうかを確認します。For example, to see if a file that the user wants to open is already open in an exiting window.

は、 NSApplication.SharedApplication Windows アプリ内のすべての開いているウィンドウの配列を格納するプロパティを保持します。The NSApplication.SharedApplication maintains a Windows property that contains an array of all open windows in your app. この配列を反復処理して、すべてのアプリの現在のウィンドウにアクセスできます。You can iterate over this array to access all of the app's current windows. 次に例を示します。For example:

// Is the file already open?
for(int n=0; n<NSApplication.SharedApplication.Windows.Length; ++n) {
    var content = NSApplication.SharedApplication.Windows[n].ContentViewController as ViewController;
    if (content != null && path == content.FilePath) {
        // Bring window to front
        NSApplication.SharedApplication.Windows[n].MakeKeyAndOrderFront(this);
        return true;
    }
}

コード例では、返された各ウィンドウを ViewController アプリのカスタムクラスにキャストし、ユーザーが開こうとしている Path ファイルのパスに対してカスタムプロパティの値をテストしています。In the example code we are casting each returned window to the custom ViewController class in our app and the testing the value of a custom Path property against the path of a file the user wants to open. ファイルが既に開いている場合は、そのウィンドウを前面に表示します。If the file is already open, we are bringing that window to the front.

コードでのウィンドウサイズの調整Adjusting the window size in code

アプリケーションでコード内のウィンドウのサイズを変更する必要がある場合もあります。There are times when the application needs to resize a window in code. ウィンドウのサイズと位置を変更するには、そのウィンドウのプロパティを調整し Frame ます。To resize and reposition a window, you adjust it's Frame property. ウィンドウのサイズを調整する場合は、通常、macOS の座標系によって同じ場所にウィンドウを維持するために、原点を調整する必要もあります。When adjusting a window's size, you usually need to also adjust it's origin, to keep the window in the same location because of macOS's coordinate system.

左上隅が (0, 0) を表す iOS の場合とは異なり、macOS では、画面の左下隅が (0, 0) を表す数学的座標系が使用されます。Unlike iOS where the upper left hand corner represents (0,0), macOS uses a mathematic coordinate system where the lower left hand corner of the screen represents (0,0). IOS では、右方向へ移動すると座標が増加します。In iOS the coordinates increase as you move downward towards the right. MacOS では、座標は右に向かって値を大きくします。In macOS, the coordinates increase in value upwards to the right.

次のコード例では、ウィンドウのサイズを変更します。The following example code resizes a window:

nfloat y = 0;

// Calculate new origin
y = Frame.Y - (768 - Frame.Height);

// Resize and position window
CGRect frame = new CGRect (Frame.X, y, 1024, 768);
SetFrame (frame, true);

重要

コード内で windows のサイズと位置を調整する場合は、Interface Builder で設定した最小サイズと最大サイズを確実に調整する必要があります。When you adjust a windows size and location in code, you need to make sure you respect the minimum and maximum sizes that you have set in Interface Builder. この設定は自動的には受け付けられず、ウィンドウをこれらの制限よりも大きくしたり小さくしたりすることができます。This will not be automatically honored and you will be able to make the window bigger or smaller than these limits.

ウィンドウサイズの変更の監視Monitoring window size changes

Xamarin. Mac アプリ内のウィンドウサイズの変更を監視する必要がある場合があります。There might be times where you need to monitor changes in a Window's size inside of your Xamarin.Mac app. たとえば、新しいサイズに合うようにコンテンツを再描画します。For example, to redraw content to fit the new size.

サイズの変更を監視するには、まず、Xcode の Interface Builder でウィンドウコントローラーのカスタムクラスが割り当てられていることを確認します。To monitor size changes, first ensure that you have assigned a custom class for the Window Controller in Xcode's Interface Builder. たとえば、 MasterWindowController 次のようにします。For example, MasterWindowController in the following:

Id インスペクターThe Identity Inspector

次に、カスタムウィンドウコントローラークラスを編集し、 DidResize コントローラーのウィンドウでイベントを監視して、ライブサイズの変更が通知されるようにします。Next, edit the custom Window Controller class and monitor the DidResize event on the Controller's Window to be notified of live size changes. 次に例を示します。For example:

public override void WindowDidLoad ()
{
    base.WindowDidLoad ();

    Window.DidResize += (sender, e) => {
        // Do something as the window is being live resized
    };
}

必要に応じて、イベントを使用して、 DidEndLiveResize ユーザーがウィンドウのサイズ変更を完了した後にのみ通知を受け取ることができます。Optionally, you can use the DidEndLiveResize event to only be notified after the user has finished changing the Window's size. たとえば次のようになります。For Example:

public override void WindowDidLoad ()
{
    base.WindowDidLoad ();

        Window.DidEndLiveResize += (sender, e) => {
        // Do something after the user's finished resizing
        // the window
    };
}

ウィンドウのタイトルと表現されたファイルの設定Setting a window’s title and represented file

ドキュメントを表すウィンドウを操作する場合、に NSWindow はプロパティがあります。これは、 DocumentEdited をに設定すると、 true ファイルが変更されたことをユーザーに示すため、閉じる前に保存する必要があることを示します。When working with windows that represent documents, NSWindow has a DocumentEdited property that if set to true displays a small dot in the Close Button to give the user an indication that the file has been modified and should be saved before closing.

ViewController.csファイルを編集し、次のように変更してみましょう。Let's edit our ViewController.cs file and make the following changes:

public bool DocumentEdited {
    get { return View.Window.DocumentEdited; }
    set { View.Window.DocumentEdited = value; }
}
...

public override void ViewWillAppear ()
{
    base.ViewWillAppear ();

    // Set Window Title
    this.View.Window.Title = "untitled";

    View.Window.WillClose += (sender, e) => {
        // is the window dirty?
        if (DocumentEdited) {
            var alert = new NSAlert () {
                AlertStyle = NSAlertStyle.Critical,
                InformativeText = "We need to give the user the ability to save the document here...",
                MessageText = "Save Document",
            };
            alert.RunModal ();
        }
    };
}

public override void AwakeFromNib ()
{
    base.AwakeFromNib ();

    // Show when the document is edited
    DocumentEditor.TextDidChange += (sender, e) => {
        // Mark the document as dirty
        DocumentEdited = true;
    };

    // Overriding this delegate is required to monitor the TextDidChange event
    DocumentEditor.ShouldChangeTextInRanges += (NSTextView view, NSValue[] values, string[] replacements) => {
        return true;
    };

}

また WillClose 、ウィンドウでイベントを監視し、プロパティの状態を確認し DocumentEdited ます。We are also monitoring the WillClose event on the window and checking the state of the DocumentEdited property. その場合は、 true 変更をファイルに保存する権限をユーザーに付与する必要があります。If it is true we need to give the user the ability to save the changes to the file. アプリを実行してテキストを入力すると、ドットが表示されます。If we run our app and enter some text, the dot will be displayed:

変更されたウィンドウA changed window

ウィンドウを閉じようとすると、アラートが表示されます。If you try to close the window, you get an alert:

保存ダイアログの表示Displaying a save dialog

ファイルからドキュメントを読み込む場合は、メソッドを使用して、ウィンドウのタイトルをファイルの名前に設定し window.SetTitleWithRepresentedFilename (Path.GetFileName(path)); ます (これ path は、開いているファイルを表す文字列です)。If you are loading a document from a file, set the title of the window to the file's name using the window.SetTitleWithRepresentedFilename (Path.GetFileName(path)); method (given that path is a string representing the file being opened). また、メソッドを使用して、ファイルの URL を設定することもでき window.RepresentedUrl = url; ます。Additionally, you can set the URL of the file using the window.RepresentedUrl = url; method.

URL が OS によって認識されるファイルの種類を指している場合、そのアイコンはタイトルバーに表示されます。If the URL is pointing to a file type known by the OS, its icon will be displayed in the title bar. ユーザーがアイコンを右クリックすると、ファイルへのパスが表示されます。If the user right clicks on the icon, the path to the file will be shown.

ファイルを編集 AppDelegate.cs し、次のメソッドを追加します。Edit the AppDelegate.cs file and add the following method:

[Export ("openDocument:")]
void OpenDialog (NSObject sender)
{
    var dlg = NSOpenPanel.OpenPanel;
    dlg.CanChooseFiles = true;
    dlg.CanChooseDirectories = false;

    if (dlg.RunModal () == 1) {
        // Nab the first file
        var url = dlg.Urls [0];

        if (url != null) {
            var path = url.Path;

            // Get new window
            var storyboard = NSStoryboard.FromName ("Main", null);
            var controller = storyboard.InstantiateControllerWithIdentifier ("MainWindow") as NSWindowController;

            // Display
            controller.ShowWindow(this);

            // Load the text into the window
            var viewController = controller.Window.ContentViewController as ViewController;
            viewController.Text = File.ReadAllText(path);
                    viewController.View.Window.SetTitleWithRepresentedFilename (Path.GetFileName(path));
            viewController.View.Window.RepresentedUrl = url;

        }
    }
}

ここでアプリを実行する場合は、[ファイル] メニューの [開く] を選択し、[開く] ダイアログボックスからテキストファイルを選択して開きます。Now if we run our app, select Open... from the File menu, select a text file from the Open Dialog box and open it:

[開く] ダイアログボックスAn open dialog box

ファイルが表示され、ファイルのアイコンでタイトルが設定されます。The file will be displayed and the title will be set with the icon of the file:

読み込まれたファイルの内容The contents of a file loaded

プロジェクトへの新しいウィンドウの追加Adding a new window to a project

メインのドキュメントウィンドウとは別に、Xamarin. Mac アプリケーションでは、他の種類のウィンドウをユーザーに表示する必要がある場合があります (ユーザー設定やインスペクターパネルなど)。Aside from the main document window, a Xamarin.Mac application might need to display other types of windows to the user, such as Preferences or Inspector Panels.

新しいウィンドウを追加するには、次の手順を実行します。To add a new window, do the following:

  1. ソリューションエクスプローラーで、ファイルをダブルクリックし Main.storyboard て、Xcode の Interface Builder で編集するために開きます。In the Solution Explorer, double-click the Main.storyboard file to open it for editing in Xcode's Interface Builder.

  2. 新しい ウィンドウコントローラーライブラリ からドラッグし、 デザインサーフェイスにドロップします。Drag a new Window Controller from the Library and drop it on the Design Surface:

    ライブラリで新しいウィンドウコントローラーを選択するSelecting a new Window Controller in the Library

  3. Id インスペクターで、 PreferencesWindow ストーリーボード IDとして「」と入力します。In the Identity Inspector, enter PreferencesWindow for the Storyboard ID:

    ストーリーボード ID の設定Setting the storyboard ID

  4. インターフェイスを設計します。Design your interface:

    UI のデザインDesigning the UI

  5. アプリメニュー ( MacWindows ) を開き、[ 基本設定...] を選択し、コントロールをクリックして新しいウィンドウにドラッグします。Open the App Menu (MacWindows), select Preferences..., Control-Click and drag to the new window:

    セグエの作成Creating a segue

  6. ポップアップメニューから [ 表示 ] を選択します。Select Show from the popup menu.

  7. 変更を保存し Visual Studio for Mac に戻り、Xcode と同期します。Save your changes and return to Visual Studio for Mac to sync with Xcode.

コードを実行し、[アプリケーション] メニューの [基本設定... ] を選択すると、ウィンドウが表示されます。If we run the code and select the Preferences... from the Application Menu, the window will be displayed:

[基本設定] メニューA sample preferences menu

パネルの操作Working with panels

この記事の冒頭で説明したように、パネルは他のウィンドウの上にフローティングし、ドキュメントが開いている間にユーザーが操作できるツールまたはコントロールを提供します。As stated at the start of this article, a panel floats above other windows and provides tools or controls that users can work with while documents are open.

Xamarin. Mac アプリケーションで作成して使用する他の種類のウィンドウと同様に、プロセスは基本的に同じです。Just like any other type of window that you create and work with in your Xamarin.Mac application, the process is basically the same:

  1. 新しいウィンドウ定義をプロジェクトに追加します。Add a new window definition to the project.
  2. ファイルをダブルクリックして .xib 、Xcode の Interface Builder で編集するためのウィンドウデザインを開きます。Double-click the .xib file to open the window design for editing in Xcode's Interface Builder.
  3. 属性インスペクターサイズインスペクターで必要なウィンドウプロパティを設定します。Set any required window properties in the Attribute Inspector and the Size Inspector.
  4. インターフェイスを構築するために必要なコントロールをドラッグして、 属性インスペクターで構成します。Drag in the controls required to build your interface and configure them in the Attribute Inspector.
  5. サイズインスペクターを使用して、UI 要素のサイズ変更を処理します。Use the Size Inspector to handle the resizing for your UI Elements.
  6. ウィンドウの UI 要素を、 コンセントアクションを使用して C# コードに公開します。Expose the window's UI elements to C# code via Outlets and Actions.
  7. 変更を保存し、Visual Studio for Mac に戻って Xcode と同期します。Save your changes and switch back to Visual Studio for Mac to sync with Xcode.

属性インスペクターには、パネルに固有の次のオプションがあります。In the Attribute Inspector, you have the following options specific to Panels:

属性インスペクターThe Attribute Inspector

  • スタイル -[標準] パネル (標準ウィンドウのように表示される)、[ユーティリティ] パネル (小さいタイトルバー)、[HUD] パネル (半透明で、タイトルバーが背景の一部である) からパネルのスタイルを調整できます。Style - Allow you to adjust the style of the panel from: Regular Panel (looks like a standard window), Utility Panel (has a smaller Title bar), HUD Panel (is translucent and the title bar is part of the background).
  • 非アクティブ化 -パネル内のがキーウィンドウになるかどうかを判断します。Non Activating - Determines in the panel becomes the key window.
  • ドキュメントモーダル -ドキュメントモーダルの場合、パネルはアプリケーションのウィンドウの上にのみ表示され、それ以外の場合はすべてを超えます。Document Modal - If Document Modal, the panel will only float above the application's windows, else it floats above all.

新しいパネルを追加するには、次の手順を実行します。To add a new Panel, do the following:

  1. ソリューションエクスプローラーで、プロジェクトを右クリックし、[ Add > 新しいファイルの追加] を選択します。In the Solution Explorer, right-click on the Project and select Add > New File....

  2. [新しいファイル] ダイアログボックスで、次のように選択します。 > Cocoa Window with ControllerIn the New File dialog box, select Xamarin.Mac > Cocoa Window with Controller:

    新しいウィンドウコントローラーの追加Adding a new window controller

  3. [名前] に「DocumentPanel」と入力し、 [新規] ボタンをクリックします。Enter DocumentPanel for the Name and click the New button.

  4. ファイルをダブルクリックし DocumentPanel.xib て、Interface Builder で編集するために開きます。Double-click the DocumentPanel.xib file to open it for editing in Interface Builder:

    パネルを編集するEditing the panel

  5. 既存のウィンドウを削除し、インターフェイスエディターライブラリインスペクターからパネルをドラッグします。Delete the existing Window and drag a Panel from the Library Inspector in the Interface Editor:

    既存のウィンドウを削除していますDeleting the existing window

  6. ファイルのオーナーウィンドウのアウトレットにパネルをフックし - window - Outletます。Hook the panel up to the File's Owner - window - Outlet:

    ドラッグしてパネルを接続するDragging to wire up the panel

  7. Id インスペクターに切り替えて、パネルのクラスを次のように設定し DocumentPanel ます。Switch to the Identity Inspector and set the Panel's class to DocumentPanel:

    パネルのクラスを設定するSetting the panel's class

  8. 変更を保存し Visual Studio for Mac に戻り、Xcode と同期します。Save your changes and return to Visual Studio for Mac to sync with Xcode.

  9. ファイルを編集 DocumentPanel.cs し、クラス定義を次のように変更します。Edit the DocumentPanel.cs file and change the class definition to the following:

    public partial class DocumentPanel : NSPanel

  10. 変更をファイルに保存します。Save the changes to the file.

ファイルを編集 AppDelegate.cs し、 DidFinishLaunching メソッドを次のようにします。Edit the AppDelegate.cs file and make the DidFinishLaunching method look like the following:

public override void DidFinishLaunching (NSNotification notification)
{
        // Display panel
    var panel = new DocumentPanelController ();
    panel.Window.MakeKeyAndOrderFront (this);
}

アプリケーションを実行すると、パネルが表示されます。If we run our application, the panel will be displayed:

実行中のアプリのパネルThe panel in a running app

重要

パネルウィンドウは Apple によって非推奨とされているため、 インスペクターインターフェイスに置き換える必要があります。Panel Windows have been deprecated by Apple and should be replaced with Inspector Interfaces. Xamarin. Mac アプリで インスペクター を作成する完全な例については、 macinspector サンプルアプリを参照してください。For a full example of creating an Inspector in a Xamarin.Mac app, please see our MacInspector sample app.

まとめSummary

この記事では、Xamarin. Mac アプリケーションでのウィンドウとパネルの使用について詳しく説明しました。This article has taken a detailed look at working with Windows and Panels in a Xamarin.Mac application. Windows とパネルのさまざまな種類と用途、Xcode の Interface Builder でウィンドウとパネルを作成および管理する方法、C# コードでウィンドウとパネルを操作する方法について説明しました。We saw the different types and uses of Windows and Panels, how to create and maintain Windows and Panels in Xcode's Interface Builder and how to work with Windows and Panels in C# code.