小職はこことは別に趣味でオンラインゲーム・ドラゴンクエスト10を扱ったブログを運営している。


ドラゴンクエスト10お役立ち情報
http://iroirotukuruyo647.blog.fc2.com


先日、モンスター大討伐という全プレイヤーで一定数のモンスターを討伐するイベントがあり、せっかくの機会なので勉強のついでに最近仕事で使っているScalaとC3.jsというD3.js拡張ライブラリを利用して、討伐数を集計し、その結果をブログ上にリアルタイムで公開した。


ドラゴンクエスト10 イベント 『はぐレモンからの挑戦!!』 モンスター大討伐 討伐数グラフ
http://iroirotukuruyo647.blog.fc2.com/blog-entry-42.html


集計の元になった数字はゲームの公式サイトで公開されており、更新されるたびに採取。
イベント開始日から突貫で作成したため、完成度が低く粗が目立つが、インタラクティブなデータ描画能力にはWebでのグラフ描画の可能性を感じた次第。
まだまだ、やってみたいことがあるので次回の同イベントまでに更に研究を重ね、完成度を上げていきたい。


今回は以下の構成でグラフ描画を実現した。時間が出来たら、Tipsを記事にする予定。

  • 開発環境:eclipse4.3(preiades)
  • 集計プログラム:Scala
  • グラフ表示:c3.js(http://c3js.org/)
  • データ保存形式:json

RichTextBoxから入力文字列(TextBoxで言うところのText)を取得

RichTextBoxにはTextプロパティがない。GetText的なテキストのみを取得するAPIも無いっぽい。


参考URL:http://msdn.microsoft.com/ja-jp/library/ee681613(v=vs.95).aspx
    http://msdn.microsoft.com/ja-jp/library/system.windows.controls.richtextbox(v=vs.95).aspx


自分はRichTextBoxのテキストをボタンクリックでクリップボードにコピーしたく、以下の方法でそれを解決した。

[VB.NET]
    RichTextBox1.SelectAll()
    Clipboard.SetText(RichTextBox1.Selection.Text)

Widthの限界値

参考URL:http://msdn.microsoft.com/ja-jp/library/system.windows.frameworkelement.width(v=vs.95).aspx

UIコントロールのWidthの最大値はMSDNによると
「Width には非決定性の上限値があります (これは、Single.MaxValue より大きいが Double.MaxValue より小さい、
非常に大きな値です)」
と書いてあるのだが、実際はそんなに大きいコントロールは正常に表示されないことがわかった。


実際に試してみて欲しいが、

[XAML]
<Grid x:Name="LayoutRoot" Background="White">
    <TextBox x:Name="TextBox1" Width="35000" Text="Widthのテスト"/>
</Grid>


のようなコードを書くと、TextBoxがブツ切れの様になって表示される。
MSに問い合わせたら、「Widthは32767(符号付16bit整数のMAX)で座標計算していた」
とのこと。
しかも、「IEなどで表示倍率を変更していた場合、その倍率に応じて限界値を計算していた」らしい。
つまり、例えば200%に拡大した場合、Width=16383が限界であり、50%ならばWidth=65534が限界となる。


今後の対応方針について再度連絡してくれるようなので、ひとまずそれ待ち。
ってか、直してくれないと2ヶ月掛けて組んだソースがムダになる。

相対的な座標の取り方

後で編集するとしてメモだけ。


Dim mat As MatrixTransform = CType(UIElement1.TransformToVisual(UIElement2), MatrixTransform)
Dim dx As Double = mat .OffsetX
Dim dy As Double = mat .OffsetY


UIElement2から見たUIElement1の座標を取得できる。
比較対象はそれぞれのコントロールの左上端。
単位はpixel。

ドラッグ&ドロップで項目の移動を実現するDragDropTargetコントロール

Silverlight Toolkitに同梱されたコントロールDragDropTargetの中に特定のコントロールを配置することで、
ドラッグ&ドロップによる項目の移動を実現できる。


基本クラスとなるDragDropTargetクラス自身は継承専用クラスであり、そのクラスを継承時ドラッグ&ドロップ処理を自分で実装する必要がある。
ただし、Toolkitでは既に以下の継承クラスが用意されており、特定のコントロールと組み合わせることにより、組み合わせたコントロールの中で
ドラッグ&ドロップによる項目の移動を実現できる。

  • ListBoxDragDropTarget: ListBoxコントロール内の項目の順序を入れ替えることが可能になる。
  • PanelDragDropTarget: Toolkitに同梱された・WrapPanel内の項目の順序を入れ替えることが可能になる。
  • TreeViewDragDropTarget: Silverlight SDKに同梱されたコントロール・TreeView内の項目の順序を入れ替えることが可能になる。

TreeViewの項目移動の実装

[XAML]
<UserControl x:Class="DragDropTargetTestApplication.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
    xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <Grid x:Name="LayoutRoot" Background="White">
        <toolkit:TreeViewDragDropTarget>
            <sdk:TreeView AllowDrop="True">
                <sdk:TreeViewItem Header="AAAA"/>
                <sdk:TreeViewItem Header="BBBB"/>
                <sdk:TreeViewItem Header="CCCC"/>
                <sdk:TreeViewItem Header="DDDD"/>
            </sdk:TreeView>
        </toolkit:TreeViewDragDropTarget>
    </Grid>
</UserControl>

上記の実装により、TreeView内でTreeViewItemを自由に移動が出来るようになる。
TreeViewの場合、子要素を親要素と同じレベルに移動したり、ある要素を別の要素の子要素とすることが可能である。その場合、移動した要素の子
要素も全て移動する。


また、複数のDragDropTargetを配置して違うDragDropTarget間での項目移動も可能である。

2011年08月25日のツイート

2011年08月24日のツイート