8
11

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Windows GUIプログラミング入門19 NuGet(1), 通知領域(タスクトレイ)

Last updated at Posted at 2019-06-08

■はじめに

今回はNuGetのライブラリを使って通知領域(タスクトレイ)にアイコンを表示するサンプルを作ります。
NuGetはライブラリの管理システムです。

キーワード:NuGet, タスクトレイ, 通知領域, トレイアイコン, Grid分割, レイアウト, 右クリックメニュー

■開発環境

  • Windows 10
  • Visual Studio Community 2019 ※今回から2019です
  • .NET Framework 4.x

■作ってみる

◇プロジェクトの作成

「新しいプロジェクトの作成」 - 「WPFアプリ」でプロジェクト名はNotifySampleにしました。

bg19-01.png

bg19-02.png

bg19-03.png

bg19-04.png

◇NuGetでライブラリをインストール

NuGetで通知領域にアイコンを表示するためのライブラリをインストールします。
プロジェクトを右クリックし、「NuGetパッケージの管理」を選択します。

bg19-05.png

「参照」タブを選択し、検索ボックスにHardcodet.NotifyIcon.Wpfを入力し、Hardcodet.NotifyIcon.Wpfをインストールします。
依存関係の部分は要チェック。必要な.NET Frameworkのバージョンや、動作するために必要な他のライブラリが書いてあったりします。

bg19-06.png

bg19-07.png

インストールしたライブラリは「インストール済み」のタブに表示されます。
インストール済みのライブラリで新バージョンがある場合は「更新プログラム」のタブに表示されます。下の図では1つ更新があることがわかります。

bg19-08.png

◇画面の作成

画面の白い部分をクリックしてGridを選択状態にします。
画面の左端付近にマウスカーソルを置き、+マークが出たらクリックしてGridを分割します。

bg19-09.png

bg19-10.png

ButtonをGridの上の行に、BorderをGridの下の行にドラッグ&ドロップします。

bg19-11.png

ButtonBorderをそれぞれ右クリック、「レイアウト」 - 「すべてリセット」を実行します。

bg19-13.png

◇トレイアイコンの追加

Windowの定義にxmlns:tb="http://www.hardcodet.net/taskbar"を追加します。

<Window x:Class="NotifySample.MainWindow"
:
        xmlns:tb="http://www.hardcodet.net/taskbar"
:

<tb:TaskbarIcon/>を追加します。

:
</Grid.RowDefinitions>

<tb:TaskbarIcon/>

<Button Content="Button"/>
:

ソリューションエクスプローラーのPropertiesを開き、Resourcesをダブルクリックします。

bg19-14.png

「リソースの追加」のドロップダウンを開き、「新しいアイコンの追加」を選択します。

bg19-15.png

そのまま追加します。

bg19-16.png

bg19-17.png

ソリューションエクスプローラーで「Resources」の「Icon1.ico」を選択し、プロパティウィンドウの「ビルドアクション」に「Resource」を選択します。

bg19-18.png

XAMLエディタで<tb:TaskbarIcon/>を選択し、プロパティウィンドウで「NotifyIcon」 - 「IconSource」からIcon1.icoを選択します。
「ToolTipText」にたすくとれいを入力します。

bg19-19.png

「その他の指定」 - 「ContextMenu」の「新規作成」ボタンを押します。

bg19-21.png

「ContextMenu」 - 「Items」の「...」ボタンを押します。

bg19-22.png

コレクションエディターで選択肢から「MenuItem」を選択し、「追加」ボタンを押します。
プロパティから「Header」に表示/隠すを入力して「OK」ボタンを押します。

bg19-23.png

ここまででTaskbarIconのXAMLは以下のようになっています。

<tb:TaskbarIcon IconSource="Resources/Icon1.ico" ToolTipText="たすくとれい">
    <tb:TaskbarIcon.ContextMenu>
        <ContextMenu>
            <MenuItem Header="表示/隠す"/>
        </ContextMenu>
    </tb:TaskbarIcon.ContextMenu>
</tb:TaskbarIcon>

XAMLエディタでMenuItemを選択し、プロパティウィンドウで稲妻マークを選択し、「Click」の欄をダブルクリックします。

bg19-24.png

メニュークリック時の処理を書きます。

private void MenuItem_Click(object sender, RoutedEventArgs e)
{
    if (this.Visibility == Visibility.Hidden)
    {
        this.Show();
    }
    else
    {
        this.Hide();
    }
}

■動かしてみる

実行してみます。

bg19-25.png

アイコンを右クリックします。

bg19-26.png

メニューの「表示/隠す」をクリックします。

bg19-27.png

画面が隠れました。

bg19-28.png

おしまい


<< 最初の記事   < 前の記事   次の記事 >

8
11
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
11

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?