ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～のお部屋へようこそ。
このお部屋では 第14章 の「 データの圧縮 」についてお話したいと思います。

アプリケーションを作成していけば 必然的に必要になるのがデータの入出力 なのですが 単純なテキストやバイナリをそのまま出力すると大変 なことになります。
それは、 ファイルのサイズ です。
とくに テキストファイルはどんどんファイルサイズが太ります

そこで必要になってくるのが圧縮してのサイズを小さくすることです
圧縮ってファイルサイズが小さくなるだけじゃなくてちょいと良いことがあるんですよ

それは、 データの安全性の向上 です
下手に圧縮ファイルをいじれば展開出来なくなります。
テキストに比べれば可読性が悪いのでデータを直接いじることも難しくなります

今回のサンプルでは 圧縮を行うため便利な関数を含めていますのでそのまま利用できます

関数の処理だけなのでVisual Studioの画面はいらないと思うのですが・・・
WPFを使ったアプリの 上級編ってことでWPFの利用テクニックを追加で紹介 しますよ。

今回のアプリでは処理結果をTextBlockで画面に表示しています
おなじみの Bindingを利用すればプログラムで設定した文字が表示できる のですが今までのやり方、 変数に代入するだけでは表示されない問題 となります
これは、変数が変わってもUIの表示が更新されないために発生するのです。

赤線で目印をしたところが PropertyChanged と言う バインドされた変数の更新を受け取ってUIを更新する ためのやり方です
黄色線はウィンドウの設定で今までのサンプルで使わなかったものです。

それぞれの内容です・・・
 WindowsStyleでツールウィンドウ表示に
 ResizeModeでウィンドウサイズを固定に
 SizeToContentで高さをUIに合わせて自動調整するように
 TopMostで最前面表示に
 WindowStartupLocationで実行画面の中央に表示されるように
各プロパティに設定した項目の説明でした。

今回もサンプルを載せましたので色々いじって研究してみてはいかがでしょう

 サンプルダウンロード
　


 サンプルイメージ画像

圧縮したいファイルのパスを指定して圧縮ボタンを押すことで元ファイルの隣に圧縮済みのデータを保存します。（圧縮後は.zlibと言う拡張子が付きます）


展開したいファイルのパスを指定して展開ボタンを押すことでZLib圧縮されたファイルを展開してファイルに保存します。（.binファイルとして拡張子を指定してます）


出来れば圧縮したことが分からない拡張子を選択することをおすすめします。
サンプルは簡単なエラーチェックのみをしていますので 製品アプリを製作する際はエラーチェックをしっかりとして 下さいね。
 

ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～のお部屋へようこそ。
このお部屋では 第12章 の「 アプリ製作の設計 」についてお話したいと思います。

アプリの製作において重要なのは設計ですよね
設計図もなしに構築していくのは 自殺行為
設計図を作成せずに製作出来る人は頭の中に設計図を描ける人だけです
ただし、頭の中はだれにも読み取ることはできませんし本人が忘れたら終わり なのです
情報として残すという意味でも設計は必ず行い書面化 しましょう

無駄に数時間プログラムを書くならちゃんと 設計して短時間で必要なプログラムを書け って思うね
設計せずにプログラムすると後で後悔するし無駄な作業コストが増えるから設計してプログラムしろって意味 だよ

さて、アプリを作るぞって思ってからゲストさんはどうしますか
いきなりコードは書きませんよね・・・

以下の内容は おとは が良く行う方法なのですが絶対ではありません
悪いところもあるでしょうから参考情報としてご利用下さい
ちなみに、ここで紹介している内容は とくに 転載とか2次配布禁止ですよっ
(他ページの物も基本私的利用以外は禁止だよ)
聞かれたら答える程度で後輩や新人にも教えたことない内容だから・・・
私的利用、社内利用はご自由に

 マインドマップによる構想
XMindというフリーのマインドマップツールです
PDFやMSプロジェクトへの出力などが便利なので  おとは  はそろそろ有料版にしようかと思っています。（1万円くらい）
社内でのブレインストーミングをするにも便利ですよ


マインドマップでなくて もエクセルでもワードでも良いので社内で利用しやすいツールを使って 下さい
重要なのは以下の内容を明記することです

 アプリの製作の肝となる「 目的 」、 何がしたいのか何が出来るのかを明確 にする。
 目的を達成するために必要なことを大枠で決める。　これをコアタスクとする
 コアタスクに概算工数 を付けて優先度順に並び変えていく
 概算工数からスケジュールに落とし込みしていく

上記の点をまとめるとワードのような文章よりはエクセルの図を利用する方が楽だと思います
おとは  は自宅ではXMindを利用していますのでそちらで紹介します

ぶろぐるすとーりーと 、本ウェブサイトの 土台システムの構想 です
 最初に目的として「ゴール」を決めます
 次に要件として必要な資産をまとめて足りないものを予算に応じて書きとめました。
 ゴールが決まればどんな機能があると良いかを考えます
　ブログ投稿サイトの構想なので他のサイトを参考にして欲しい機能を決めていきます。
　欲しい機能が決まったら実装していきたい順番を決めます。
 運営リスクを最初のうちから考えておきます
　リスク対策をしながら構築していくことはとっても重要です。


 マインドマップによる基本設計
構想が出来たら具体的な設計に入っていきます。
こちらの画像はぶろぐるすとーりーとの基本レイアウト・フォルダ構成・ライブラリの構成をまとめたものです。

ぶろぐるすとーりーとがどのようなレイアウト構成で表示を行っているのかが分かるようになっています
アプリの構成は書いていないですがライブラリの構成をまとめています。
開発PCとウェブサーバーへの反映方法も少しだけ記載しています


 アプリの基本設計
構想が出来たら具体的な設計に入っていきます。
この画像はメインアプリとライブラリまとめたものです。

ライブラリとメインアプリのソースコードの関連性と一部のフォルダ階層は画像が大きくなるので割愛しております
プログラムの設計上のフォルダ構成とプログラムの仕様別のファイル分けが分かってもらえたらと思います


 おまけ
現在開発中の おとは製 のC#の基本ライブラリと高級ライブラリの作成段階の構成図です。
こちらを元にVisual Studioでちょこちょこプログラムを構築しています

Ex が付いているのが 高級 ライブラリ です。
各個別のライブラリ処理をまとめて便利にしているから高級ってことになっています・・・
高級と付けるくらいだからこの画像からもっと進化していくだろうとは思うけどね
実際に使ってみて思うことがあれば拡張していくものなのでどんどん便利になるはず

設計に困ったら経験豊富な上司や先輩に素直に質問した方が絶対良い結果になるよ
（ちゃんと実績・実力がある人にたよってねっ）

過去にアナログで紙に書いた作品をスキャナで取り込みしました。 模写もあれば2次創作もあればオリジナルもあります。 気分や体調など色々あって時期によってまちまちですが少しずつ上達していっているのが分かるかと思います。 なんでも努力した人に結果が付いてくるよね。

ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～のお部屋へようこそ。
このお部屋では 第13章 の「 WPFアプリ配布の注意事項 」についてお話したいと思います。

ここからは上級編となります
個人の方よりは 企業向けの内容 で、「コスト削減のテクニック」や「ツールノウハウ」や「データの保護」、「業務で気にして欲しいこと」などをまとめていきます。

上級編の最初にお伝えするのは完成したアプリやライブラリの保護についてです
体験版だったり、期限を設けてバージョンアップを強制するなど色々と 販売商品には工夫をする必要 があります。
ライセンスファイル認証 でも アカウント認証 でも良いので実装します。
と言うのも、 無制限に利用し続けられるのは危険度が高いので避けるべき です
古いバージョンで動かないって言われてももう直しましたって言うバグもあるわけなので

WPFだけでなく.Net Frameworkを利用したマネージコードは組みやすい代わりにかなりの安全面に問題 があります
マネージコードはコンパイル後にMSILやCILと言う中間言語に変換 されます
このIL言語は組み直すことで処理を改変・編集することが出来てしまいます
どういうことになるかと言うと、 ライセンス認証や起動期限などを付けたとしても その判定処理自体を削除 してしまえば 無効化 できる のです
ツールを自由に利用できるだけでなく、ソースコードの中身も読み取れるのでどのような実装をしているかもわかってしまうのです
たくさんのノウハウを自らばらまいているということになります
ソースコードを読めるならそのまま利用して他のアプリを作ることだって出来てしまうのです

販売する商品がそんなのであったら・・・
本当に、おそろしい・・・

具体的に中身が見えているところをお見せしよう


これは ILSpy と言うフリーのソフトを利用しています。
私のWPFの講座の第11章で作成した実行ファイルWPF_Sample_06.exeを読込した際の情報が表示されています。
関数の中身が丸見えでしょ・・・

アプリを販売するなら、この 真っ裸のままじゃ怖すぎるので難読化を行う必要 があります
難読かアプリは10種類以上も出ており、10万～20万程度のものが主流のようです
Visual Studioに付属(機能制限版)のDotfuscatorも20万ほどします
予算がある企業なら実績のあアプリを使って難読化することをお勧め します。

今回、この講座においてわたしが個人と言うこともあるのと、 ライブラリやアプリを販売することも検討しているので数万円程度で購入できるアプリ を探すことにしました。
日本製やフリーの物など5種類ほど試したところで、ライセンス形式によりますが２～３万程度で購入できる
.Net Reactor を紹介します。


まずは、 検証も兼ねて体験版を利用 してみました。
英語版と言うことで敷居は高めですが、 出来ることはかなり多い ですね。
数10万する他のソフトよりも安くて機能が多いのがウリ のようです

実際、16項目をあげて.Net Reactorは15.5の機能がありますが他の比較されている高額製品は10ほどの機能と差が付いています。（本家サイトの情報元 -> http://www.eziriz.com/comparison.htm）

.Net Reactorで先ほどの実行ファイルに保護をして みました

読み取り不可能になっています
中間言語のIL自体を削除することが機能としてあるので読み取りが出来なくなるのです

他の製品はアプリが起動しなくなる問題があったり使い物になりませんでしたが .Net Reactorは問題なし 。
体験版のままだとアプリ起動時に警告メッセージが表示されるので 無償利用はできない です。

販売する自社製品は大事 に扱いましょう

ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～のお部屋へようこそ。
このお部屋では 第11章 の「 高度なユーザーインターフェース 」についてお話したいと思います。

高度なユーザーインターフェースは、TextBlock、TextBox、ButtonをはじめとするWPFで最初から用意されているコントロールを基本のウィンドウに貼り付けるのは変わりません
ただ、 共通のUIというものは設計のうちで出てくる ことがあります
そんなときに、共通の見た目、挙動をするUIの処理をその都度コピー＆ペーストして作成しますか
作業効率を上げたいのにソースのコピー＆ペーストをしていたら処理の変更を行う時に大変です

そこで、 利用するのがユーザーコントロール と言う機能です
簡単に行ってしまえば共通の見た目、共通の処理を定義したコントロールです
基本のウィンドウとは別のユーザーコントロールにUIを実装していきます。
実装したユーザーコントロールを基本のウィンドウに貼り付ければ共通化完了です

 ユーザコントロールの追加
プロジェクトを作成したら基本のウィンドウ(MainWindow.xaml)はほっといてユーザーコントロールを作成していきます


名前を決めて追加しましょう


1度コンパイルを行えばツールボックスに追加 されます
自動でツールボックスに反映するにはVisual Studioの設定が必要です。
（本お部屋の一番したに設定方法を記載しています）


作成したユーザーコントロールを基本のウィンドウに貼り付けます


 サンプルの説明
サンプルでは 貼りつけたユーザーコントロールが別々の動きをする （それぞれの状態が保持される）ことを分かりやすくするためにタブコントロールを用意して３つのタブにそれぞれ作成したユーザーコントロールを貼りつけました

TextBoxとButtonは以前にもお伝えしたBindingでメッセージボックス出しています。
今回ちょっと新しいのは TreeViewとListBoxにBindingを利用 しているのと 独自定義したクラスでTemplate表示 を行っているところです。
また、 GridSplitterによるコントロールの幅の簡易調整機能 を設けてみました。
Tempalate表示を利用することでより高度な表示が出来る ようになります。
今回のサンプルだとチェックボックスとテキストを並べて表示してます。

サンプルを動かしてもらった方が早いのでどぞっ

 サンプルのダウンロード
　

 自動My UserControl追加設定の手順
コンパイル後にツールボックス内に自作ユーザーコントロールを自動で表示する方法をお伝えします。
Visual Studioの「ツール (T)」から「オプション (O)...」を選びます。

Windowsフォームデザイナーから「ツールボックスを自動取得する」を選んでVisual Studioを再起動します


これであなたも、 高度なUIを1度だけ作成するだけで 色んなアプリに再利用できて コスト激減になること間違いなし ですっ

ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～のお部屋へようこそ。
このお部屋では 番外編 の「 WPFアプリとフォームアプリの違い 」についてお話したいと思います。
WPFの強いところ、素晴らしいところはゲストさんもご存じの通り、 XAMLのマークアップ言語による高度なUIの実現とプログラムとの連動 です。
一昔前、WPFが導入される前からあった.Net Frameworkで動作するGUIのアプリ作成方法。
それが、フォームアプリです。
フォームアプリはWPFと違ってマークアップ言語はありません 。
簡単にまとめれば、 すべてC#言語のプログラムで書いている ことに違いはありません。
Visual StudioにGUIを作成するための補助機能があってプログラムを書いてUIを作成しているようには思えないのですが実際その通りなのです。
フォームもWPFも同じく .Net Frameworkを使用して開発するアプリなのに大きく差 があります。

 WPFで作成したアプリの見た目


ボタンの見た目や背景色など 作成者の思考や趣味が具体的に反映 されるUIです
ゴージャス にもチープ にも見た目を変えられる点はフォームでの実現はかなり難しいです

 サンプルダウンロード  
　


  フォームで作成したアプリの見た目


べ、別にさぼりたくてさぼったわけじゃ・・・ないんだからねっ
どうあがいてもシンプル is the ベストと言う言葉でごまかすしかない見た目ですね

フォームアプリを製作している時のVisual Studioの画面です。

WPFのXAMLに近いファイルがありましてそれがForm1.Designer.cs と言うファイルです。
完全にC#言語のファイルになっています。
このファイルを見ると、1行ずつ書くUIの表示位置だったり詳細設定だったりが記載されています
Visual Studioの補助機能で自動でプログラムが生成されているということになります

 サンプルダウンロード
　

ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～のお部屋へようこそ。
このお部屋では 第10章 の「 外部ライブラリの利用 」についてお話したいと思います。
外部ライブラリの参照方法としては主に2つの方法 があります。
その２つは「 DLLを直接参照してプロジェクト全体で使用できるようにする方法 」と「 DLLから特定の関数のみを参照して利用する方法 」です。
その他、「DLLをプログラム上から実行時に動的に読込する」などもありますがより高度なので今回は割愛します。

 DLLまるごと参照する
直接プログラム内で外部のDLLを指定して関数レベルで参照を行う方法を紹介します
DLLのまるごと参照を行うためには .Net Frameworkで作成されたDLLであることが必須 です。
参照を追加した際に追加出来なければ.Net Frameworkで生成されたものではありません。

プロジェクト内ではないので外部から参照ウィンドウを使ってDLLを追加します
追加後は参照チェックをつけ忘れないようにご注意ください


参照設定が完了したらusingで名前空間を指定するかプログラムに直接書いて使用しましょう

 サンプルダウンロード


このサンプルは以前、「おとは製 WPFミニアプリの紹介」でも紹介したウェブカメラを操作するアプリです
DirectX系の機能の一つDirectShowの.Net Frameworkのライブラリを使っています


 関数レベルで外部DLLを参照する
直接プログラム内で外部のDLLを指定して関数レベルで参照を行う方法を紹介します


DllImportの命令を使用して参照するDLL名を指定すると共に参照したい関数を次の行に記述します
使用できる関数はC言語の関数でも利用できるところがうれしいところですね
この書き方はC#言語と言うより C言語の書き方になりますので安全性が落ちる点はお気をつけて 使ってね

 サンプルダウンロード


今回のサンプルは2年前に作成したアプリです
カテゴリー別に分けて登録してある顔文字を選んでブログなどで貼りつけるためのアプリです
おとは の常用アプリの一つです

データバインディングを利用している点も見て頂きたいところです
高度なインターフェースを利用しているのですが、UIそれぞれの説明は次回をお楽しみに。

 

ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～のお部屋へようこそ。
このお部屋では 第９章 の「 マークアップ言語でコスト削減 」についてお話したいと思います。

今回は WPFの一番の肝になるところ で 高級アプリ製作においてはしっかりと習得 して頂く必要があります
これが出来ないとしょぼいアプリ製作しか出来なくなります
・・・と言うのはやりすぎですが かなりのプログラミング時間を増加 させることになります。

タイトルは プログラムの削減としてプログラム時間を少なくするかのように書いてはいますが、増やさないのが今回の目的 なのです。
WPFではなく フォームアプリでプログラミングしたことがある人はどれだけの差があるか理解して頂ける はずです。


 外部リソースをXAMLで使用する際にしてするための記述です。
 外部リソースをXAMLに埋め込みする際の記述です。
  超重要 　 データバインディングと言うプログラムと連動させるための指定 です。


 プログラムに記述したプロパティの変数名とXAMLで連動する名前を一致させます。
 外部からのアクセスが行えるようにpublic修飾子で外部公開します。
　また、直接書き換えが可能になるようにgetとsetの権限を与えます。
 直接書き換え用のプロパティは自ら初期化が必要なのでコンストラクタで初期値を入れています。
 MainWindowのDataContextに自分自身のインスタンスをしていします。
　これによりそれぞれのUIがMainWindowのインスタンスを知ることが出来ます。
 メンバ変数をメッセージボックスで表示しています。

 サンプルダウンロード


サンプルを実行してみましょう。

リソースで指定した文字がUIで表示されていますね


テキストボックスの内容を書き換えて表示ボタンを押すとメッセージボックスに書き換えた内容が表示されるようになっています
プログラム内で定義した propMainText と言う文字列の プロパティがXAMLとプログラム共通の変数となりどちらからでも読み書きできるようになっている の でほとんどプログラムを書かずにUI処理が出来ます 。
 

ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～のお部屋へようこそ。
このお部屋では 第８章 の「 プログラミング時間の短縮 」についてお話したいと思います。

プログラミングの時間を短縮する方法についてですがいくつか手法がありますので順にお話しします。
今回はマイライブラリとして クラスライブラリを作成する方法 をお伝えします。

これはすぐにプログラミング時間を短縮する効果はありません
１つしかアプリの製作をしない場合には向きませんが、 複数のアプリや製作チームが複数あるなら必ず実践すべき ことです
１度書いたプログラム、そしてデバッグしたプログラムは 動作する保証がある ので 同じ処理を２度と書く必要がなくなる のです
おとは は趣味でも仕事でも ツール的に利用する処理についてはマイライブラリとして外部のライブラリを作成 して利用しますし仕事で社内配布もします

マイライブラリを早速作ってみましょう

ソリューションに新しくプロジェクトを追加します


 クラスライブラリを選択します。
 ライブラリの名前を選択します。
　ここで指定した名前のDLLファイルが出力されるようになります。（例：MyLibrary.dll）

次にWPFアプリケーションのプロジェクトと新しく作成したマイライブラリを連結させます。

WPFプロジェクトの「参照設定」から「参照の追加」を行います。


 ソリューションのプロジェクトを選択します。
 作成したライブラリのチェックボックスにチェックを入れます。

作成したマイライブラリを使ってみましょう。

 デフォルトのファイル名から目的に合わせたファイル名に変更します。
 良く利用する処理やまとめておきたい処理などを書きましょう。
 WPFアプリ側からマイライブラリのクラスを呼び出してみましょう。


 サンプルのダウンロード


今回のサンプル内に含まれているアプリですが、クラスライブラリを作成していますので2つのファイルになっています。
MyLibrary.dllがないとアプリケーションは実行に失敗しますのでご注意ください 。

 

ゲストさん、こんにちは

高級アプリ製作の極意　～WPF編～のお部屋へようこそ。
このお部屋では 第７章 の「 外部データの利用 」についてお話したいと思います。
こちらのお部屋からは 中級者 向けの内容となってきますので難しくなってきますが どんどん進んで頂いてもゆったり追いかけてきて頂いても大丈夫 なのでゲストさんのペースで行きましょう


 外部データ　その１　～テーマ～
WPFのＵＩ (ユーザーインターフェース) はどんなものであっても既定の形や色が設定されています。
それらを既定として利用するのですが、 自分好みの既定仕様に変更することが出来る のが WPFのマークアップ言語の面白いところ、とても素晴らしい ところ の一つです。
外部データの利用の１つとしてテーマというものをアプリで設定したいと思います。

テーマも*.xamlファイルで作成しますが、１から色々なＵＩの仕様を決めるのは大変なので　 こちら 　のサイトからテーマを頂いてきましょう
「 WPF Themes 」に数種類のテーマが貼っていますのでお気に入りのテーマを登録しましょう


 プロジェクトのルート以下に「Themes」のフォルダを作成して任意の*.xamlを登録します
　エクスプローラからドラッグアンドドロップして頂ければ外部のリソースが登録されます。
 テーマをアプリ全体に適用するためにApp.xamlを開きます。
 "Application.Resources"のエレメント内に１行追加して全体のテーマはこれだって指定します。
　追加する文字「 」
  MainWindows.xaml にも１工夫します。
　BackGroundのアトリビュートに { StaticResource WindowBackgroundBrush } を設定します。
 前回まで真っ白だったウィンドウにグラデーションが適用されたでしょ

余談ですが、画像のVisual Studioの画面は垂直タブを作成して2つ同時に見比べてエディットしています
仕事だと 垂直タブを３つにして作業することも多いですので分割表示はかなりおすすめ です


 外部データ　その２　～画像データ～
すんなりと画像データが貼りつけられるのも楽で良いと思うWPFですね
前回のUIの種類について説明した際にもImageのUIに画像を設定しておりましたが、そちらも設定方法を紹介致します


 画像を登録したいフォルダを作成してドラッグアンドドロップで 画像ファイルを登録 します。
 ImageのUIを貼り付けます。
 ImageのUIを選択した状態で プロパティと言う色々な設定を行うことが出来るウィンドウ からSourceを探して登録済みの画像を一覧から選びます。
　画像に はJpegやPNGやICOファイルなどを利用 します。

ここでちょっと脱線しますが、XAMLで記述するアトリビュートにどんなものが使用できるか、どんなものがあるのかって説明していないですよね
実際どうかと言うと、UIを選んだ状態でプロパティウィンドウを見るのが手っ取り早いです
と、言うのも UI毎に設定できるアトリビュートが違うのと種類も数十種類あるので説明しきれません 。
今後良く利用するのは紹介しますので色々いじってみて下さい


 外部データ　その３　～文字列リソース～ 
アプリを製作してもし日本国外でも利用したい人がいるとしたら ゲストさんはどうしますか
プログラムやXAMLに 直接日本語で書いていたら翻訳なんてだれかに頼めない ですよね
翻訳する人がプログラマーならまだしもプログラム経験ない人だったら悲しい現実が待っているわけですよ
そこで便利なのが文字列や画像やテキストなどを管理できるリソースファイルです


 Resources.resxファイルを開いて表示します。（水平グループタブを作ったので上下に分割済み）
 リソースに名前を付けて値を設定します
 リソースを利用するための処理を記述します。
　予め、Imageに MouseLeftButtonUpのアトリビュートを設定してマウスの左クリックが離された時に呼ばれるイベントを設定してあります。

リソースファイルは 言語別に作成することが出来ますので英語だろうがフランス語だろうがドイツ語だろうがどしどしファイルを増やしていけばよい ことになります。
国際言語対応を行いたい方は「 参考サイト 」をご覧ください。

外部リソースを使うことで 初期時点ではさっぱりな見た目だったWPFのUIが見違えるほどにグレードアップ して 高級感あふれる感じ になりました。
外部リソースもWPFでは大事な要素の一つです


今回はちょっと画像データを奮発したのでデータサイズがチョイ大きめだけど・・・
ぜひ ダウンロードしてその目で確かめて くれたまえ～

サンプルのダウンロードはこちらより　->