Monday, November 17, 2008
Saturday, November 15, 2008

今回はオブジェクトの傾斜についてです。

傾斜を行うには<SkewTransform>タグを使用します。

このタグでは以下の属性を使用します。

  • CenterX: 傾斜を行う際の中心点X
  • CenterY: 傾斜を行う際の中心点Y
  • AngleX: X方向傾斜角度
  • AngleY: Y方向傾斜角度

 

X方向の傾斜

X方向へ45度傾斜させる場合には、AngleXに45を指定し、XAMLを下記のように書きます。

<Button Height="23" Margin="99,106,104,0" Name="Button1" 
    VerticalAlignment="Top" IsDefault="True" IsCancel="True">
    <Button.RenderTransform>
        <SkewTransform CenterX="0" CenterY="0" AngleX="45" AngleY="0">
        </SkewTransform>
    </Button.RenderTransform>
    Button
</Button>

Y方向の傾斜

Y方向へ45度傾斜させる場合には、AngleYに45を指定し、XAMLを下記のように書きます。

<Button Height="23" Margin="99,106,104,0" Name="Button1" 
    VerticalAlignment="Top" IsDefault="True" IsCancel="True">
    <Button.RenderTransform>
        <SkewTransform CenterX="0" CenterY="0" AngleX="0" AngleY="45">
        </SkewTransform>
    </Button.RenderTransform>
    Button
</Button>

WPF
Saturday, November 15, 2008 11:22:45 PM (Tokyo Standard Time, UTC+09:00)  #    Comments [0]  |  Trackback
Friday, November 14, 2008

メモです。

WPFでは3Dも扱えるのですが、今のところ3Dモデルを作成できるソフトウェアはMicrosoftから出ていません。

有償であればZAM3Dなるソフトウェアがありますが貧乏人には買えません...

そこで、フリーウェアで何とかならないかと探していたところ、下記でできそうなことがわかりました。


・Metasequoia

3DCGやCAD、ゲーム制作などに用いる立体形状データを作成するためのポリゴンベースのモデラー

有料版と無料版があります。

このソフトウェアだけでは3DモデルのXAMLを作成できません。


・Identity

XAML対応Windows用3Dアニメーションツール。

上記の Metasequoia で作成したデータからアニメーションをつけてXAMLを作成することができます。

 

上記2つを使えば3D対応XAMLを作成できそうです。(ってまだ試していません。いずれは...)

ちなみに、この件をいろいろ調べていたら

trueSpaceというソフトウェアがMicrosoftから無償で公開されています。

trueSpaceは、Microsoftが2月に買収した米Caligariが開発した製品でもともとは700ドルくらいのソフトウェアだとか...

ただしXAMLを直接作成することはできません。DirectXでおなじみXファイルは作成できるようです。

このソフトウェアがWPF対応するのでは?と見ている人もいるようなので要チェックです。

WPF
Friday, November 14, 2008 10:32:02 PM (Tokyo Standard Time, UTC+09:00)  #    Comments [0]  |  Trackback
Thursday, November 13, 2008

今回はWPFアプリケーションにおけるスケーリング(拡大/縮小)について説明します。

スケーリングを行うには<ScaleTransform>タグを使用します。

このタグでは以下の属性を使用します。

  • CenterX: スケーリングを行う際の中心点X
  • CenterY: スケーリングを行う際の中心点Y
  • SacleX: X方向伸縮倍率
  • ScaleY: Y方向伸縮倍率

CenterX=0, CenterY=0, ScaleX=2, ScaleY=2とした場合のXAMLは

<Button Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" 
        Name="Button1" VerticalAlignment="Top" Width="75">
    <Button.RenderTransform>
    <ScaleTransform CenterX="0" CenterY="0" ScaleX="2" ScaleY="2"></ScaleTransform>
    </Button.RenderTransform>
    Button
</Button>

となり、下図のようにスケーリングされます。薄いボタンはスケーリング前のボタンを表しています。

ScaleXとScaleYには負の値も指定可能です。

この場合はボタンに表示されている文字は反転することになります。

ScaleX="-1", ScaleY="-1" にしたXAMLを下記のように作成し

<Button Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" 
        Name="Button1" VerticalAlignment="Top" Width="75">
    <Button.RenderTransform>
    <ScaleTransform CenterX="0" CenterY="0" ScaleX="-1" ScaleY="-1"<>/ScaleTransform>
    </Button.RenderTransform>
    Button
</Button>

上記XAMLは下図のようにスケーリングされます。薄いボタンはスケーリング前のボタンを表しています。

WPF
Thursday, November 13, 2008 10:55:45 PM (Tokyo Standard Time, UTC+09:00)  #    Comments [0]  |  Trackback
Wednesday, November 12, 2008

今回から数回に分けて、WPFにおけるオブジェクトの

  • 回転
  • スケーリング
  • 傾斜

について学んでいきたいと思います。

今回はオブジェクトの回転についてです。

Visual Studio上でデザインする場合、回転、スケーリング、傾斜といった項目はプロパティウィンドウに表示されないため、XAMLに直接手を加えることになります。

Expresion Blendがあるとマウス操作によるデザインが可能なのですが、理解しておくことでマウス操作では出来ない微調整も可能となりますのでこれを機会に覚えてしまいましょう。

Buttonコントロールを例に、それぞれについてサンプルを示します

基本
2-D平面での変換(回転、スケーリング、傾斜など)を行うには、

<オブジェクト.RenderTransform>~</オブジェクト.RenderTransform>タグが必要です。

Buttonコントロールを2-D平面で変換(回転、スケーリング、傾斜など)する場合の基本XAMLは

<Button Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" 
        Name="Button1" VerticalAlignment="Top" Width="75">
    <Button.RenderTransform>
    <!--ここに回転、スケーリング、傾斜などのタグを挿入-->
    </Button.RenderTransform>
    Button
</Button>

 

となります。あとは回転、スケーリング、傾斜などのタグを<オブジェクト.RenderTransform>~</オブジェクト.RenderTransform>へ挿入します。

回転 RotateTransform
オブジェクトの回転を行うには<RotateTransform>タグを使用します。
<RotateTransform>は、点 (CenterX、CenterY) を中心として、指定した Angle(単位:度) だけオブジェクトを回転します。

CenterX=0, CenterY=0, Angle=45とした場合のXAMLは

<RotateTransform CenterX="0" CenterY="0" Angle="45"/>
となり、下記のように配置されます。図を見てわかるとおり、中心点はオブジェクトの左上隅が(0,0)です。薄いボタンは回転前の位置を表しています。



オブジェクトの中点を中心点として回転させたい場合には、
CenterX=オブジェクト幅÷2、CenterY=オブジェクト高さ÷2
とすればよいことになります。
幅:75、高さ:23のボタンを中心を軸に回転させる場合は、下記XAMLとなります。

<RotateTransform CenterX="37.5" CenterY="11.5" Angle="45"/>


まとめ

<RotateTransform> を使用すれば、自由にオブジェクトを回転できることがおわかりいただけたかと思います。

Buttonコントロール以外にも使用できますので、是非いろいろと使用してみてください。

WPF
Wednesday, November 12, 2008 10:21:05 PM (Tokyo Standard Time, UTC+09:00)  #    Comments [0]  |  Trackback
Tuesday, November 11, 2008

Microsoft Expression Blend2 SP1 もとっくにダウンロード可能だったんですね.....

知りませんでした。

ということで、ダウンロードしてインストールしてみました。

1)ダウンロードしてきた実行ファイル(BlendV2SP1_ja.exe)をダブルクリックして実行

2)ライセンス条項を読んで[同意する]をクリック(もちろん同意する場合)

3)あとはインストールが完了するのを待つだけ

 

Blend2 SP1では「Silverlight2 アプリケーション」がサポートされていますので、Silverlight2アプリを開発する方はインストールしましょう。

 

Tuesday, November 11, 2008 8:48:37 PM (Tokyo Standard Time, UTC+09:00)  #    Comments [0]  |  Trackback

Visual Studio 2008 SP1用 Silverlight Tools をダウンロードしてインストールが完了したので記録として残しておきます。

1)ダウンロードしてきたファイル(Silverlight_Tools.exe)を実行

2)[次へ]ボタンをクリック

3)ライセンス条項を読んで[同意]するにチェックをして[次へ]をクリック

4)あとはひたすら待つのみ。

5)[完了]をクリックして終了。

 

インストール完了後、プロジェクトの種類で「Silverlight」を選択でき、

  • Silverlightアプリケーション
  • Silverlightクラスライブラリ

の開発が可能となります。

下図に示すようにVB.NETかC#での開発が可能ですので、お好きな方でどうぞ。

Tuesday, November 11, 2008 8:20:42 PM (Tokyo Standard Time, UTC+09:00)  #    Comments [0]  |  Trackback

Visual Studio 2008 SP1用 Silverlight Tools ダウンロード可能になっていたんですね。

これでSilverlight 2 用アプリケーションを Visual Studio 2008 上で開発ができますね。

さっそくダウンロードして試さなくては!!

Tuesday, November 11, 2008 7:46:50 PM (Tokyo Standard Time, UTC+09:00)  #    Comments [0]  |  Trackback
Saturday, November 08, 2008

WindowsアプリケーションのフォームにはAcceptButtonとCancelButtonというプロパティがあります。

AcceptButton:フォームの[承諾]ボタンです。このプロパティを設定すると[Enter]が押されるたびに、ボタンがクリックされる。

CancelButton:フォームの[キャンセル]ボタンです。このプロパティを設定すると[Esc]が押されるたびに、ボタンがクリックされる。

WPFにおいてWindowsフォームに対応するものはWindowですが、AcceptButtonプロパティとCancelButtonを備えていません。

Windowsフォームのように[承諾]ボタンと[キャンセル]ボタンを実現するには、ButtonコントロールのIsDefaultやIsCancelプロパティを使用します。

IsDefaultプロパティ:プロパティウィンドウでこの項目にチェックを付けるかコードでtrueをセットすると、[Enter]キーが押されるたびにクリックされるようになります。

IsCancelプロパティ:プロパティウィンドウでこの項目にチェックを付けるかコードでtrueをセットすると、[Esc]キーが押されるたびにクリックされるようになります。

このプロパティは排他制御がされていないため、1つのボタンで[承諾]も[キャンセル]も行えるボタンを作成できてしまいます。またWindowsアプリケーションとは異なり、[承諾]と[キャンセル]を意味するプロパティがボタン自身が持つことにより、複数のボタンに[承諾]や[キャンセル]を割り当てることが出来てしまいます。

下記のようにボタンを2つ、テキストボックスを1つ配置して挙動を確かめてみます。

実験方法
フォーカスをテキストボックスに置いた状態で、[Enter]または[Esc]を押す。
(これはフォーカスがButton1 or Button2にある状態で[Enter]や[Esc]を押すのを防ぐためです)


1)Button1のIsDefaultとIsCancelにTrueをセット。Button2はIsDefault,IsCancelともにFalseをセット。
  [Enter]を押しても[Esc]を押しても、Button1のクリックイベントが発生。

2)Button1およびButton2の両方のIsDefaultにTrueをセット
 [Enter]を押すとButton1にフォーカスが当たるだけで、クリックイベントは発生しなかった。

3)Button1およびButton2の両方のIsCancelにTrueをセット
 [Esc]を押すとButton1にフォーカスが当たるだけで、クリックイベントは発生しなかった。

4)Button1のIsDefaultにTrue,IsCancelにFalse、Button2のIsDefaultにFalse,IsCancelにTrueをセット
[Enter]を押すとButton1のクリックイベントが発生。
[Esc]を押すとButton2のクリックイベントが発生。

まとめ
上記実験結果から、IsDefaultおよびIsCancelは
・1つのボタンに同時にセットしてはいけない
・複数のボタンに同一プロパティを設定してはいけないし
ということになります。

IsDefaultおよびIsCancelは組み合わせによっては正常に動作しないこともあるので注意が必要です。
なぜ、Windowsフォームのようにしなかったのか疑問ですね

WPF
Saturday, November 08, 2008 9:34:53 PM (Tokyo Standard Time, UTC+09:00)  #    Comments [0]  |  Trackback
Friday, November 07, 2008

WPFのButtonコントロールはClickModeプロパティを使用して、Clickイベントの発生タイミングを変更することが可能です。

ClickModeで指定可能な値はRelease, Press, Hoverがあります。規定値はReleaseです。

それぞれの動作は下記の通りです。


Release
ボタンを押して離したときにClickイベントが発生します。
Press
ボタンを押すとすぐにClickイベントが発生します。
Hover
マウスをコントロールの上に置いたときに Click イベントが発生します。

 

下図のようにボタンを3つ配置して、それぞれのClickModeを割り当てて実験してみました。

 

ClickMode設定後のXAMLは下記の通りです。

<Button Height="23" HorizontalAlignment="Left" 
        Margin="12,12,0,0" Name="Button1" 
        VerticalAlignment="Top" Width="75" ClickMode="Release">Button1</Button>
<Button Height="23" HorizontalAlignment="Left" 
        Margin="12,41,0,0" Name="Button2" 
        VerticalAlignment="Top" Width="75" ClickMode="Press">Button2</Button>
<Button Height="23" HorizontalAlignment="Left" 
        Margin="13,70,0,0" Name="Button3" 
        VerticalAlignment="Top" Width="75" ClickMode="Hover">Button3</Button>

VB.NETのソースコードは下記の通り

Partial Public Class Window1
    Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button1.Click
        MessageBox.Show("ClickMode:" + Button1.ClickMode.ToString())
    End Sub

    Private Sub Button2_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button2.Click
        MessageBox.Show("ClickMode:" + Button2.ClickMode.ToString())
    End Sub

    Private Sub Button3_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles Button3.Click
        MessageBox.Show("ClickMode:" + Button3.ClickMode.ToString())
    End Sub

End Class


上記を実行すると、ボタンクリック時にクリックされたボタンのClickModeをメッセージボックスに表示します。

それぞれのイベントが発生するタイミングを是非体感してみてください。

ちなみに、従来のWindowsアプリケーションではクリックの動作はReleaseが該当します。

PressやHoverは慣れないと違和感を覚えますね。


 

WPF | 入門
Friday, November 07, 2008 10:35:39 PM (Tokyo Standard Time, UTC+09:00)  #    Comments [0]  |  Trackback

Theme design by Jelle Druyts

Pick a theme: