00:56:05)追加された行はこの色です。削除された行はこの色です。Frameworkの機能を紹介します。[#o805cdea][[前回>../101]]は、StringAnnotationsクラスを使ってルビの振られた文字列を作成する方法を紹介しました。その「[[HTML上のルビを振る>../101#content_1_7]]」でちょっと紹介した、SimpleRubyコントロールについて説明します。Webアプリケーションでルビの振られた文字を表示することが出来ます。具体的に言うと、SimpleRubyコントロールは、ルビ表示制御文字を用いた[[ユニコード上のルビ>http://ja.wikipedia.org/wiki/%E3%83%AB%E3%83%93#.E3.83.A6.E3.83.8B.E3.82.B3.E3.83.BC.E3.83.89.E4.B8.8A.E3.81.AE.E3.83.AB.E3.83.93]]を、Ruby要素を用いた[[HTML上のルビ>http://ja.wikipedia.org/wiki/%E3%83%AB%E3%83%93#HTML.E4.B8.8A.E3.81.AE.E3.83.AB.E3.83.93]]に変換します。SimpleRubyコントロールを使うには、YomiganaFramework.dllとSimpleRuby.dllを参照設定に追加する必要があります。SimpleRubyコントロールがツールボックスに表示されていないならば、以下の方法で表示させることができます。+ツールボックスの「全般」タブを右クリックしてメニューを出し、「アイテムの選択」を選択します。(「全般」タブ以外のタブに登録したいときは、そのタブで右クリックします。コンポーネント」タブで「参照」ボタンをクリックし、「YomiganaFramework.dll」を選択します。コンポーネント」のリストに「YomiganaTextBox」が追加されており、その左側のチェックボックスにチェックが入っていることを確認して、OKボタンをクリックします。Studioのデザイン画面でSimpleRubyコントロールをWebページに配置し、名前を「SimpleRuby1」にしたとします。このSimpleRuby1に「笑(わら)う門(かど)には福(ふく)来(きた)る」というルビが振られた文字列を表示させてみましょう。+デザイン画面でSimpleRuby1を選択し、「プロパティウィンドウ」のTextプロパティに「笑う門には福来る」と入力します。alt="simpleruby1"></a>)+Textプロパティの右側にある「...」ボタンをクリックします。すると、「読み仮名エディタ」が表示されます。alt="simpleruby2"></a>)+ルビを振る区切りを決めます。デフォルトでは「福」と「来」が繋がってしまっていますので、「福」と「来」の間をクリックして区切りを入れます。区切りを削除するには、区切り線をドラッグして、枠の外にドロップします。alt="simpleruby3"></a>)+ルビを振ります。右上にある「オートフィル」ボタンをクリックすると、漢字の上に読み仮名が自動的に入力されます。alt="simpleruby4"></a>)+オートフィルでは「ふく」以外の読み仮名がすべて間違えていますので、正しい読み仮名を自分で入力します。ルビを振りたい箇所の上をクリックすると、入力できるようになります。ルビはひらがなでなくてもOKです。入力し終えたら、OKボタンをクリックします。alt="simpleruby5"></a>)+これで完成です。SimpleRuby1のTextプロパティが「\uFFF9笑\uFFFAわらう\uFFFBう\uFFF9門\uFFFAかど\uFFFBには\uFFF9福\uFFFAふく\uFFFB\uFFF9来\uFFFAきた\uFFFBる」になります。デザイン画面でSimpleRuby1に「笑(わら)う門(かど)には福(ふく)来(きた)る」と表示されます。alt="simpleruby6"></a>)SimpleRuby1のソースは、以下のようになります。Text="\uFFF9笑\uFFFAわらう\uFFFBう\uFFF9門\uFFFAかど\uFFFBには\uFFF9福\uFFFAふく\uFFFB\uFFF9来\uFFFAきた\uFFFBる"></cc1:SimpleRuby>}}これを実行した時に生成されるHTMLは、以下のようになります。><rb>る</rb><rt></rt></ruby></span>}}これをruby要素に対応しているWebブラウザで表示すると、次の画像のようにルビが振られます。alt="simpleruby7"></a>)ruby要素に対応していないWebブラウザで表示すると、「笑(わら)う門(かど)には福(ふく)来(きた)る」と表示されます。[#y3351a48]上記の例では「読み仮名エディタ」を使用してTextプロパティを設定しましたが、もちろん読み仮名エディタを使わずに、自分でTextプロパティを設定することもできます。Textプロパティに指定する文字列は、[[ユニコード上のルビ>http://ja.wikipedia.org/wiki/%E3%83%AB%E3%83%93#.E3.83.A6.E3.83.8B.E3.82.B3.E3.83.BC.E3.83.89.E4.B8.8A.E3.81.AE.E3.83.AB.E3.83.93]]で記述された文字列です。U+FFF9、ルビ開始指定文字にU+FFFA、ルビ終止指定文字にU+FFFBを使います。Textプロパティにはこのようなルビ表示制御文字そのものを使用する以外に、読み仮名エディタを使用した例のように、代わりにルビ表示制御文字を表した文字列を使用することもできます。U+FFF9文字の代わりに、VB.NETでは"\uFFF9"、C#では@"\uFFF9"や"\\uFFF9"という文字列を使うこともできます。逆に言えば、"\uFFF9"をそのまま表示したくて"\uFFF9"と書いたとしても、ルビ表示制御文字と解釈されてしまいます。[#s2afd83b]SimpleRubyでは、ルビの前後にrp要素が必ず入ります。これによって、ruby要素に対応していないWebブラウザで表示したときに、ルビが括弧などで囲まれます。ルビを囲む括弧を変更するには、FallbackLeftParenthesisとFallbackRightParenthesisプロパティを変更します。デフォルトでは、FallbackLeftParenthesisが"("で、FallbackRightParenthesisが")"になっています。SimpleRubyではrp要素が必ず入り、消す方法が無いようです。FallbackLeftParenthesisとFallbackRightParenthesisを空白にすると、両方とも"("が指定されたことになります。(FallbackRightParenthesisでは")"にならないとおかしいので、バグだと思われます。[#g41332e9]SimpleRubyでruby要素にクラス名を与えるには、RubyCssClassプロパティを使います。同様に、rtとrp要素にクラス名を与えるには、RubyTextCssClassプロパティを使います。RubyCssClassプロパティを"kanji"、RubyTextCssClassプロパティを"yomigana"とした時にSimpleRubyが出力するHTMLは、以下のようになります。Explorerでは5.0から独自に対応していますが、正式には、XHTML1.1とHTML5からの採用です。HTML5ではrb要素を採用していませんので、rb要素を省略できないSimpleRubyは使用することができません。SimpleRubyは、正式には、XHTML1.1以上でしか使用できないことになりそうです。Frameworkには、ユーザーがIMEで入力した文字列の読み仮名を取得するためのコントロールが用意されています。Windowsフォーム、WPF、Ajaxで使用できるコントロールがそれぞれあります。以下に、表にまとめます。コントロール|Ajaxエクステンダーコントロール|YomiganaExtender.dll|Microsoft.International.AjaxControl|この内ここでは、YomiganaTextBoxとYomiganaExtenderコントロールの使い方を説明します。[#w0674da5]YomiganaTextBoxコントロールを使うと、Windowsフォームコントロールで、テキストボックスに入力された文字列の読み仮名を別のコントロールに表示したり、取得したりが簡単にできます。YomiganaTextBoxコントロールはYomiganaTextBox.dllに含まれていますが、JpnKanaConversion.dll、JpnKanaConvHelper.dll、YomiganaFramework.dllも必要ですので、これらすべてを参照設定に追加します。コンポーネント」タブにある「参照」ボタンで「YomiganaTextBox.dll」を選択してください。YomiganaTextBoxコントロールがツールボックスに登録されたならば、フォームデザイナでYomiganaTextBoxコントロールをフォームに配置します。YomiganaTextBoxコントロールに入力された文字列の読み仮名を表示するコントロールも配置します。ここでは、TextBoxを配置します。配置したYomiganaTextBoxの名前を「YomiganaTextBox1」、TextBoxの名前を「TextBox1」にしたとします。YomiganaTextBox1に入力された文字列の読み仮名がTextBox1に表示されるように、YomiganaTextBox1のBindingControlプロパティを「TextBox1」とすれば、それだけで完成です。出来上がったアプリケーションを実行させてみましょう。YomiganaTextBox1にIMEを使って「わらうかどにはふくきたる。」と打ってから変換して「笑う門には福来る。この時はまだ何も起こりませんが、YomiganaTextBox1以外のコントロールを選択してYomiganaTextBox1がフォーカスを失うと、TextBox1に「わらうかどにはふくきたる。alt="YomiganaTextBox2"></a>)このように、YomiganaTextBoxがフォーカスを失ったときに、BindingControlプロパティに設定されたコントロールのTextプロパティに読み仮名が設定されます。YomiganaTextBoxに入力された文字列の読み仮名は、TextCapturedプロパティからも取得できます。[#p22892cc]ユーザーがIMEで入力文字を確定したとき、YomiganaTextBoxのYomiganaChangedイベントが発生します。この時YomiganaTextBoxのTextCapturedプロパティにより、YomiganaTextBoxに入力されている文字列の読み仮名を取得することができます。[#k232a128]YomiganaTextBoxが取得した読み(TextCapturedプロパティ)は、デフォルトでは、ユーザーが入力したカナの種類になります。これをひらがな、カタカナ、あるいは半角カタカナに強制的に変換して取得するには、TextCapturedPreferredConversionプロパティを変更します。TextCapturedPreferredConversionプロパティに指定できる値(PreferredConversion列挙体のメンバ)は、以下の通りです。|PreferredConversion列挙体のメンバ|説明|h|None|ユーザーが入力したカナのまま。||ToHiragana|カタカナと半角カタカナをひらがなに変換する。||ToKatakana|ひらがなと半角カタカナをカタカナに変換する。||ToHalfwidthKatakana|ひらがなとカタカナを半角カタカナに変換する。|なおこれらの変換は、[[.NETプログラミング研究第87号>../87]]で紹介したKanaConverterクラスを使って行われます。TextCapturedPreferredConversionプロパティがNoneでない時は、TextCapturedプロパティにアクセスするたびに変換が行われるようです。よってTextCapturedプロパティの内容に変化がないならば、TextCapturedプロパティを何度も呼び出さないほうが良いでしょう。[#fca164e4]YomiganaTextBoxは、[[ImmGetCompositionString関数>http://msdn.microsoft.com/ja-jp/library/cc447983.aspx]]を使ってユーザーがIMEで入力した読み仮名を取得しています。その他の方法は使っていないようです。そのため、色々な制限(不具合?)があります。YomiganaTextBoxにIMEで「福来る」と入力してからカーソルを先頭に持ってきて「笑う門には」を挿入したとき、YomiganaTextBoxには「笑う門には福来る」と表示されますが、TextCapturedプロパティ(及び、BindingControlプロパティに指定したコントロールに表示される文字列)は「ふくきたるわらうかどには」となります。挿入位置に関係なく、読み仮名は常に末尾に追加されるようです。同じように、YomiganaTextBoxにIMEで入力した文字列を数文字削除したとしても、そのことがTextCapturedプロパティに反映されません。このように、TextCapturedプロパティの値はYomiganaTextBoxに打ち込まれたカナを常に末尾に追加していった結果でしかなく、その文字が打ち込まれた位置や、基の文字列が削除されたかなどは考慮しません。基の文字列がすべて削除されたときは、TextCapturedプロパティの内容もクリアされます。その他、コピペで貼りつけた文字列の読み仮名ももちろん取得できません。この場合コピペされた文字列がそのままTextCapturedプロパティになります。[#o66fea02]私が試した限りでは、TextAnnotatedプロパティは常にnullを返すようでした。正しくは、"\ufff9(Textプロパティの値)\ufffa(TextCapturedプロパティの値)\ufffb"という、ユニコード上のルビが振られた文字列が返されることになっているようです。[#bedcd2b7]YomiganaExtenderコントロールを使うと、Webアプリケーションで、テキストボックスに入力された文字列の読み仮名を別のコントロールに表示することができます。Ajaxを使用するため、ページ全体を更新することなく、読み仮名を表示できます。YomiganaExtenderコントロールを使うには、YomiganaFramework.dllとYomiganaExtender.dllが必要ですので、これらを参照設定に追加します。YomiganaExtenderコントロールをツールボックスに登録しておきます。(ツールボックスに登録しないと、後で説明する「エクステンダーの追加」が表示されません。コンポーネント」タブにある「参照」ボタンで「YomiganaExtender.dll」を選択してください。詳しくは、先に紹介したSimpleRubyコントロールの説明をご覧ください。それでは、テキストボックスに入力された文字列の読み仮名を別のコントロールに表示するWebページを作ってみましょう。以下の手順でWebサービスを作成します。+メニューの「プロジェクト」-「新しい項目の追加」(または、ソリューションエクスプローラでプロジェクトを右クリックしてメニューを出し、「追加」-「新しい項目」)を選択し、ダイアログを表示します。+「HTMLページ」を選択し、名前に「yomigana.asmx」と入力し、OKボタンをクリックします。(本来は「Webサービス」を選択すべきですが、そうすると無駄なコードファイルが作成されてしまいます。)+yomigana.asmxを開き、内容を次のように書き換えて、保存します。%>}}次に、Webページを作成します。必要なコントロールを配置します。+デザイナを使用して、WebページにTextBoxコントロールを配置します。ここでは、「TextBox1」という名前にしたものとします。+同じくWebページにLabelコントロールを配置します。このLabelコントロールに読み仮名を表示します。名前は「Label1」とします。Labelコントロール以外のコントロールに読み仮名を表示させることもできます。コントロールのTextプロパティに読み仮名が設定されます。+さらにWebページにScriptManagerコントロールを配置します。名前は「ScriptManager1」とします。alt="YomiganaExtender1"></a>)次に、テキストボックスにエクステンダーを追加します。+TextBox1をクリックして選択し、スマートタグを表示させます。そこで、「エクステンダーの追加」を選択します。(または、TextBox1のプロパティウィンドウに表示される「エクステンダーの追加」を選択します。alt="YomiganaExtender2"></a>)+「エクステンダーウィザード」で「YomiganaExtender」を選択し、IDを「TextBox1_YomiganaExtender」として、OKをクリックします。alt="YomiganaExtender3"></a>)次に、YomiganaExtenderのプロパティを設定します。+「プロパティウィンドウ」のドロップダウンリストで「TextBox1_YomiganaExtender」を選択します。(または、「プロパティウィンドウ」でTextBox1のプロパティを表示し、「TextBox1_YomiganaExtender」の項目の左にある三角をクリックします。)+TextBox1_YomiganaExtenderのServicePathプロパティを「yomigana.asmx」、TargetBindingControlプロパティを「Label1」に変更します。TextCapturedPreferredConversionプロパティは先に紹介したYomiganaTextBoxと同じで、読み仮名をひらがな、カタカナ、半角カタカナに強制的に変換するかを指定します。alt="YomiganaExtender4"></a>)これで出来上がりです。ちなみにソースは、以下のようになります。runat="server"></asp:ScriptManager>}}実際に試してみましょう。TextBox1にIMEを使って「わらうかどにはふくきたる」と打ち込んでから変換し、「笑う門には福来る」と確定します。その後TextBox1からフォーカスが離れると、Label1に「わらうかどにはふくきたる」と表示されます。3.6.17では動作しませんでした。Firefoxでは、TextBox1に入力した文字列がそのままLabel1に表示されました。YomiganaTextBoxでは文字列の一部を削除したり、文字列の途中に挿入したときは正常に動作しませんでしたが、YomiganaExtenderではうまくいきます。コピペした文字列は、変になりました。