ユーザーコントロール(WPF)のDLLを作ってアプリで使うまでの手順メモ

ユーザーコントロールのDLLを作ってアプリで使うまでの手順メモ

いつものように間違っていたり冗長なところがあると思うけどできたので書いておく

字ばっかりで絵がないとわかんないよのね

 

 

ユーザーコントロールのDLLを作成するまで

1. WPFアプリのプロジェクトを新規作成
2. ソリューションにクラスライブラリの新規プロジェクトを追加
3. 追加したクラスライブラリにユーザーコントロールを新規追加
4. ユーザーコントロール作成、ビルド
5. WPFアプリのデザイン画面(XAML)にユーザーコントロール追加して動作確認
6. ユーザーコントロールに機能を追加していく
7. ユーザーコントロール完成、Releaseでビルド

 

作ったユーザーコントロールのDLLを他のアプリで使うまで

1. WPFアプリのプロジェクトを新規作成
2. プロジェクトの参照に作ったユーザーコントロールのDLLを追加
3. ツールボックスにユーザーコントロールを追加

 

 

作成するユーザーコントロールは

グラデーション画像を表示して、画像クリックでクリックした座標と色を表示する

 

 

 

 

 

1.WPFアプリのプロジェクトを新規作成

名前は

20180329_ユーザーコントロール作成テスト

にした

今回はこれがユーザーコントロールのデバッグ用アプリになる

 

 

 

2.ソリューションにクラスライブラリの新規プロジェクトを追加

メニューのファイル→追加→新しいプロジェクト

または

ソリューションエクスプローラーのソリューションを右クリック→追加→新しいプロジェクト

クラスライブラリ(.NET framework)を選択

名前は

ClassLibrary1ColorPicker

にした

 

追加したところ、ソリューションエクスプローラーで確認すると

ソリューションにClassLibrary1ColorPickerが追加されている

 

 

 

3.追加したクラスライブラリにユーザーコントロールを新規追加

ソリューションエクスプローラーでClassLibrary1ColorPickerを右クリック

メニューの追加→ユーザーコントロール

ユーザーコントロール(WPF)を選択

名前は

ColorPicker.xaml

にした

 

追加したところ

ソリューションエクスプローラーで確認すると

ClassLibrary1ColorPickerの中にColorPicker.xamlが追加されている

 

4.ユーザーコントロール作成、ビルド

ColorPicker.xamlに書いていく

10～14行目が書き加えたところ

Gridの中にStackPanelを追加、その中にTextBlockとBorder、Imageコントロールを追加

ここで一旦ビルドして

 

ビルド、正常終了したところ

これでツールボックスにユーザーコントロールが表示されるようになる

ツールボックスで確認すると追加したユーザーコントロールのColorPickerが表示されていた

これで他のButtonやTextBlockみたいにMainWindowに追加できるようになったのでダブルクリックやドラッグアンドドロップでMainWindowに追加してみる

 

 

 

5.WPFアプリのデザイン画面(XAML)にユーザーコントロール追加して動作確認

MainWindowにユーザーコントロールを追加したところ

デザイン画面にユーザーコントロールが表示されて

XAMLの7行目と12行目が追加変更された

7行目がよくわかんない、こういうもんなんだなあって思う程度

でもこれでできたっぽいので実行(デバッグ開始)してみると

 

ユーザーコントロールが表示されている、できてる

確認できたのでデバッグは一旦終了して、機能を追加していく、画像を表示とかクリックした場所の色を表示するとかの動作

 

 

6.ユーザーコントロールに機能を追加していく

ソリューションエクスプローラーからユーザーコントロールColorPicker.xamlを右クリック

メニューのコードの表示

または

ColorPicker.xamlを表示した状態でF7キー

 

ここにColorPicker.xamlの動作を書いていく

いつものWPFのアプリのときとほとんど同じ感じ

 

書いた動作内容は

• 起動時にグラデーション画像を作成して、それをImageコントロールに表示
• Imageコントロールをクリックしたら場所と色を取得して
• それぞれTextBlockとBorderに表示する

以上を書いたので

 

ビルドしてからデバッグ用のMainWindowのデザイン画面に戻ってみると

 

 

MainWindow.xaml

グラデーション画像が表示されている！でも小さくて表示しきれていないので

14行目を書き換えて

 

14行目にあった大きさ指定とか全部消したところ

全部表示された

 

名前の変更、別にしなくてもいいけど

7行目にある

ClassLibrary1ColorPicker

を

myColorPicker

に変更してみる

7行目にある

ClassLibrary1ColorPickerを右クリック、メニューの名前の変更で

myColorPickerに変更すると14行目の名前のところも同時に変更してくれる

変更できた

 

 

実行(デバッグ開始)してみる

表示された！

 

クリックしてみると

クリックした場所の座標がWindow上部左上のTextBlockに、

色が上部中央のBorderに表示された

これで目的の動作はできたので完成！

7.ユーザーコントロール完成、Releaseでビルド

ReleaseでビルドしようとDebugからReleaseに変更したら

なんかエラー出るけど気にしないで続行

 

64bit版にするためにAny CPUからx64に変更する

けど32bitでいいならAny CPUのままでもいいのかも

 

Release、64bitに変更したところ、エラーはそのままだねえ

リビルドすれば正常に表示されるってあるから

ビルドすると

 

正常終了した、デザイン画面のエラー表示もなくなった

これでできたみたいなのでReleaseをDebugに、x64をAny CPUに戻しておく

DLLファイルができたので確認してみる

 

できている！

場所は

…\20180329_ユーザーコントロール作成テスト\ClassLibrary1ColorPicker\bin\Release\ClassLibrary1ColorPicker.dll

次はこれを使うまで

 

 

 

1.WPFアプリのプロジェクトを新規作成

名前は

20180330_ユーザーコントロールのDLLを使う

にした

 

 

2.プロジェクトの参照に作ったユーザーコントロールのDLLを追加

ソリューションエクスプローラーから参照を右クリック

メニューの参照の追加で参照マネージャーを開いて

 

左側の項目から参照を選んで、参照ボタン

参照するファイルの選択画面でさっき作ったユーザーコントロールのDLLファイルを選択して追加ボタン

 

参照マネージャーに戻って、ユーザーコントロールのDLLファイルにチェックを入れてOKボタンで追加される

 

追加されたところ

ソリューションエクスプローラーの参照にユーザーコントロールのDLLClassLibrary1ColorPickerが追加されている

 

 

 

3.ツールボックスにユーザーコントロールを追加

ツールボックスを開いて

 

適当なところで右クリック

メニューからアイテムの選択

 

ツールボックスアイテムの選択画面が開く

WPFコンポーネントのタブを選択

読み込みに少し時間かかる

 

右下の参照ボタン

 

目的のユーザーコントロールのDLLファイルを選択して開くボタン

この辺はさっきのソリューションエクスプローラーの参照の追加と同じ感じ

 

ツールボックスに戻る、ユーザーコントロールが一覧に追加されてにチェックが入っているのでOKボタン

 

ツールボックスにユーザーコントロールが追加された！

これでツールボックスからドラッグアンドドロップかダブルクリックでMainWindowに追加できる

 

 

MainWindowに追加したところ

 

XAMLを修正してデバッグ開始してみると

 

動いた！

 

これでできたわけだけど

この方法が正しいのかはわからない、うまくいった手順を記録しただけ

気になったのが作ったユーザーコントロールのDLLを他のアプリで使う時に同じような参照の追加を2回するところ

どちらか1個でいいんじゃないと思って試しにソリューションエクスプローラーの参照からDLLを削除してみたら

参照から削除してみると

 

エラーになった

ツールボックスの方を見ていると

 

こちらは削除していないのでそのまま残っているねえ、でもエラー

 

今度は逆にツールボックスの方を削除してみる

ソリューションエクスプローラーの参照は追加し直してから

ツールボックスのユーザーコントロールを削除

 

あれ？今度はエラーにならない

デバッグ開始してみると普通に動いた

ってことはツールボックスへのアイテムの選択での追加は必要じゃないみたい

ってことはデザイン画面へユーザーコントロールを追加した時にXAMLに書き込まれた7行目が関係ありそうねえ、でもわかんないしできたからいいや

 

またカラーピッカーが使いたくなって、以前も作った気がする 

gogowaten.hatenablog.com

けどVBだったし、なによりもDLLじゃなかったので、どうせ作るなら他のアプリでも使えるようにユーザーコントロールでDLLで作ろうかと、前はDLLとか知らなかったからね、今なら作れるんじゃないかと

 

 

 

 

関連記事

 

2018/04/06は1週間後

gogowaten.hatenablog.com

カラーピッカーのdll(ライブラリ)作った、WPFユーザーコントロール ( ソフトウェア ) - 午後わてんのブログ - Yahoo!ブログ
https://blogs.yahoo.co.jp/gogowaten/15447603.html

 

 

 

2018/04/03、テストじゃなくて実際に使うものを作ってみた

gogowaten.hatenablog.com

WindowsFormのNumericUpDownみたいなのをWPFのユーザーコントロールでDLLで作ってみた ( ソフトウェア ) - 午後わてんのブログ - Yahoo!ブログ
https://blogs.yahoo.co.jp/gogowaten/15442773.html

 

2018/2/18、このときはユーザーコントロールなしの関数だけのDLL作成だった

gogowaten.hatenablog.com

dllファイル(クラスライブラリ.NET framework)の作り方と使うまでの手順メモ ( ソフトウェア ) - 午後わてんのブログ - Yahoo!ブログ
https://blogs.yahoo.co.jp/gogowaten/15377219.html

 

 

2016/3/29、ちょうど2年前かあ、同じこと繰り返しているなあｗ

gogowaten.hatenablog.com

WPFとVB.NETでカラーピッカーその1 ( ソフトウェア ) - 午後わてんのブログ - Yahoo!ブログ
https://blogs.yahoo.co.jp/gogowaten/14018045.html

 

 

 

2年後

 .NET Core、WPF、ユーザーコントロールのDLLをアプリで使うまでの手順メモ - 午後わてんのブログ

gogowaten.hatenablog.com