Boost」など、さまざまなカンファレンスを企画・運営しています。BOOKS(コードジン・ブックス)は、CodeZineの連載からカットアップした、開発現場の課題解決に役立つ書籍シリーズです。TODOコメントから始めましょう。」と書いてあるコメント行のことです。Studioのメニュー[表示]-[タスク一覧]で、次の画像のようにTODOコメントが表示されます。WTS:」で始まっています。そこには、やるべき作業や、利用するときの注意事項などが書かれています。複数行に渡って書かれている場合、タスク一覧には2行目以降が表示されていませんので、タスク一覧でダブルクリックしてソースコードの該当箇所を表示させます。このTODOコメントを見ていくと、カスタマイズするべきところが分かってきます。ここでは簡単なところから、WebViewページの初期表示URLと、ハンバーガーメニューのアイコンを変更してみましょう。WebViewページの初期表示URL修正箇所を探すページを追加するときに指定した名前に「Page」を付けたものが、そのページのソースファイルの名前になっています。WebViewページのソースコードはWebViewPage.xaml、そのコードビハインドはWebViewPage.xaml.csです。default」というTODOコメントが見つかります。ここを修正すれば、初期表示URLを変更できそうです。タスク一覧でそのTODOコメントをダブルクリックすると、ソースコードの該当箇所が開きます(次の画像)。ここではWebViewPage.xaml.csの12行目です。その次の行にDefaultUrl文字列定数の定義があります。この定数を書き換えればよさそうですね。初期表示URLの設定箇所をタスク一覧から開いたコードを追いかけてみる書き換える前に、コードを少し追いかけてみましょう。文字列定数DefaultUrlは、132行目から始まるコンストラクタの中でSourceプロパティにセットされています(上の画像)。このSourceプロパティは、WebViewPage.xamlでWebViewコントロールのSourceプロパティにバインドされています(次の画像)。文字列定数DefaultUrlに設定したURLが、WebViewページを表示したときに表示されます。SourceプロパティのセッターはSetメソッドを呼び出しています(次の画像)。Setメソッドでは、PropertyChangedEventHandlerイベントを発火させています(このイベントはINotifyPropertyChangedインターフェイスの実装です)。このイベントが発火すると、バインド先に「データが変わったよ!」という通知が飛びます。バインドのモードはOneWayになっていますから(上の画像)、バインド元の変化(=Sourceプロパティの変更)は自動的にバインド先に反映されます。ちなみに、バインドのモードがOneTime(x:Bindの既定値)のときは、自動的には反映されません。コードビハインドのSourceプロパティを変更するとイベントが発火する画面にTextBoxコントロールなどを追加して、ユーザーが入力したURLをコードビハインドのSourceプロパティにセットするように改造すれば、好きなWebページを表示させられるようになる、というわけです。Studioが生成したコードは、このように拡張性が考慮されています。そのため、最初は取っ付きにくいかもしれませんが、分かってしまえば簡単に拡張できるようになります。コードを修正するさて、ここでは、初期表示URLを違うものに変えるだけにしましょう。WebViewPage.xaml.csの該当箇所を次のコードのように書き換えます。"https://codezine.jp/article/corner/731";サンプルコードで筆者が修正した部分のコメントには、このように「bw:」と冒頭に付けてあります。これで実行してみると、ちゃんと初期表示URLが変わっています(次の画像)。初期表示URLが変わったハンバーガーメニューのアイコンハンバーガーメニューを表示している大枠のページは、ShellPage.xamlです(常にこの名前)。ShellPage.xaml.」というTODOコメントが見つかります。アイコンを変えるにはShellPage.xamlを変更しろ、というのですね。そこで、ShellPage.xamlを調べてみると、次の画像のようなTODOコメントが見つかります(XAMLファイル内のTODOコメントは、タスク一覧に表示されないのです)。items」を読むと、Iconプロパティに適当なSymbol列挙値かFontIconオブジェクトを設定すればよいようです。items」には、FontIconオブジェクトを設定する例も書いてあります。iconsのページへのリンクも載っています。このページには1200個以上のアイコンが掲載されています。Assets」を使うと、このページに載っているアイコンを名前で絞り込めて、見つけたアイコンをクリックすればFontIconのXAMLコードを得られるので、便利です。ここでは、ハンバーガーメニューのアイコンを、次のコードのように変更してみました。Iconプロパティに直接文字列を設定しているのがSymbol列挙値、子要素として定義しているものがFontIconオブジェクトです。</winui:NavigationViewItem></winui:NavigationView.MenuItems>これで実行してみると、ハンバーガーメニューのアイコンが次の画像のように変わります。R&Dで自動車の設計をやっていた機械屋さんが、技術の進化スピードに魅かれてプログラマーに。以来30年ほど、より良いコードをどうやったら作れるか、模索の人生。くま同盟の勉強会(名古屋)で、よく喋ってたりする。プラットフォームチームの意義と実践のポイント1DMM.comの施策から見る、事業をむしばむ「技術負債」への処方箋──リファクタリングの「言語化」でインシデントを予防2企業の7割超が「2025年の崖」を理解していないことが明らかに。プラットフォームチームの意義と実践のポイント1DMM.comの施策から見る、事業をむしばむ「技術負債」への処方箋──リファクタリングの「言語化」でインシデントを予防2企業の7割超が「2025年の崖」を理解していないことが明らかに。プラットフォームチームの意義と実践のポイント1DMM.comの施策から見る、事業をむしばむ「技術負債」への処方箋──リファクタリングの「言語化」でインシデントを予防2企業の7割超が「2025年の崖」を理解していないことが明らかに。NEW新着記事一覧を見るイベント今後の予定を見るCodeZineは、株式会社翔泳社が運営するソフトウェア開発者向けのWebメディアです。「デベロッパーの成長と課題解決に貢献するメディア」をコンセプトに、現場で役立つ最新情報を日々お届けします。イラストの無断転載を禁じます。記載されているロゴ、システム名、製品名は各社及び商標権者の登録商標あるいは商標です。