WPF技術(shù)在蒙塞爾色相仿真測試中的應(yīng)用

李曉京，馬 進(jìn)，胡文東，張利利，惠鐸鐸

(第四軍醫(yī)大學(xué) 航空航天醫(yī)學(xué)教育部重點實驗室，陜西 西安 710032)

WPF技術(shù)在蒙塞爾色相仿真測試中的應(yīng)用

李曉京，馬 進(jìn)，胡文東，張利利，惠鐸鐸

(第四軍醫(yī)大學(xué) 航空航天醫(yī)學(xué)教育部重點實驗室，陜西 西安 710032)

蒙塞爾色相測試(Farnsworth-Munsell Hue Test)用于檢測色覺缺陷人員的色弱區(qū)域，該測試的計算機(jī)仿真應(yīng)用在一些方面存在不足。文中在對蒙塞爾測試需求分析的基礎(chǔ)上，提出了基于.Net WPF技術(shù)的色相子操作仿真軟件功能設(shè)計方案，重點闡述了色相子控件類、控件拖放行為類、基于屬性觸發(fā)器的層次效果、泛型容器排序算法以及由故事板控制的色相子移位動畫設(shè)計思路。最終實現(xiàn)的色相子操作仿真界面具有分辨率自適應(yīng)、色相子操作仿真特效、色相子移位多重業(yè)務(wù)邏輯等特點，能夠充分滿足目標(biāo)應(yīng)用需求。

WPF；Farnsworth-Munsell色相測試；自定義控件；行為類；屬性觸發(fā)器；泛型；故事板

0 引 言

WPF(Windows Presentation Foundation)是一個用于Windows的針對.NET設(shè)計的圖形顯示系統(tǒng)，基于WPF開發(fā)的應(yīng)用程序界面底層都使用DirectX技術(shù)，從而使得再普通不過的應(yīng)用程序也能使用諸如半透明、抗鋸齒等豐富的效果，并由DirectX將圖形渲染任務(wù)盡可能多地交給顯卡GPU處理，從而大大提高了硬件加速性能。其“界面UI設(shè)計”與“后臺編程”相分離的設(shè)計思想，使得界面元素外觀能夠以類似圖形編輯的方式輕松實現(xiàn)，使得編程人員得以專注于代碼和業(yè)務(wù)邏輯分析，二相結(jié)合創(chuàng)造出優(yōu)秀用戶體驗的交互設(shè)計。另外，WPF可以實現(xiàn)資源構(gòu)件化開發(fā)，資源的設(shè)計與開發(fā)具有很高的可重用性[1-9]。

蒙塞爾色相測試(Farnsworth-Munsell Hue Test)用于檢測色覺缺陷人員的色弱區(qū)域[10]。目前可以找到一些Win32仿真測試軟件[11-13]，在實用時發(fā)現(xiàn)存在一些不足：

(1)選中的色相子缺乏相對其他色相子的空間層次效果；

(2)拖拽釋放色相子對象后，色相子隊列的重排是一個跳變過程，色相子對象位移沒有過渡，易使受測者產(chǎn)生困惑和懷疑；

(3)軟件界面大小無法調(diào)節(jié)，在高分辨率顯示器上不能全屏?xí)@得交互界面過小。

1 蒙塞爾色相子仿真軟件需求分析

從測試實物外觀及相應(yīng)仿真軟件的不足之處可見，該仿真應(yīng)用存在如下關(guān)鍵需求：

色相子仿真控件：由于實物色相子具有相同的外觀，僅色相不同且數(shù)量較多，因此合理的作法是將其設(shè)計為可重用控件，提供顏色設(shè)置屬性以便編程。

色相子拖拽跟隨及層次特效：采用鼠標(biāo)操作模擬手工挪動色相子的位置變化，同時添加陰影效果，模擬控件的懸空狀態(tài)。

色相子釋放后的排序業(yè)務(wù)邏輯：在色相子拖拽釋放后，需要根據(jù)其新的位置信息來判斷它應(yīng)該歸置于什么標(biāo)準(zhǔn)位置，從而引起整個色相子隊列的重排。

色相子歸位動畫：用戶在釋放色相子控件后，如果參與排序業(yè)務(wù)的色相子控件都直接按照排序結(jié)果直接出現(xiàn)在其標(biāo)準(zhǔn)位置上，無疑是一種位置和色彩的突變，在視覺上會給用戶帶來不適以及對排序結(jié)果的懷疑與錯愕。因此，在完成排序業(yè)務(wù)邏輯運算后，讓色相子控件以過渡動畫的形式運動到它們的標(biāo)準(zhǔn)位置上，一方面與現(xiàn)實情況更為接近，另一方面可以讓用戶直觀地觀察到排序動態(tài)過程，從而增強其操作信心。

分辨率無關(guān)的自動縮放效果：由于用戶顯示器尺寸和分辨率設(shè)置有種種可能，目標(biāo)應(yīng)用應(yīng)能隨著用戶控制交互界面的放大、縮小而自適應(yīng)地調(diào)整界面控件元素的大小，從而滿足不同用戶的喜好。

從前述可知，WPF技術(shù)可以全方位滿足目標(biāo)應(yīng)用需求，特別是在用戶界面的美觀優(yōu)化與交互人性化設(shè)計方面，具有顯著的優(yōu)勢。

2 色相子控件設(shè)計

在WPF豐富的繪圖模型以及聲明式用戶界面的支持下，與專業(yè)設(shè)計工具Expression Blend相配合，圖形自定義控件的開發(fā)變得簡單而直觀。在Expression Blend中導(dǎo)入豐富的圖形構(gòu)建更加漂亮的控件，與在Photoshop中進(jìn)行圖形處理同樣容易[14]。簡便起見，下面以一個簡單明了的自定義控件加以演示和說明。

自定義控件的可視化樹及外觀如圖1所示。

由可視化樹可見，派生于UserControl的色相子控件由簡單的四個元素構(gòu)成。其中，第一個path元素是一個無色圓形，將其填充畫刷命名為CColor；第二個path則仿真色相子的環(huán)狀邊框覆蓋在上方。這兩個path元素嵌套在Canvas面板中置于Viewbox元素中，通過將Viewbox元素的Stretch屬性設(shè)置為"Uniform"實現(xiàn)控件在應(yīng)用時的一致性縮放。

圖1 色相子控件可視化外觀

后臺代碼工作主要是為控件創(chuàng)建三個依賴項屬性：ToTop、ToLeft、IsPressed。前兩個屬性用于控件實例的拖放歸位動畫，后者用于控件實例的拖放狀態(tài)層次效果屬性觸發(fā)器。將前述CColor畫刷的Color屬性封裝為控件的CenterColor屬性公開，通過該屬性可直接設(shè)定色相子控件實例的中心顏色。

主要代碼如下：

public partial class UserControl :UserControl

{

public Color CenterColor //該屬性用于設(shè)置色相子的顏色

{

set{CColor.Color=value;}

get{return (Color)CColor.Color;}

}

// ToLeftProperty依賴項屬性用于控件拖放歸位動畫

public static readonly DependencyProperty ToLeftProperty=

DependencyProperty.Register("ToLeft",

typeof(double),

typeof(UserControl1),

new FrameworkPropertyMetadata(0.0, null));

public double ToLeft

{

set{SetValue(ToLeftProperty, value);}

get{return (double)GetValue(ToLeftProperty);}

}

// ToTopProperty依賴項屬性與ToLeftProperty類似，定義從略

//IsPressedProperty依賴項屬性用于觸發(fā)控件拖放層次效果，bool型，定義從略

……

public UserControl1()

{

InitializeComponent();

}

}

需要強調(diào)的是，依賴項屬性的性質(zhì)決定了它支持動態(tài)綁定，因此尤其適用于動畫、界面元素動態(tài)更新等需求，從而極大地簡化了編程復(fù)雜度，但相應(yīng)地也會為其強大動態(tài)功能付出系統(tǒng)資源代價。因此，在普通屬性和依賴性屬性的選擇方面要因需制宜。色相子控件中，CenterColor屬性就被聲明為普通屬性，這是由于色相子的中心顏色在程序生命周期中不會有動態(tài)的變化，因此普通屬性就可以滿足需要。此外，并未為CenterColor屬性創(chuàng)建相應(yīng)的私有數(shù)據(jù)，而是通過訪問函數(shù)直接對其他元素屬性進(jìn)行操作，這種方式巧妙地達(dá)到了數(shù)據(jù)封裝和降低系統(tǒng)資源占用的目的，是.Net程序設(shè)計中一種非常實用的技巧。

3 色相子交互界面設(shè)計

仿真色相子界面用戶交互流程見圖2。

圖2 仿真色相子控件用戶交互流程

可見，由色相子控件事件驅(qū)動的拖放行為類、層次特效、控件排序業(yè)務(wù)邏輯、色相子歸位動畫等功能模塊相互作用，構(gòu)成了色相子仿真界面的人機(jī)交互邏輯。

3.1 色相子拖放行為類

WPF行為特征旨在代碼重用，封裝好的行為類可以為用戶界面上具有相同操作響應(yīng)的元素提供統(tǒng)一的操作支持。設(shè)計拖放行為類可以滿足色相子的拖放操作仿真，并降低代碼工作量。

DragInCanvasBehavior由泛型類Behavior派生，其中定義按鍵、松鍵等事件響應(yīng)函數(shù)。重載基類的OnAttached(為元素聲明添加行為特征時調(diào)用，通常在前臺Xaml文件聲明中為控件啟用行為，即附著)、OnDetaching函數(shù)(元素銷毀時被調(diào)用，即解除附著)，在這兩個函數(shù)中為被附著元素的相應(yīng)事件委托添加(或刪除)相應(yīng)的行為響應(yīng)函數(shù)。

一個完整色相子的拖放行為仿真由鼠標(biāo)左鍵按下、鼠標(biāo)移動、鼠標(biāo)左鍵松開這一系列鼠標(biāo)事件構(gòu)成，因此，目標(biāo)行為類定義了對這三個事件的響應(yīng)函數(shù)。此外，由于拖放操作完成后有后續(xù)的排序歸位動畫，且在動畫執(zhí)行期間不允許執(zhí)行下一次操作任務(wù)，因此，還需要為行為類添加兩個委托事件，PreDrag用于檢測是否處于動畫狀態(tài)，DragEnd用于通知主程序拖放完成可以開始排序歸位動畫。該類的主要代碼如下：

public class DragInCanvasBehavior:Behavior

{

private Canvas canvas; //用于保存控件的父容器面板

private bool isDragging=false;//用于鼠標(biāo)移動時判斷是否處于拖放狀態(tài)

private Point mouseOffset;//鼠標(biāo)位置偏移量

//下兩行定義拖放結(jié)束事件委托

public delegate void DragEndHandler(Object sender);

public event DragEndHandler DragEnd;

//下兩行定義拖放預(yù)檢事件委托

public delegate bool PreDragHandler(Object sender);

public event PreDragHandler PreDrag;

protected override void OnAttached()

{//重載附著函數(shù)，將相關(guān)響應(yīng)函數(shù)添加到控件委托

base.OnAttached();

//MouseLeftButtonDown委托關(guān)聯(lián)，MouseMove、MouseLeftButtonUp相類從略

this.AssociatedObject.MouseLeftButtonDown+=AssociatedObject_MouseLeftButtonDown;

……

}

protected override void OnDetaching()

{ //重載解除附著函數(shù)，從事件委托列表中刪除相關(guān)函數(shù)

base.OnDetaching();

//MouseLeftButtonDown解除委托關(guān)聯(lián)，MouseMove、Mouse-LeftButtonUp相類從略

this.AssociatedObject.MouseLeftButtonDown-=AssociatedObject_MouseLeftButtonDown;

……

}

private void AssociatedObject_MouseLeftButtonDown(Object sender,MouseButtonEventArgs e) //控件鼠標(biāo)左擊事件響應(yīng)函數(shù)

{

if(null!=PreDrag) if (!PreDrag(AssociatedObject)) return; //若不可進(jìn)入拖放狀態(tài)，返回

if(canvas==null)

canvas=(Canvas)VisualTreeHelper.GetParent(this.AssociatedObject); //獲取控件父面板

isDragging=true; //進(jìn)入拖放狀態(tài)標(biāo)志置位

//獲取點擊點相對控件的坐標(biāo)(元素左上為0，0)

mouseOffset=e.GetPosition(AssociatedObject);

//捕獲鼠標(biāo)，持續(xù)接收mousemove事件，即使其離開控件

AssociatedObject.CaptureMouse();

}

private void AssociatedObject_MouseMove(Object sender, MouseEventArgs e)

{//控件鼠標(biāo)移動事件響應(yīng)函數(shù)

if(isDragging)//拖放狀態(tài)下，控件進(jìn)入鼠標(biāo)跟隨效果

{//計算控件的新位置并設(shè)置其位置附加屬性

Point point=e.GetPosition(canvas);

Point pTemp=new Point(point.X-mouseOffset.X,point.Y-mouseOffset.Y);

……

//控件移動(應(yīng)限制控件位置不得超出父面板邊界，代碼從略)

AssociatedObject.SetValue(Canvas.TopProperty,pTemp.Y);

AssociatedObject.SetValue(Canvas.LeftProperty,pTemp.X);

}

}

private void AssociatedObject_MouseLeftButtonUp(Object sender,MouseButtonEventArgs e)

{//控件左鍵松開響應(yīng)函數(shù)

if(isDragging)

{

AssociatedObject.ReleaseMouseCapture();//解除捕獲鼠標(biāo)

isDragging=false; //拖放狀態(tài)標(biāo)志清除

//調(diào)用拖放結(jié)束委托函數(shù)，通知主線程執(zhí)行排序運算和歸位動畫

if(null!=DragEnd) DragEnd(AssociatedObject);

}

}

}

3.2 色相子控件應(yīng)用與層次特效

在Xmal聲明文件中，采用常規(guī)的程序集引用和控件聲明即可實現(xiàn)色相子控件的應(yīng)用，以兩個Canvas面板各含5個色相子控件為例，界面元素及可視化樹見圖3。

注：UserControl2是用于表示色相子標(biāo)準(zhǔn)位置的圖形控件，可忽略。

色相子及行為聲明示例代碼如下所示：

CenterColor="#FF873787" Height="50" Width="50" Panel.ZIndex="1">

注意在以上聲明中，已將后臺定義的PreDrag、DragFinished函數(shù)關(guān)聯(lián)到附著行為類相應(yīng)委托事件上。

拖放色相子時的層次特效首先是提升色相子在面板中的疊放層次，使受拖放控件呈現(xiàn)于其他控件之上，這將由后臺代碼來完成。其次，當(dāng)進(jìn)入拖動狀態(tài)時，可創(chuàng)建陰影效果，形成該色相子懸浮于空中的視覺效果。特效在Xaml文件的窗體資源中聲明，由前述色相子控件的自定義的IsPressed屬性觸發(fā)，Xaml聲明如下：

還可以通過故事板為陰影特效創(chuàng)建漸入漸出動畫以實現(xiàn)更為逼真的操作效果，這里就不作介紹了。

3.3 色相子排序業(yè)務(wù)邏輯與歸位動畫

色相子拖放與歸位動畫的中間環(huán)節(jié)是根據(jù)其被釋放時的位置計算整個色相子隊列成員的新位置。為了充分滿足用戶需求，設(shè)計插入和交換兩種業(yè)務(wù)邏輯供用戶選擇，插入/交換的目標(biāo)位置可就近或空位側(cè)優(yōu)先，如圖4所示。

圖4 色相子排序業(yè)務(wù)邏輯示例

這里以相對復(fù)雜的插入邏輯加以說明。

初始化時，將所有色相子控件實例保存在列表泛型容器中，在拖放行為結(jié)束時，根據(jù)被拖放的色相子位置，調(diào)整列表中的控件排序，按排好的順序?qū)?biāo)準(zhǔn)位置賦給各色相子的ToTop、ToLeft依賴項屬性，并進(jìn)入下一步的歸位動畫。

歸位動畫由動態(tài)創(chuàng)建的Storyboard實例控制，動畫開始時將指示動畫狀態(tài)標(biāo)志量置位，提交給拖放行為類的PreDrag委托函數(shù)將檢測該標(biāo)志以確定能否進(jìn)入后續(xù)的拖放操作狀態(tài)。

核心代碼如下：

public partial class Window2:Window

{

//多組色相子放在不同的Canvas面板中，對每個面板同時只允許執(zhí)行一個歸位動畫，因此定義面板與故事板的配對查詢字典

private Dictionary storyboards=new Dictionary();

//每個面板中所包含的色相子控件組保存在不同的泛型列表容器中，因此定義面板與列表容器的配對查詢字典

private Dictionary> dicCanPairedUCList=new Dictionary>();

//示例用兩組面板和色相子控件組，因此定義兩組保存色相子控件組的列表容器

List lstCtr=new List();

List lstCtr2=new List();

//由于色相子Top都一樣，只須保存各控件Left屬性值；兩組控件共享一組Left坐標(biāo)數(shù)組

List lstXPos=new List();

public bool bIsAnimming=false; //是否處于動畫狀態(tài)標(biāo)志位

public Window2()

{//構(gòu)造函數(shù)，完成初始化工作

int i;

InitializeComponent();

//將Xaml文件聲明的兩個面板與列表容器配對加入字典

dicCanPairedUCList.Add(can1,lstCtr1);

dicCanPairedUCList.Add(can2,lstCtr2);

for(i=0;i< can1.Children.Count;i++)

{//逐一將面板1中色相子實例入列，并保存標(biāo)準(zhǔn)位置數(shù)據(jù)

if (can1.Children[i].GetType()!=typeof(UserControl1)) continue;

lstCtr.Add((UserControl1)can1.Children[i]);

((UserControl1)can1.Children[i]).ToTop=//ToTop屬性全程不變

(double)((UserControl1)can1.Children[i]).GetValue(Canvas.TopProperty);

lstXPos.Add((double)((UserControl1)can1.Children[i]).GetValue(Canvas.LeftProperty));

}

//逐一將面板2中色相子入列，代碼從略

for(i=0;i

}

// DragFinished在Xaml控件聲明中關(guān)聯(lián)至控件拖放行為的DragEnd事件

public void DragFinished(Object obj)

{

int i,j=0;

double dtemp,mindiff=10000;

//三行代碼根據(jù)回調(diào)參數(shù)確定色相子控件、父面板及其配對列表容器

UserControl1 ctr=(UserControl1)obj;

Canvas can=(Canvas)VisualTreeHelper.GetParent(ctr);

List lstCtrTemp=dicCanPairedUCList[can];

if(bIsNearIns){ //若是就近插入邏輯

for(i=0;i

{/*dtemp用于保存受拖動控件與組內(nèi)各控件的距離；

距離最小的控件序號將保存在變量j中，代碼從略*/

dtemp=Math.Abs(lstXPos.ElementAt(i)-(double)(ctr.GetValue(Canvas.LeftProperty)));

……

}

//將被拖放的控件插入到新的位置

lstCtrTemp.Remove(ctr);

if(j==lstCtrTemp.Count)lstCtrTemp.Add(ctr);

else lstCtrTemp.Insert(j,ctr);

}

else{//空位側(cè)優(yōu)先插入邏輯直接采用Lambda表達(dá)式完成冒泡排序

lstCtrTemp.Sort((ctr1,ctr2)=>{

return(double)ctr1.GetValue(Canvas.LeftProperty) <

(double)ctr2.GetValue(Canvas.LeftProperty) ? -1:1;});

}

//交換業(yè)務(wù)邏輯從略

……

//創(chuàng)建故事板實例sb并行管理一組色相子的歸位動畫

Storyboard sb=new Storyboard();

for(i=0;i

{ //將標(biāo)準(zhǔn)X坐標(biāo)賦給各色相子控件的ToLeft

lstCtrTemp.ElementAt(i).ToLeft=lstXPos.ElementAt(i);

//橫坐標(biāo)歸位動畫

DoubleAnimationctrAL=newDoubleAnimation();

ctrAL.To=lstCtrTemp.ElementAt(i).ToLeft;

ctrAL.Duration=TimeSpan.FromSeconds(0.1);

Storyboard.SetTarget(ctrAL,lstCtrTemp.ElementAt(i));

Storyboard.SetTargetProperty(ctrAL,newPropertyPath("(Canvas.Left)"));

sb.Children.Add(ctrAL);

//縱坐標(biāo)歸位動畫與橫坐標(biāo)相類，代碼從略

……

}

//動畫時長設(shè)置為0.1秒，以免拖延操作時間

sb.Duration=TimeSpan.FromSeconds(0.1);

//動畫結(jié)束清理工作函數(shù)提交給故事板結(jié)束事件委托

sb.Completed+=storyboard_Completed;

sb.Begin();

storyboards.Add(can,sb);//將面板與動畫配對加入字典

}

//動畫結(jié)束時將被執(zhí)行的清理函數(shù)

privatevoidstoryboard_Completed(objectsender,EventArgse)

{

//由結(jié)束的故事板時間線對象查找受控色相子的父面板及其配對列表容器、配對故事板實例

ClockGroupclockGroup=(ClockGroup)sender;

UserControl1ctrTemp=(UserControl1)Storyboard.GetTarget(

(AnimationTimeline)clockGroup.Children[0].Timeline);

Canvascan=(Canvas)VisualTreeHelper.GetParent(ctrTemp);

Listlstctr=dicCanPairedUCList[can];

Storyboardstoryboard=storyboards[can];

//停止、清除動畫，并將面板、動畫配對從字典中刪除

storyboard.Stop();

storyboard.Children.Clear();

storyboards.Remove(can);

foreach(UserControl1ctrinlstctr)

{ //逐一將同組各色相子的目標(biāo)位置賦予自身的實際位置屬性

ctr.SetValue(Canvas.LeftProperty,ctr.ToLeft);

ctr.SetValue(Canvas.TopProperty,ctr.ToTop);

ctr.IsPressed=false; //清除控件拖放狀態(tài)標(biāo)志，去除層次效果

Canvas.SetZIndex(ctr,1); //恢復(fù)控件初始層次

}

}

//PreDrag函數(shù)在Xmal聲明中關(guān)聯(lián)到控件拖放行為的PreDrag事件

privateboolPreDrag(objectsender)

{

UserControl1ctr=(UserControl1)sender;

//檢查色相子控件的父面板是否處于動畫狀態(tài)

boolbTemp=storyboards.ContainsKey(((Canvas)ctr.Parent)) ?false:true;

if(bTemp) {//不在動畫狀態(tài)即將進(jìn)入拖放操作

Canvas.SetZIndex(ctr, 2);//提升控件疊放層次

ctr.IsPressed=true;//設(shè)置拖放標(biāo)志，觸發(fā)層次特效

}

returnbTemp;

}

}

為色相子控件定義的ToLeft、ToTop依賴項屬性作用在故事板中得到體現(xiàn)。如果不這樣設(shè)計，就需要在主窗體中為全部色相子定義相應(yīng)的依賴項屬性數(shù)組，那樣代碼邏輯顯然要混亂很多，并且當(dāng)界面色相子控件數(shù)量發(fā)生變化時，也會帶來代碼維護(hù)上的不便。

本例中用到了Dictionary、List兩種泛型容器，帶來的好處有兩方面。首先，雖然ArrayList類可以實現(xiàn)與泛型類相似的功能，但泛型實例是強類型的，即在聲明時必須給定容器內(nèi)將要存儲的對象類型，從而省去了ArrayList類應(yīng)用時對未知數(shù)組元素的裝箱/拆箱操作，提高程序運行效率；其次，泛型類直接或間接提供了對數(shù)組元素的查詢、定位、插入、排序等豐富的成員函數(shù)或接口，在程序設(shè)計方面帶來的便利是顯而易見的。

3.4 與分辨率無關(guān)的自適應(yīng)界面設(shè)計

對于Win32應(yīng)用來說，控件隨著界面的大小而自動縮放是一項繁瑣的任務(wù)。但由于WPF強大的布局設(shè)計與圖形化界面功能，這幾乎不算一個問題。如圖3中的可視化樹所示，將面板包含在Viewbox中，并根據(jù)需要設(shè)置Viewbox的Stretch、StretchDirection屬性，就可以實現(xiàn)控件隨用戶界面大小而自適應(yīng)地動態(tài)調(diào)整自身大小，滿足用戶的視覺需求。如圖5所示，對比標(biāo)題欄大小可見兩個不同大小窗口中，控件完全隨著窗體的拉伸自適應(yīng)縮放并調(diào)整布局繪制，不需要任何后臺代碼。

圖5 仿真色相子界面自適應(yīng)縮放及布局

這種與界面大小無關(guān)的控件自適應(yīng)縮放與自動布局充分體現(xiàn)了WPF的強大，其將編程人員從繁瑣的界面布局邏輯中完全解放出來，從而可以更加專注于核心業(yè)務(wù)代碼設(shè)計，對于程序開發(fā)效率和用戶體驗的提升具有劃時代的意義。

4 結(jié)束語

根據(jù)Farnsworth-Munsell色相測試系統(tǒng)實物使用特點及原有軟件的不足之處，文中提出了基于WPF技術(shù)的色相子仿真交互界面設(shè)計方案。該方案充分利用到.Net的圖形界面優(yōu)勢，綜合運用依賴項屬性、觸發(fā)器、故事板、泛型等.Net和WPF的優(yōu)勢特性，具有界面外觀可拓展性強、更接近實際物理特性的層次效果和仿真排序過渡動畫、與分辨率無關(guān)的界面自適應(yīng)縮放與布局調(diào)整等特點，并對涉及的關(guān)鍵技術(shù)進(jìn)行了詳細(xì)介紹。在Win32應(yīng)用逐漸落伍，個性化、富媒體化跨平臺應(yīng)用日益崛起的大背景下，文中介紹的.Net框架下的WPF相關(guān)技術(shù)，對于圖形化界面與人機(jī)交互類的應(yīng)用開發(fā)都有一定的借鑒意義。文中示例在Windows XP系統(tǒng)Visual Studio 2010 C#開發(fā)環(huán)境下編譯，Win XP、Win 8操作系統(tǒng)測試通過。

[1] Troelsen A.C#與.Net 4高級程序設(shè)計[M].朱 曄,肖 逵,姚琪琳,等,譯.第5版.北京:人民郵電出版社,2011.

[2] MacDonald M.WPF編程寶典—C#2010版[M].王德才,譯.北京:清華大學(xué)出版社,2011.

[3] Petzold C.Windows Presentation Foundation程序設(shè)計指南[M].蔡學(xué)鏞，譯.北京:電子工業(yè)出版社,2008.

[4] 王 鵬,崔 靜.新一代界面技術(shù)WPF的架構(gòu)及應(yīng)用[J].成都紡織高等專科學(xué)校學(xué)報,2011,28(1):18-20.

[5] 張京明，曹國忠，張承業(yè)，等．創(chuàng)新方法與交互設(shè)計結(jié)合的探討[J]．價值工程，2012,31(10)：10-11．

[6] 李 穎．基于WPF的課堂教學(xué)管理系統(tǒng)研究與設(shè)計[J].中國教育技術(shù)裝備，2011(24)：85-87.

[7] 袁云云,周之昊.基于WPF的醫(yī)療輔助軟件設(shè)計與開發(fā)[J].數(shù)字技術(shù)與應(yīng)用,2012(2):132-132.

[8] 李成剛，馮 靜，凌 玲．基于WPF的交互式繪圖系統(tǒng)的開發(fā)[J].微型機(jī)與應(yīng)用，2011,30(6)：50-52.

[9] Macdonald M.Pro WPF in C# 2008:Windows Presentation Foundation with .NET 3.5[M]．New York：Apress,2008．

[10] Farnsworth D.The Farnsworth-Munsell 100 hue and Dichotomous tests for color vision[J].Journal of the Optical Society of America B-optical Physics,1943,33:568-578.

[11] Hidajat R R,Hidayat J R,McLay J L,et al.A fast system for reporting the Farnsworth-Munsell 100-hue colour vision test[J].Documenta Ophthalmologica,2004,109(2):109-114.

[12] Ghose S,Parmar T,Dada T,et al.A new computer-based Farnsworth-Munsell 100-hue test for evaluation of color vision[J].International Ophthalmology,2014,34(4):747-751.

[13] Melamud A,Simpson E,Traboulsi E I.Introducing a new computer-based test for the clinical evaluation of color discrimination[J].American Journal of Ophthalmology,2006,142(6):953-960.

[14] 張洪定,孟冬梅.基于Expression Blend 4中文版 WPF和Silverlight項目設(shè)計基礎(chǔ)[M].北京:清華大學(xué)出版社,2011.

Application of WPF in Farnsworth-Munsell Hue Simulation Testing System Development

LI Xiao-jing,MA Jin,HU Wen-dong,ZHANG Li-li,HUI Duo-duo

(Key Laboratory of Aerospace Medical of Ministry of Education,Fourth Military Medical University,Xi’an 710032,China)

Farnsworth-Munsell Hue Test is applied to inspect the color weakness area of hypochromatopsia patients.But,for the computer simulation software of the test,there are some improvable aspects in the characteristics’ simulation.Based on the demand analysis of the test,a kind of software function and frame,utilizing .NET WPF,was developed for Hue-Token (HT) manipulating simulation.Primarily,the design of HT component,drag-drop behavior class,layer effect based on property trigger,sorting arithmetic of generic class and HT shifting animation under the control of storyboard were described in detail.Features of the final simulation interface such as resolution self-adaption,special effects of HT operation,multi-business logic of HT shift,could meet the need of demand of object application sufficiently.

WPF (Windows Presentation Foundation);Farnsworth-Munsell Hue Simulation Testing;user control;behavior class;property trigger;generic type;storyboard

2015-04-08

2015-07-13

時間：2016-01-04

國家自然科學(xué)基金青年項目(81202178/H2602)；全軍醫(yī)藥衛(wèi)生重大項目(AWS12J003)

李曉京(1975-)，男，高級實驗師，碩士，研究方向為計算機(jī)應(yīng)用、生物醫(yī)學(xué)工程；馬 進(jìn)，副研究員，博士，研究方向為心理學(xué)；胡文東，研究員，碩士，研究方向為心理學(xué)、醫(yī)學(xué)工程。

http://www.cnki.net/kcms/detail/61.1450.TP.20160104.1510.060.html

TP311

A

1673-629X(2016)02-0154-07

10.3969/j.issn.1673-629X.2016.02.035