やる気駆動型エンジニアの備忘録

WPF(XAML+C#)の話題を中心に.NET/Android/CI やたまに趣味に関するブログです

OnRenderで再描画されない現象と対策

ハマったのでメモ

WPFアプリケーションであるコントロールをXamlではなくOnRenderメソッドをオーバーライドして自前で描画処理を実装していました。
ビルド、実行して問題なく動いていましたが、あることをするとOnRenderメソッドが呼ばれないことが発覚しました。

コントロールには次のような振る舞いを実装していました。

  • あるプロパティを変更することでコントロールの背景色を切り替える。
  • ControlTemplateは定義していない。OnRenderで描画処理を実装する。

そしてそのコントロールを画面に配置し、ボタンをクリックすると画面上のすべてのコントロールの状態を変更し、背景色を色替えするというものでした。
画面にはコントロールを数百個(以下の画面では300個)描画しています。
以下はその画面です。
f:id:iyemon018:20160418212103p:plain

画面右上のTestボタンをクリックすると全コントロールの状態を切り替えます。
以下はTestボタンをクリックした時の画面です。
f:id:iyemon018:20160418212146p:plain

なぜか一部のコントロールが色替えされていません。

続きを読む

TimeSpan型のStringFormatの設定

WPF でTimeSpan 型のプロパティをバインドした際のStringFormat を忘れてハマったのでメモ。
DateTime 型と表記が異なる上にバインドの設定ウィンドウに出てこないので割と忘れます。

<TextBlock Text="{Binding TimeSpan, StringFormat={}{0:hh\\:mm\\:ss\\.fff}, ConverterCulture=ja-jP}" />

コロンなどの記号の前に'\'を2個入れましょう。

ついでなのでDateTime 型のフォーマットと並べてみてみます。

<Window x:Class="MvvmExample.View.Window6"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:ViewModel="clr-namespace:MvvmExample.ViewModel"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        Title="Window6"
        Width="400"
        Height="350"
        mc:Ignorable="d">
    <Window.DataContext>
        <ViewModel:ViewModelWindow6 />
    </Window.DataContext>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <GroupBox Header="DateTime">
            <StackPanel Orientation="Vertical">
                <StackPanel Margin="0,3" Orientation="Vertical">
                    <TextBlock Margin="0,0,6,0" Text="年月日曜日時分秒ミリ秒" />
                    <TextBlock Text="{Binding DateTime, StringFormat={}{0:yyyy/MM/dd(ddd) hh:mm:ss.fff}, ConverterCulture=ja-jP}" />
                </StackPanel>
                <StackPanel Margin="0,3" Orientation="Vertical">
                    <TextBlock Margin="0,0,6,0" Text="月日" />
                    <TextBlock Text="{Binding DateTime, StringFormat={}{0:MM/dd}, ConverterCulture=ja-jP}" />
                </StackPanel>
                <StackPanel Margin="0,3" Orientation="Vertical">
                    <TextBlock Margin="0,0,6,0" Text="時分" />
                    <TextBlock Text="{Binding DateTime, StringFormat={}{0:hh:mm}, ConverterCulture=ja-jP}" />
                </StackPanel>
            </StackPanel>
        </GroupBox>

        <GroupBox Grid.Row="1" Header="TimeSpan">
            <StackPanel Orientation="Vertical">
                <StackPanel Margin="0,3" Orientation="Vertical">
                    <TextBlock Margin="0,0,6,0" Text="時分秒ミリ秒" />
                    <TextBlock Text="{Binding TimeSpan, StringFormat={}{0:hh\\:mm\\:ss\\.fff}, ConverterCulture=ja-jP}" />
                </StackPanel>
                <StackPanel Margin="0,3" Orientation="Vertical">
                    <TextBlock Margin="0,0,6,0" Text="時分" />
                    <TextBlock Text="{Binding TimeSpan, StringFormat={}{0:hh\\:mm}, ConverterCulture=ja-jP}" />
                </StackPanel>
            </StackPanel>
        </GroupBox>
    </Grid>
</Window>

書いておいてなんですが、値の表現はコンバーターを使ったほうが共通化できていいと思っています。

Visual Studio で便利な拡張機能 その4

Visual Studio であると便利(これがないと生きていけない)拡張機能を紹介します。
ここで紹介する拡張機能は、基本的にVisual Studio 2013/2015 Community 上で使用可能であることを確認しています。

Xaml Style

ダウンロードページ
visualstudiogallery.msdn.microsoft.com

この拡張機能Xaml を一定のルールでフォーマットするためのものです。
Visual StudioXaml エディターは、何もしなければ横方向に延々とプロパティ定義が追加されていきます。
それじゃあ見づらいよね、というときにこの拡張機能の出番です。
使い方は簡単
Xaml エディターで編集した後に[Ctrl + S] で保存すれば、自動的にフォーマットしてくれます。

  • Before

f:id:iyemon018:20160409144729p:plain

  • After

f:id:iyemon018:20160409144735p:plain


フォーマットルールはメニューバー[ツール]-[オプション]-[Xaml Styler] から設定できます。
個人的には、"Keep Binding statements on same line" はTrue に設定しておきたい。
これをTrue にしておくと、バインドオプションのみ1行でフォーマットされます。


XAML Regions

ダウンロードページ
visualstudiogallery.msdn.microsoft.com

この拡張機能Xaml エディターににC# の"region" と同じ機能を使用できるようになります。
region を使用できるという単純な機能では有りますが、結構需要はあるんじゃないでしょうか?
使い方もダウンロードページを参照して見ていただいたほうが早いと思います。

Visual Studio で便利な拡張機能 その3

Visual Studio であると便利(これがないと生きていけない)拡張機能を紹介します。
ここで紹介する拡張機能は、基本的にVisual Studio 2013/2015 Community 上で使用可能であることを確認しています。

Ghost Doc

ダウンロードページ
submain.com

※画面右[Download]ボタンをクリックして、E-MailAddress を入力してください。

Ghost Dock はC#VB.NetXml ドキュメントを自動生成してくれる拡張機能です。
自動生成するコメントは一定のルールに従って生成されます。
生成ルールはオプションから設定することができます。
このルールを上手く使えば、例えばイベントハンドラメソッドのコメントをほとんどほとんど入力する必要なく挿入することができます。
記入したコメントはプレビュー表示することが可能です。
また、プロジェクトのヘルプファイルを作成することも可能です。
こちらも無料版と有料版が有り、有料版ではヘルプファイルにオプション設定が可能になったり、詳細なドキュメント生成ルールを指定することができるようになります。
有料版のドキュメント生成ルールはT4で作成するため、T4に関する知識が必要になります。
そしてGhost Doc のT4エディターはあまり賢くないようで、日本語入力だと入力した文字列が2回表示されます。
また、T4用のAPIも用意されていてGhost Doc のヘルプファイルを見ればメソッド名や引数の情報などが取得できるAPIが確認できます。

(1) コメントの挿入

コメントの挿入は[Ctrl + Shift + D] です。
通常のXml コメントの挿入方法では、Ghost Doc のルールが適応されません。
ショートカットキーはオプションから変更できます。

(2) コメントルールの設定

メニューバー[ツール]-[GhostDoc]-[Options] からオプションウィンドウを表示します。
[GhostDock]-[Rules] から各種ドキュメントの生成ルールを設定することができます。

f:id:iyemon018:20160407202149p:plain

  • ウィンドウ右部の[Add] ボタンをクリックして新規にルールを追加することもできます。

f:id:iyemon018:20160407202203p:plain

  • "<any>" をクリックすると、メソッド名や引数の条件などを設定することができます。

f:id:iyemon018:20160407202220p:plain

  • 各タグの[...]ボタンをクリックすると挿入するコメントを設定することができます。

ここにはマクロを埋め込むことができます。
このマクロを使用してある程度自由にコメントを設定することができます。
f:id:iyemon018:20160407202230p:plain

(3) ドキュメント プレビュー

テキストエディター上で右クリックメニューから[GhostDock]-[Preview Comment] をクリックするとドキュメントのプレビューウィンドウが表示されます。
現在入力しているXml ドキュメントを表示してくれます。
基本はこのプレビューを見ながらドキュメントを調整していくのでしょうね。
ただ、右クリックメニューからわざわざ選択するのは面倒なのでショートカットキーの割当をしたほうがいいでしょう。

(4) ヘルプファイルの作成

メニューバー[ツール]-[GhostDoc]-[Build Help File...] からヘルプファイルの作成ウィンドウを表示することができます。
無料版だと出力先しか変更できませんが、有料版ではその他のオプションも選択できるようになります。

f:id:iyemon018:20161122232628p:plain


この拡張機能をうまく使えば、コメントの品質をある程度一定にしてくれます。
プロジェクトで使用する場合は自前に設定ファイルを共有しておきたいですね。

iyemon018.hatenablog.com

iyemon018.hatenablog.com



この他にも様々な便利機能が搭載されています。
詳細は上記のダウンロードページから参照してください。

Visual Studio で便利な拡張機能 その2

Visual Studio であると便利(これがないと生きていけない)拡張機能を紹介します。
ここで紹介する拡張機能は、基本的にVisual Studio 2013/2015 Community 上で使用可能であることを確認しています。

VSCommands

ダウンロードページ
visualstudiogallery.msdn.microsoft.com


前回のProducty Power Tools と同様に生産性を向上させるための機能を詰め込んだ拡張機能です。
前回の記事
iyemon018.hatenablog.com

この拡張機能は無料版と有料版がありますが、基本的に無料版だけでも問題ありません。
ただし、現時点でVisualStudio2015 向けのバージョンはβ版となっており、2013 向けのバージョンと比べると機能がかなり少ないです。
この記事ではVisualStudio2013 向けのバージョンの機能を紹介しています。

(1) File Structure ウィンドウ

現在表示しているファイル(クラス)のメンバ一覧を表示するウィンドウです。
メニューバー[ツール]-[VSCommand]-[File Structure] を選択するとウィンドウが表示されます。
Resharper にも同様の機能が備わっています。
クラス以外にもXaml の構成も見ることができます。

  • ファイルを開くとこのようになります。

f:id:iyemon018:20160406212936p:plain

  • Xaml デザイナーだとこのようになります。

f:id:iyemon018:20160406213108p:plain

Xaml エディターの場合はGrid.Column と.Row の位置がわかりやすいので結構便利かも。

(2) ファイルの比較

ファイルを複数選択した場合のみ可能。
右クリックメニューの[Compare Files] からファイル同士を比較することができます。

(3) ファイルのグループ化

こちらもファイルを複数選択して右クリックメニューから[Group Items] を選択します。
この機能を実行すると、複数のファイルがグループ化されます。
グループ化と言うのは、WindowsForms の画面のデザイナーファイルとコードビハインドのような関係に紐付けることができるということです。
この機能の使いみちとしては、自作のpartial 化した部分クラス同士をまとめたい時などに使うと便利です。
 

  • まずはグループ化したいファイルを選択して[Group Items] をクリック

f:id:iyemon018:20160406213834p:plain

  • ルートとなるファイルを選択して

f:id:iyemon018:20160406213905p:plain

  • グループ化するとこんな感じになります。

f:id:iyemon018:20160406213930p:plain

(4) Code Block End Tagger

この機能は、テキストエディター外に表示されているブロック('{')の条件式やメソッド名などを表示してくれる機能です。
また、表示されているアイコン、およびブロックの先頭のテキストをクリックすると、そのブロック位置にジャンプする機能も搭載されています。
1つのメソッドや条件式の内部が長くなって見づらい場合に有効です。

  • 通常はこのようになっていますが

f:id:iyemon018:20160406214214p:plain 

  • ブロックの開始位置が見えなくなるとアイコンとテキストでブロック先頭を表記してくれます。

f:id:iyemon018:20160406214326p:plain


この他にも様々な便利機能が搭載されています。
詳細は上記のダウンロードページから参照してください。