FreeForm控件一覽
FreeForm表單引擎與InfoPath Service對比
InfoPath是微軟SharePoint下的極重要的表單服務,其客戶端Ofiice InfoPath發布于2007年。
FreeForm是昕友軟件自主知識產權的XML Web表單引擎。
現在我們來對比FreeForm和InfoPath的區別。
|
InfoPath |
FreeForm |
服務器端寄存環境 |
|
|
|
IIS+.Net Framework(必需)
SharePoint Service(必需)
InfoPath Service(必需)
Database(必需)
|
IIS+.Net Framework(必需)
Non Database Or Database(可選) |
數據庫支持 |
|
|
|
SQL Server(唯一可選方式) |
XML或
SQL Server 或
My SQL或
Oracle或
DB2 |
Web訪問方式 |
|
|
|
瀏覽器訪問 |
瀏覽器訪問 |
客戶端訪問方式 |
|
|
|
Office InfoPath(唯一可選方式) |
EXE文件
瀏覽器 |
Web 控件支持 |
|
|
|
在Web 模式下 InfoPath只有少的可憐的11種輸入控件,且極難開發擴展控件(有質疑“極難”的請告知現有的商業或免費InfoPath擴展控件) |
內置53種控件,且可支持任意商業或免費的Silverlight控件,目前商業或免費的Silverlight控件數不勝數。
詳見:“FreeForm控件一覽
” |
開源 |
|
|
|
不開源 |
子項目EffectControls目前已經開源,訪問地址:http://effectControls.codeplex.com |
關鍵字 |
|
|
|
封閉 |
開放 |
FreeForm表單控件使用方法
普通輸入控件 Input

TextBox文本框
描述
TextBox是最常用的錄入控件,FreeForm的TextBox在用戶使用便利性方面有所改良。
入口
1、 進入FreeForm的控件頁,點擊“Input”;
2、 點擊“TextBox”,出現控件錄入彈出框,
注:其他的控件也是通過這種彈出框方式添加,下面其他控件將不再贅述“入口”這一節。
首先錄入Basic頁,填寫控件的基礎信息,錄入控件名稱等屬性。

注意,當錄入Label Text和Hint的時候,TextBox的展現形式有所不同,這體現了用戶使用的便利性,用戶可以靈活選擇展現方式。
|
僅錄入Label Text |
僅錄入Hint |
錄入項 |

|

|
展現形式 |

|

|
|
錄入Label Text 和Hint和Default Value |
均不錄入 |
錄入項 |

|

|
展現形式 |

|

|
展現形式

顯示特性
點擊“Display”頁

這里控制控件的顯示特性,比如我們修改屬性

控件顯示如下,我們可以看到,字體大小變為20,顏色是藍色,對齊方式是右對齊。

對寬度和高度進行調整:

控件顯示如下:

驗證
FreeForm提供了涵蓋廣泛的控件驗證,包括幾乎萬能的正則表達式驗證,
注:不僅是TextBox控件可以驗證,其他的控件也是通過這種方式驗證,下面其他控件將不再贅述。
點擊“Standard Validation”進入驗證頁

比如我們要規定產品價格必須小于等于100,那么可以這么定義:


另外,我們還規定“產品售價”必須是兩位整數和兩位小數組成的數字,我們可以用正則表達式來定義。
常用的正則表達式可以參考附件:常用正則表達式。

驗證檢查
設計檢查可以模擬運行時的環境,將錯誤提示出來。

另外點擊驗證出錯的控件,可以即時顯示ToolTip消息。

另外,將錯誤輸出到列表

自動計算
注:不僅是TextBox控件可以驗證,其他的控件也是通過這種方式驗證,下面其他控件將不再贅述。
MaskedTextBox 格式錄入框
描述
MaskedTextBox是預先定義好格式的錄入框,比如5位整數、2位小數、某字母和數字組合的8位字符等,可以預防用戶輸入錯誤的數據格式。
例一
我們在Mask Express中錄入:A999,含義是必須輸入一位字母加三位數字

顯示結果:

錄入后:

例二
在Mask Express中錄入:R{A}(8),含義是必須輸入8位字母
顯示結果:

錄入后:

例三
在Mask Express中錄入:LeftNumber(7.2S%),含義是必須輸入7位數字和2位小數,而且后面自動有%符號。
顯示結果:

錄入后:

使用技巧
字符列表的有效輸入:
9 =只有數字
A =只有字母
C =只自定義 - 匹配與過濾字FilterText
Z =數字+自定義
#=字母+自定義
X =任何數字
特殊字符:
\ =轉義字符
有效修飾字符:
@ =修飾指標(僅在開始)
U =轉換輸入為大寫
L =轉換輸入為小寫
有效預定義:
RightNumber([$ S] NNN.DDD [$ S或S%)] =數字輸入靠右對齊。
[$ S] =(可選)貨幣符號和/或正負符號
NNN.DDD =(必需)的整數部分.小數部分
[S%] =(可選)正負符號和/或百分比符號。
LeftNumber([$ S] NNN.DDD [$ S或S%)] =數字輸入靠左對齊。
[$ S] =(可選)貨幣符號和/或正負符號
NNN.DDD =(必需)的整數部分.小數部分
[S%] =(可選)正負符號和/或百分比符號。
R{?}([U|L]NNN) =重復NNN次。
? =任何有效輸入字符。
[U|L] =可選的輸入轉換為大寫或小寫。
ShortDate =輸入短格式日期。
LongDate =輸入長格式日期。
ShortTime=輸入短格式時間。
LongTime=輸入長格式時間。
ShortTimeAMPM =輸入短格式日期帶AMPM。
LongTimeAMPM =輸入長格式日期帶AMPM。
Label 標簽
描述
標簽控件

CheckBox復選框
描述
復選框控件

RadioButton單選框
描述
單選框控件

Password密碼框
描述
密碼框控件

IntTextBox整數錄入框
描述
整數錄入框控件

DecimailTextBox小數錄入框
描述
小數錄入框控件

ComboBox組合框
描述
組合框控件

顯示:


ListBox列表框
描述
列表框控件

DatePicker日期選擇框
描述
日期選擇框控件

TimePicker時間選擇框
描述
時間選擇框控件

RichText富文本框
描述
富文本框控件

HyperlinkButton
特效輸入控件 Effect Input

EffectControls簡介
EffectControls是昕友軟件開發的一套Silverlight特效動畫效果控件,目前已經開源,訪問地址:
http://effectControls.codeplex.com
效果預覽:

EffectControls簡介:
DropShadowEffect
用于控件陰影的顯示
正常狀態:

BlurEffect
正常狀態:

鼠標經過:

FadeEffect
正常狀態:

鼠標進入:

鼠標經過:


RotationXEffect
正常狀態:

鼠標經過:

RotationYEffect
類似RotationX1Effect
RotationZEffect
效果

RandomColor
正常狀態:


鼠標經過:

NoBorderLineEffect
正常狀態:

鼠標經過:



UnderLineEffect
正常狀態:


鼠標經過:



EffectTextBox
描述
EffectTextBox特效輸入框控件是具有樣式效果的輸入控件,特效包括陰影、霧化、淡入、色彩邊框等。
入口
1、進入FreeForm的控件頁,點擊“Effect”頁;
2、點擊“EffectTextBox”,出現控件錄入彈出框,
注:其他的控件也是通過這種彈出框方式添加,下面其他控件將不再贅述。
首先錄入Basic頁,填寫控件的基礎信息,錄入控件名稱等屬性。

在彈出框的下方,可以看到Effect選項,調整選項可以看到效果的預覽。
展現形式
分別添加一些控件,可以看到效果:

EffectLabel
描述
特效標簽控件

EffectCheckBox
描述
特效復選框控件

EffectSlider
描述
特效滑塊控件

以下控件效果類似,不再贅述。
EffectRadioButton
EffectIntTextBox
EffectDecimalTextBox
EffectComboBox
EffectListBox
EffectDatePicker
EffectTimePicker
EffectProgressBar
EffectHyperlinkButton
高級輸入控件 Expert Input

高級輸入控件是加強顯示效果的控件,更加直觀和有特色。

Button
描述
按鈕控件
WebBrowser
描述
瀏覽器控件

ProgressBar
描述
進度條控件


Rating
描述
評分控件

SliderGauge
描述
可拖拽進度條控件,這個控件和進度條控件類似,區別是進度條可以拖拽。

Gauge
描述
指標控件

Slider
描述
可拖拽進度條控件,這個控件和可拖拽進度條控件類似。

Calendar
描述
日歷控件。

GlobalCalendar
描述
國際日歷控件。

Chart
描述
圖表控件
線體控件 Line


圖標控件Icon

圖標控件用于美化表單

列表控件 List

DbConnection
RepeatTable
描述
重復表格控件
添加方法
在List控件頁下,點擊RepeatTable添加,比如要添加5行5列的表

如果是3行6列的表:

還可以控制表格的顯示屬性,比如高度、寬度。

效果:

待續……
在線演示: