WPF演習問題1　デスクトップ上のちり紙

「　👆　メニューや、ボタンの名前の後ろに丸かっこに入ってアンダースコア（下線）が引かれている英字大文字は
古い言い方で　ニーモニック（mnemonic）、一般的には アクセラレーターキー（Accelerator keys） と呼ぶもので、
[Alt] キーを押しながらそのアルファベットのキーをちょんと押すとクリックしたのと同じ動きをするぜ」

「 Web系では　無くなった文化よね」

「　👆　[Alt] というのは　オルタネートキー（Alternate key）とかオルトと呼んでるもので、
このキーを押したからといって何かが起こるわけではないが、別のキーと組み合わせて使うぜ」

「　👆　[Alt] + [N] キーと言う場合、オルトキーと N キーを　一緒に押すのではなく……」

「　👆　[Alt] キーを押しっぱなしにしながら、 [N] キーを　ちょん　と押し下げて　すぐ　離せだぜ」

「　こだわりだな」

「　大阪日本橋の近くに住んでたから　こういうことを一通り教えてくれるコンピューターオタクの先輩が近所にいたけど、
それは　特異　なことで、世の中　そんな人は　近所にはいないのよ。
世間の人はネットの切れ端みたいな記事みてプログラムを断片的に覚えるのよ。
その構造にうらみの根を持って　こういう一気通貫の　長い　記事かいてんのよ」

「　逆恨み　わらう」

「　👆　C#、 すべてのプラットフォーム、 デスクトップ、 WPF Application をクリックして　[次へ(N)] をクリックしろだぜ。
ここで、 .NET Framework と付いてあるのは　レガシー（時代遅れ）なんで選ぶなだぜ。付いてないのを選べだぜ」

「　ややこし！」

「　👆　次の画面にも　アクセラレーターキー　いっぱいついてるな」

「　👆　３点リーダーは　ダイアログボックスが　ポップアップしてくる印だぜ」

Step 2-2. フォーカス

「　👆　また、テキストボックスにこれから文字を入力しようというとき、テキストボックスは フォーカス（Focus） を持っていると言うぜ」

Step 2-3. タブオーダー

「　👆　[Tab] キーを打鍵すると、フォーカスは　次のクリックできるところへ飛ぶぜ。これを特に専門用語は無いが、 タブオーダー(Tab Order) とか呼ぶぜ」

「　👆　[Shift] - [Tab] キーを打鍵すると逆回りだぜ」

「　タブオーダーは Web系にもあるわねぇ」

「　👆　[プロジェクト名] は　WpfExerciseDustPaperOnDesktop にでもしろだぜ。
[場所] はデフォルトのままでもいい。わたしは C\GitHub というフォルダーを作ってそこに置いてるけど」

「　👆　わたしも知らんけど今年の11月ぐらいには出てくるらしい　.NET 6.0（プレビュー） にしよかな」

「　👆　開発画面が出てきたぜ。　前の Visual Studio 2019 とパッと見た感じ　変わってない感じ」

「　👆　プロジェクト名を後で変えたくなったときは、　右上の　ソリューションエクスプローラーのツリー構造の２段目を右クリックして
[名前の変更(M)] を選ぶか、または [F2] キーを打鍵すれば変更できるんだが……」

「　👆　[F2] はファンクションキー（Function Key）だな」

「　ファンクションキーも本来は好きに使っていいショートカットのためのキーだったと思うんだが、
Windows になると F1 はヘルプだとか F2 は名前変えるだとか、使い方が固定されてきた」

「　慣習を引き継ぐのは　古い世代に任せて、　いち　から　コンピューターはどうあるべきか　今の文化を　見直そう、という動きがあっても　いいと思ったら
デスクトップPC 丸ごと無視して　みな　スマホ　の方に行ってしまった」

「　現代日本はスマホ先進国かも」

「　👆　自動で変更してくれない　残り　が　どこかにあったりするんで、
詳しくないうちは　プロジェクト名を付け間違えたら　最初からやり直せだぜ」

Step 3. NuGetでLivet インストール

「　👇　WPF を開発するのに　何かフレームワークを入れておかないと　ぜんぜんできないんで、フレームワークは　Livet　を選ぶぜ」

「　👆　[ツール] - [NuGet パッケージマネージャー] - [ソリューション NuGet パッケージの管理]　をクリックしろだぜ」

「　👆　[参照] タブをクリックして検索ボックスに Livet と打鍵し、 LivetCask を選んでプロジェクトの横のチェックボックスをクリックして インストール しろだぜ」

「　インストールが終わったら NuGet のページは閉じろだぜ」

Step 4. 画面見やすいように整えろ

「　👆　今　こんな感じの画面かも知れないな。
このままでは　使いにくいかも知れないから……」

📖　ＷPF開発してるときの、画面の整え方をまとめようぜ（＾～＾）

「　👆　画面を整える方法を　まとめたんで　上の記事を読めだぜ」

Step 5. 定番のフォルダー作れ

「　👆　ソリューションエクスプローラーの２つ目ぐらいにある　プロジェクトを右クリック、
[追加] - [新しいフォルダー] をクリックしろだぜ」

「　👆　名前を入れろだぜ。
ここでは ViewModels と Views という名前の２つのフォルダーを作れだぜ」

「　👆　名前を入れ間違えたら、 [F2] キーを打鍵すれば　リネームできるぜ」

Step 6. 実行しろ

「　まだ何もプログラム書いてないが、最初からウィンドウを表示するぐらいのことはできる。やってみようぜ」

「　👆　標準ツールバーの　右向いてる緑色の三角形みたいなボタンをクリックしてみろだぜ」

「　👆　Visual Studio のウィンドウのレイアウトが　がらりと変わって、　なんか　白いウィンドウが出てきただろ。
じゃ、その　出てきた白いウィンドウを　閉じろだぜ」

「　👆　ソリューションエクスプローラーのプロジェクト名を右クリックして エクスプローラーでフォルダーを開く をクリック」

「　👆　Windows ファイルエクスプローラー が出てくるので、 bin フォルダーの中を開けていけだぜ」

「　👆　.exe ファイルができてるから、ダブルクリックしろだぜ」

「　👆　じゃあ　さっきの　白いウィンドウが出てきたな。　これが実行ファイルの作り方の基本だぜ」

Step 6. タイトルバー消せ

「　👆　ソリューションエクスプローラー上で MainWindow.xaml をダブルクリックしろだぜ。
デザイナーが出てくるな」

「　👆　XAML の方の という要素名を狙って　マウスカーソルでクリックしろだぜ。プロパティが出てくるな」







「　👆　プロパティ ペーンの [雷マーク] - [カテゴリ] - [外観] - [WindowStyleのドロップダウンリストの三角ボタン] - [None] を選べだぜ」





「　👆　すると　XAML の方に　WindowStyle="None"　が付いたな」





「　👆　こんな感じに覚えておけだぜ。

プロパティ ペーンで設定したものは　XAML のタグのアトリビュートに付く、ぐらいの規則性に気づけだぜ。

アトリビュートに　どんな風に付くかは、なんかシンプルに付くと思っておけだぜ、今のところは」



「　慣れてきたら XAML のテキストを直接　編集しろってことなのかしら」



「　XAMLはテキストなんで、コピー 貼り付け も利くしな。規則性の分かってきたプログラマーは XAML 直接編集だよな」

Step 7. XMLの 単独タグ



「　このステップの話しは　むずかしいんで、 読み飛ばして 構わないぜ。必要になったら読めばいい」



「　XML（エックス・エム・エル）の読み方を簡単に説明するぜ」





「　< と > で挟まれたものを タグ と呼んでいるのは分かると思うが、うしろの括弧に / （スラッシュ）が付いている /> を持つものは、

なんか 単独なんだな、と思っておけだぜ」

Step 7-1. 開きタグ、閉じタグ





「　👆　要素 （Element；エレメント） は 開きタグ と 閉じタグ で作れるやつもあるぜ。

どう使い分けるのかというと……」

Step 7-2. 子要素、親要素





「　👆　閉じタグ、開きタグに分かれている方は、間に 子要素 などを挟めるわけだぜ。

何も挟まない要素は　単独タグ　が使いやすいぜ」

Step 7-3. アトリビュート





「　👆　また　単独タグ、または　開きタグは、 属性名＝"属性値" という形で 名前と値（Value；あたい）のペアを持てるぜ。

これを　アトリビュート（属性；ぞくせい）と呼ぶぜ」





「　👆　アトリビュートは　複数個　付けれるぜ」

Step 7-4. テキスト ノード





「　👆　開きタグ と 閉じタグの間に　テキスト　をそのまま書いてもOKだぜ」

Step 8. XAML プロパティ要素構文



「　このステップの話しは　むずかしいんで、 読み飛ばして 構わないぜ。必要になったら読めばいい」

📖　XAML 構文のガイド



「　👆　XAML（ザムル）は、 XML に追加ルールを設けたものだぜ。簡単に説明するぜ」





「　👆　XML では、 アトリビュートの値に 要素を入れる、みたいなことはできず、

<FullName>なんとか と 三角形の括弧を エスケープ して入れるぐらいだったんだが、 XAML では そこは……」





「　👆　こんな書き方で　アトリビュートに要素を入れるのを許容しよう、という　運用　をしてるわけだぜ。

なるほど　確かに XML の表現力が　爆上げ　してるぜ。歓迎だぜ」

Step 8-1. 添付プロパティ





「　👆　上図の Game.Series プロパティは、 Character要素のプロパティではなくて、

親要素の Game のプロパティを使ってる、みたいな　書き方も　XMLに追加ルールで運用される。

これも　今は便利さが分からないと思うが、使いようがあって、 XML の表現力が　爆上げ　してるぜ。歓迎だぜ」

Step 9. ファイル保存しろ





「　👆　ここで！

タブに書いてある　ファイル名の末尾に注目してくれだぜ」



「　えっ？　どこ！」





「　👆　ここ！」



「　なんか　人型が付いてるかなあ？」



「　* （アスタリスク）だぜ。

ファイル名のうしろに * が付いているファイルは、まだ保存されていません、という印だぜ」





「　👆　すべて保存 ボタンをクリックして すべてのファイルを保存するか……」



「　[Ctrl] キーと [Shift] キーを押しっぱなしにしながら [S] キーを　ちょんと　軽く打鍵しろだぜ」



「　これを [Ctrl] + [Shift] + [S] とコマンド表記することがあるぜ。

３つのキーを　同時押し　しようとすると　プログラムに　s　の字を書きこんで　できねーっ　てなるんで、

[Ctrl]、[Shift]、 [Alt] キーは　他のキーと一緒に押さなければ　（基本的に）　何も起こらないようになってるんだぜ」



「　Shiftキーを５連打してみなさいよ。　びっくりして　椅子から転げ落ちるから」





「　👆　ファイルを１つ保存するボタンをクリックして アクティブなファイルを……、アクティブなファイルって何かって説明するのが難しいよな。

今 キーボードの a を押したら a の字が打ち込まれるようなテキスト・ファイルとかのことだぜ。

アクティブなファイルだけ　保存されるぜ」



「　代わりに　[Ctrl] + [S] キーでも保存できるぜ」



「　あっ、　2021年にもなって　フロッピー ディスク💾　のアイコンだぜ！」

Step 9-1. 実行して確認





「　デザイナー見ても　見た目は何も変わってないけどな」



「　実行してみろだぜ」





「　👆　何か変わったかだぜ？」



「　タイトルバーが消えたぜ。　あと　もともと見えてないが　ウィンドウの枠が消えたぜ。

昔は　ウィンドウに　太い枠が有ったんだぜ」



「　残っている部分は　クライアント領域　と呼ぶぜ。 変な名前だが、

Windows ME ぐらいの頃から クライアント領域 って呼んでたから ずっと昔から クライアント領域って名前なんだぜ」

Step 9-2. ウィンドウの閉じ方



（👆　閉じるボタンが無くなったときの ウィンドウの閉じ方）



「　👆　閉じるボタン　無くなっちゃったんで、タスク バーのアイコンを右クリックして ウィンドウを閉じる を選んでくれだぜ」

Step 10. クライアント領域、透明



「　クライアント領域が　透明になってほしいのよ」





「　👆　プロパティ ペーンで AllowsTransparency にチェックを入れろだぜ」





「　👆　ブラシ カテゴリの Background に #00000000 を入れろだぜ。 #00xxxxxx で

不透明度（Opacity）あるいはアルファ値が 00、つまり 透明という意味だぜ」





「　👆　ほら　クライアント領域が透明になったぜ。

なんか　1 pixel ぐらいの黒い枠線が残ってんな……」



「　実行してみると　黒い線も見えないぜ。　透明で、どこにあるかも見えないウィンドウだぜ」





「　👆　ウィンドウのリサイズ用の境界線かも知らん。 ResizeMode="NoResize" を付けてくれだぜ」



「　デバッグ実行時に　1 pixel の黒い枠線は見えるぜ。何も変わらないぜ」



「　じゃあ ResizeMode 関係ないのか」

Step 11. 丸とか四角、置け



「　グリッド デザインは　初心者には早かったのでは……、まあいいか　やったろ」



📖　WPFのGridとかStackPanelとかWrapPanelって何なんだぜ（＾～＾）？



「　👆　グリッドって何か、の説明は　上の記事を読んできてくれだぜ」



MainWindow.xaml:



    
    
        
        
            
            
        
        
            
            
        

        
        

        
        

        
        

    






「　👆　XAML をコピー貼り付けするだけで　丸とか　四角とか置けるから　試してくれだぜ」



「　マウスカーソルで テキストを選んで　[Ctrl] + [C]、

貼り付けたいところに [Ctrl] + [V]　で貼り付け」

Step 12. テキスト、置け



「　Web系プログラマーでなければ　知らないから関係ないもしれないが、

HTML だと　タグの中にタグを入れて、またその中にタグを入れて……　と

入れ子が激しいんだが、WPFの グリッド レイアウトだと　入れ子は 少し緩和されるぜ」



        
        
            ここに
            紙を貼るな！
        
            へ　へ
            の　の
            も
            へ
        
            
            6 + 7 = 13
                13 + 3 = 16
        




「　👆　XAML をコピー貼り付けするだけで　テキストを置けるから　試してくれだぜ」

Step 13. ボタン、置け



「　タイトルバーがなくなったんで

ウィンドウをつかむところがなくなって　ウィンドウを移動できなくなったし、

ウィンドウの枠がなくなったんで　ウィンドウの端っこをつかんで　リサイズできなくなったし、

最小化、最大化、閉じるボタンも無くなったんで、

これら　自力実装しなくちゃ　いけないな」



「　黙って Windows のルックスをそのまま使って　生産性の向上　に注力したらいいのに」



「　最初の　この演習は、

ウィンドウに最初から付いているものを　消して、　自力で再実装することだぜ」



「　苦行わらう」





「　👆　まず、押しても何も起こらないボタン　を置こうぜ？」



        
        
            
            
                
                
            

            
            
            
                

                
                

                
                



「　👆　XAML をコピー貼り付けするだけで　ボタンを置けるから　試してくれだぜ」





「　👆　まだ　張りぼて　だな」

Step 14. ボタンに機能付けろ



「　最大化したときの見え方とか、テストしたいだろ。

ボタンに機能が入ってないと不便だよな。付けようぜ？」





「　👆　デザイナーで 最小ボタンをクリック、 プロパティ ペーンで 雷マーク をクリックして Click の右横のテキストボックスを

ダブルクリックしろだぜ。　最小ボタンをダブルクリックしても同じだけど」





「　👆　コードの画面に飛ぶぜ。 Button_Click とか書かれたコードができているが、これが スケルトン だぜ。

スケルトンというのは、　ここにコードを書け　っていう　中身が空っぽなものだぜ」

Step 14-1. 保存しろ



「　思い出せだぜ」





「　👆　ファイル名のうしろに　* （アスタリスク）が付いているのは、まだ　保存されていないという印だぜ」





「　👆　すべて保存 ボタンをクリックするか、 [Ctrl] + [Shift] + [S] キーをクリックしろだぜ。

保存されてないファイル全部保存されるぜ。

ファイルを１つずつ保存したいときは [Ctrl] + [S] だぜ。まあ試せ」



「　特に　2000年 '00年代のデジタルなイラストレーターは　保存　ボタン押し忘れて　１日の作業が消えるし、

特に　'00年代のデジタルなイラストレーターは　ハードディスクのバックアップを取ってないから　生涯の全作品が消えるのよ」



「　2020年代になると　いい感じの企業の会社員は　どこかにある　データセンターのサーバーに　ログインしてから作業するんで

データは　サーバー側のディスクに取ってるよな。　会社がバックアップを取ってくれてるぜ。

目の前にある　貸与のローカルPCにデータ置いてないよな」

Step 15. メソッド名 変更



「　メソッドって何なのか、という説明は置いておいて」





「　👆　Button_Click のところで右クリックして、 名前の変更 を選んでくれだぜ」





「　👆　MinimizedButton_Click に変えて [Enter] キーを打鍵（だけん；タップ）してくれだぜ」





「　👆　すると　名前が変わるのは もちろん だが」





「　👆　参照箇所も併せて変わってくれるので　修正の手間要らずだぜ」





「　👆　以下同様で、 MinimizedButton_Click、 NormalButton_Click、 MaximizedButton_Click、 CloseButton_Click の

４つのスケルトンを用意してくれだぜ」



        private void MinimizedButton_Click(object sender, RoutedEventArgs e)
        {
            // ウィンドウを最小化します
            this.WindowState = WindowState.Minimized;
        }

        private void NormalButton_Click(object sender, RoutedEventArgs e)
        {
            // 最大化しているウィンドウを元に戻します
            this.WindowState = WindowState.Normal;
        }

        private void MaximizedButton_Click(object sender, RoutedEventArgs e)
        {
            // ウィンドウを最大化します
            this.WindowState = WindowState.Maximized;
        }

        private void CloseButton_Click(object sender, RoutedEventArgs e)
        {
            // このウィンドウを閉じます
            this.Close();
        }




「　👆　それぞれの機能は　１行呼び出せば済むぜ」

Step 15-1. 最大化を試せ





「　👆　実行してみろだぜ」





「　ちり紙の [最大] ボタンをクリックしてみろだぜ」





「　👆　広がったぜ」

Step 16. 可視／不可視、活性／非活性





「　👆　すでに　最大化　してるんだったら　[最大化]　ボタンなんか見えない方がいいし……」





「　👆　すでに　元のサイズに戻っているのなら、元のサイズに戻すボタンなんか見えない方がいいぜ」



「　プログラマーが意識したいのは

機能があるものは、その機能を持っているように見えること、

機能をもっていないものは、その機能をもっていないように見えること、

機能を持っているように見えるものは、その機能を持っていること、

機能を持っていないように見えるものは、その機能を持っていないこと だぜ」



「　逆も真か」



「　対偶だから　最後の２行は要らなくない？」



「　通常のサイズのとき　元のサイズに戻すボタンを　見えなくして、

最大化のサイズのときは　最大化ボタンを　見えなくしてくれだぜ」

Step 17. テンプレート(良くない例)



「　じゃあ　まず　良くない書き方の例から説明するぜ。

そのあとで　良い書き方の例を説明する」



                
                




「　👆　今、ボタンは　シンプルに書けてるんだが、これを　複雑に書いていってみるぜ。お見せしよう」



                
                




「　👆　Button が Template というプロパティを持っているんで、そこに ControlTemplate をセットするには、

上記みたいな書き方をするのが一番簡単なんだが、この書き方は XAML が読みにくくなるんだぜ。続けるぜ」



                
                




「　👆　ニュートラルな状態での 元のサイズに戻す ボタンと、

ウィンドウのサイズが ニュートラル なときの 元のサイズに戻す ボタンの場所を無くす設定だぜ」



「　すっきりしてた XAML が、とたんに　ごちゃごちゃ　し出したわねぇ」





「　確かに 普通のサイズに戻す ボタンは　場所が無くなってるぜ」

Step 18. テンプレート(良い例)



「　そこで　リソース ディクショナリー を使うやり方を、初心者こそ　早く覚えようぜ」



MainWindow.xaml:

    
    

    




「　👆　Ｗindow要素の冒頭らへんに  子要素を置こうぜ」





「　👆　そして さっきの  要素を カット＆ペースト」





「　👆　上図の位置で k を入力して 候補から Key (x) を選択」





「　👆　" （ダブルクォーテーション ）の閉じるとこまで　自動で補完してくれるから、その中を書けばいいんだが、

ここに何を書くかというと　まあ　先頭が小文字英字　の例が多いぐらいで　任意（にんい）の名前だぜ」



「　にんい　って何だぜ？」



「　勝手にしろ、ぐらいの意味だぜ」



    
    
        

            
            
                
                
            

            
                
                
                    
                
            

        
    




「　👆　キーの値は normalButton とかにしとこうぜ」





「　👆　切り取った方を　どうするかというと」



Template="{StaticResource }"




「　👆　上記みたいな感じで　キータイピングしていると　入力候補が出てくるんで、 onrmalButton を選べだぜ。

入力候補出ないな？　と思ったら [Ctrl] + [Space] キーを打鍵（だけん；タップ）しろだぜ」



                
                



「　👆　これで　さっきと同じ働きもするし、　XAMLも読みやすい　良い書き方だぜ」



「　コーディングの初心者のときに　コーディング スキルの高い技を持っていたいよな」



「　低いコーディング スキルと、ものすごい熱意で　重量級のコード書くのも　誰もが通るところだから　それはそれで構わないのよ。

それを引き継ぐことになって　メンテナンスするのも　構わないのよ。

飛伝のタレで　メンテナンスしてはいけなくなって　継承を続けることが伝統になるのが　嫌なだけで」

Step 18-1. 最大化ボタンも同様

        

            
            
                
                
            

            
                
                
                    
                
            

        


                
                

Step 19. テンプレートバインディング



「　しかし　お父ん」





「　👆　Button タグには　Widh="80" とか Content="元サイズ戻す" といったアトリビュートが残っているな？」



「　残っているぜ」





「　👆　ControlTemplate タグの方にも、　Widh="80" とか Content="元サイズ戻す" とか、おんなじ値のアトリビュートがあるな？」



「　あるぜ」





「　👆　Button の Width="80" と、 ControlTemplate の Widh="80" だったら、どっちを使ってるんだぜ？」



「　Button の方は無視して ControlTemplate の方を使ってるぜ」



「　ControlTemplate が ぶら下がったら、元のタグの方のレイアウトは　すっかり忘れてしまって

ごっそり ControlTemplateの方が使われると思えだぜ」



「　じゃあ Button の方の Width="80" とかは使ってないんだったら　消したらいいんじゃないか？」



「　どっちかと言うと…… ControlTemplate の方の Width="80" を消したいんだぜ。

Button に Width="80" と指定したら、 ControlTemplate の方の Width も 80 になってほしい」





「　👆　ControlTemplate って名前をしているが、こういうの　テンプレート （Template） という概念なんだぜ。

テンプレートって何かというと　穴あき定規 なんだが」



「　穴定規がどうしたっていうの」



「　おんなじ物　何回も使う、っていうことだぜ。

そのとき　一部分だけ　ちょっと変えて使いたい　なんてことも　よくあるわけだぜ」





「　👆　Width=" の始まりのダブルクォーテーションのすぐ右から {B と打鍵し始めろだぜ。

インテリセンス（IntelliSense）が出てくる……、この入力候補が出てくるやつのこと　インテリセンスとか呼んでるやついるのかだぜ？」



「　候補だよな。あるいは　サジェスチョン」



「　Visual Studio は インテリセンス が出てくるのが自慢なんで、 Visual Studio を使うんだったら積極的にインテリセンスを使えだぜ。

なんなら [Ctrl] + [Space] で　こっちから　インテリセンスを呼び出せるぜ」



「　わらう」



「　Bind とか打鍵すれば　そこで書ける バインドの種類が一覧されるんで、 TemplateBinding を選べだぜ。

テンプレートで使うバインディングだから TemplateBinding なんだろ、簡単だろ」



「　何なんだぜ　それ」





「　そして 半角スペース１個空ければ　また　インテリセンスが出てくるぜ。

これは　テンプレートのタグに　TargetType="Button"　って書いてるから　Button　と知ってて出てくるんだけど」





「　さらに W って打てだぜ。 Width （ウィトゥス；横幅）が出てくるぜ。

これ、 Button の Width だぜ」



                




「　👆　これで　ControlTemplate から Width="80" が消えて、 Button の方の Width="80" になったんだぜ。

これが　バインディング」



「　他のところも　バインディング　してしまおうぜ？」



    
    

        
        

            
            
                
                
            

            
                
                
                    
                
            

        

        
        

            
            
                
                
            

            
                
                
                    
                
            

        

    




「　👆　バインドしまくって　こうかな」



「　Button は BorderThickness 持ってるかと思ったんだが インテリセンスに出てこなかった。さっぱり分かんね」

Step 20. DataTrigger外に出す



「　ここは　むずかしいので、　読み飛ばしてもいいぜ」



「　あれっ、お父ん」



「　[元のサイズに戻す] ボタンと、 [最大化] ボタンの違いって、何だぜ？」





「　👆　[元のサイズに戻す] ボタンは ウィンドウサイズが normal のときは 場所から消えていて、

[最大化] ボタンは ウィンドウサイズが maximized のときに 場所から消えてることだぜ」



「　そうか、違いがあるのかだぜ」

📖　Wpf button data trigger



「　👆　しかし　違うところが　少しだけだったら　そこだけ外にだしたいよな。

、 
                    
                

                
                




「　👆　Button 要素に Button.Style 要素をぶら下げられるので」

                                
                                
                                    
                                


                                
                                
                                    
                                




「　👆　DataTrigger を [Ctrl] + [X] キーで切り取って……」





「　👆　貼り付ければ……」





「　👆　キー名だけが違う 同じものなんで……」





「　👆　normalButton だけ残して maximizedButton の方をバッサリ消して……」





「　👆　Buttonタグの方の maximizedButton と書いているところを normalButton に書き直せば OK だぜ」



「　なんか　XAML の グリッド レイアウトを書くところが ぐちゃっと　しちゃったわねぇ」

Step 21. 折りたたみボタン



「　その　ぐちゃっと　している 

        
        




「　👆

「ぴょむー（＾～＾）」の記事 - Crieit

WPF演習問題1　デスクトップ上のちり紙

気の早い人向け

今回の話し

Step 1. Visual Studio 2022 導入

Step 2. 新規プロジェクト作成

Step 2-1. アクセラレーターキー

Step 2-2. フォーカス

Step 2-3. タブオーダー

Step 3. NuGetでLivet インストール

Step 4. 画面見やすいように整えろ

Step 5. 定番のフォルダー作れ

Step 6. 実行しろ

Step 6. タイトルバー消せ

Step 7. XMLの単独タグ

Step 7-1. 開きタグ、閉じタグ

Step 7-2. 子要素、親要素

Step 7-3. アトリビュート

Step 7-4. テキストノード

Step 8. XAML プロパティ要素構文

Step 8-1. 添付プロパティ

Step 9. ファイル保存しろ

Step 9-1. 実行して確認

Step 9-2. ウィンドウの閉じ方

Step 10. クライアント領域、透明

Step 11. 丸とか四角、置け

Step 12. テキスト、置け

Step 13. ボタン、置け

Step 14. ボタンに機能付けろ

Step 14-1. 保存しろ

Step 15. メソッド名変更

Step 15-1. 最大化を試せ

Step 16. 可視／不可視、活性／非活性

Step 17. テンプレート(良くない例)

Step 18. テンプレート(良い例)

Step 18-1. 最大化ボタンも同様

Step 19. テンプレートバインディング

Step 20. DataTrigger外に出す

Step 21. 折りたたみボタン

「ぴょむー（＾～＾）」の記事 - Crieit

WPF演習問題1 デスクトップ上のちり紙

WPF演習問題1　デスクトップ上のちり紙