Spread for ASP.NET 7新功能使用指南


Spread for ASP.NET表格控件兼容Excel的強大功能,並將其嵌入到您的應用系統中。完備的Excel文檔支持使得您可以在企業中分享和訪問數據信息;內嵌的圖表引擎和數據可視化支持讓您更加輕松的為商務、工程以及科學應用系統中創建豐富高效的信息中心。新版本7中提供幾個主要更新,包括:

  • 上下文菜單
  • 列頭RowTemplate
  • 用於單元格編輯器的Css
  • 性能提升
  • 其他Spread for ASP.NET的增強
    • 為DateTime、Currency、Double和Integer單元格類型增加獨立的編輯模式和非編輯模式格式。
    • 增強虛擬頁面以支持滾動條文本提示。
    • 打印時支持行和列的分頁。
    • 支持客戶端腳本鎖定和解鎖。
    • 新增Cell.EncodeValue屬性,支持在單元格文本中直接輸入原始HTML標記。
    • 客戶端支持在隱藏的行或列中設置單元格的值。
    • 新增ClientIDMode支持。

上下文菜單

Spread for ASP.NET內嵌的上下文菜單代替了瀏覽器自帶的上下文菜單,您可以通過Spread上下文菜單特性為您的應用程序加入更多的數據挖掘和界面交互的功能。

clip_image002

你可以任意定制上下文菜單的選項,設置高度和其他屬性。可以通過 ContextMenuType 枚舉設置菜單類型。你可以通過前台屬性設置或后天代碼來創建上下文菜單。

CommandArgument 屬性和 CommandCode 屬性用於設置點擊菜單屬性。同時,也可以在 MenuItemClicked 事件中。

使用屬性窗體創建:

  • 在屬性窗體中選擇 Spread
  • 選擇 ContextMenus 屬性
  • 在彈出對話框中編輯菜單項即可。
  • 編輯完成后點擊“確定”按鈕退出。

clip_image003

使用代碼創建:

HTML 標記:

 

<ContextMenus>
     <FarPoint:ContextMenu Type="Viewport">
         <Items>
             <FarPoint:MenuItem Text="菜單一">
             </FarPoint:MenuItem>
             <FarPoint:MenuItem Text="菜單二">
             </FarPoint:MenuItem>
             <FarPoint:MenuItem Text="菜單三">
             </FarPoint:MenuItem>
         </Items>
     </FarPoint:ContextMenu>
</ContextMenus>

C#代碼:

if (this.IsPostBack) return;

FpSpread1.EnableContextMenu = true;

//創建普通單元格菜單

FarPoint.Web.Spread.ContextMenu viewportMenu = FpSpread1.ContextMenus[FarPoint.Web.Spread.ContextMenuType.Viewport];

FarPoint.Web.Spread.MenuItem customViewportItem = new FarPoint.Web.Spread.MenuItem("二級菜單");

customViewportItem.ChildItems.Add(new FarPoint.Web.Spread.MenuItem("二級菜單項一"));

customViewportItem.ChildItems.Add(new FarPoint.Web.Spread.MenuItem("二級菜單項二"));

viewportMenu.Items.Add(customViewportItem);

//創建行頭單元格菜單

FarPoint.Web.Spread.ContextMenu rowHeaderContextMenu = new FarPoint.Web.Spread.ContextMenu();

rowHeaderContextMenu.Type = FarPoint.Web.Spread.ContextMenuType.RowHeader;

FarPoint.Web.Spread.MenuItem rowHeaderItem = new FarPoint.Web.Spread.MenuItem("行頭菜單");

rowHeaderItem.ChildItems.Add(new FarPoint.Web.Spread.MenuItem("菜單一"));

rowHeaderItem.ChildItems.Add(new FarPoint.Web.Spread.MenuItem("菜單二"));

rowHeaderContextMenu.Items.Add(rowHeaderItem);

FpSpread1.ContextMenus.Add(rowHeaderContextMenu);

clip_image004

更多新特性請參考在線演示實例:

http://www.gcpowertools.com.cn/LiveSamples/Spread/ASPNET/sampleexplorer/samples/ContextMenu/Overview.aspx

列頭RowTemplate

Spread for ASP.NET中為RowTemplate新增了新的列頭模板,這樣,列頭單元格可以擁有與數據行完全不同的布局風格。您可以改變傳統的Spread布局方式,將一條數據展示在多行中。多行布局由行模板控制,行模板可以通過代碼或者Spread設計器定制。

在本篇文章中,我們將闡述如何使用代碼添加行模板布局,已經綁定表格控件 Spread 數據源。

clip_image005

一、我們可以通過 WorksheetTemplate 實現行模板布局。

首先需要設置目標表單的模板為行布局模板:

sheet.LayoutMode = FarPoint.Web.Spread.SheetView.LayoutModeType.RowTemplateLayoutMode;

然后,設置行布局模板:

//設置行布局模板

sheet.WorksheetTemplate.ColumnCount = 4;

sheet.WorksheetTemplate.RowTemplate.RowCount = 2;

sheet.WorksheetTemplate.ColumnHeaderTemplate.RowCount = 1;

sheet.WorksheetTemplate.LayoutColumns[0].Width = 100;

sheet.WorksheetTemplate.LayoutColumns[1].Width = 100;

sheet.WorksheetTemplate.LayoutColumns[2].Width = 70;

sheet.WorksheetTemplate.LayoutColumns[3].Width = 300;

最后,我們需要設置數據源字段在行模板中的顯示順序。

//設置行布局模板中顯示數據字段順序

sheet.WorksheetTemplate.LayoutCells[0, 0].DataIndex = 1;

sheet.WorksheetTemplate.LayoutCells[0, 1].DataIndex = 2;

sheet.WorksheetTemplate.LayoutCells[1, 0].DataIndex = 3;

sheet.WorksheetTemplate.LayoutCells[0, 2].DataIndex = 6;

sheet.WorksheetTemplate.LayoutCells[0, 3].DataIndex = 4;

sheet.WorksheetTemplate.LayoutCells[1, 3].DataIndex = 5;

二、設置 Spread 數據源:

//從數據源中取數據

DataTable employees = new DataTable("Employees");

using (OleDbConnection connection = new OleDbConnection(@"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=|DataDirectory|\Northwind.mdb;Persist Security Info=True"))

{

     using (OleDbDataAdapter adapter = new OleDbDataAdapter("SELECT EmployeeID, FirstName, LastName, Title, Address, HomePhone FROM Employees", connection))

     {

         adapter.Fill(employees);

     }

}

employees.Columns.Add(new DataColumn("Photo"));

//通過 FpSpread 類下 DataSource 屬性設置數據源

FpSpread1.DataSource = employees;

更多新特性請參考在線演示實例:

http://www.gcpowertools.com.cn/LiveSamples/Spread/ASPNET/sampleexplorer/samples/RowTemplateLayout/Overview.aspx

用於單元格編輯器的Css

在表格控件 Spread for ASP.NET 7 之前, 我們無法設置單元格在編輯模式下的格式。直到用戶點擊“更新按鈕”時單元格內容才會被格式化。現在, V7 中新增 “編輯格式化支持” 允許用戶定制編輯格式如數值格式或日期格式,這無疑增強了用戶體驗度。

clip_image006

下面我們將闡述如何設置單元格的“編輯格式”。

通過Spread for ASP.NET 的EditorCssClass屬性可以設置可編輯的單元格類型。通過Css代碼設置單元格類型編輯器的樣式。它獨立於通過CssClass屬性定制的單元格顯示模式。

通過各個單元格類型的 EditMode 屬性可以設置表格控件的 Spread 編輯格式。這里我們以 CurrencyCellType 為例。

首先設置單元格類型,代碼如下:

//設置單元格類型

FarPoint.Web.Spread.CurrencyCellType cct = new FarPoint.Web.Spread.CurrencyCellType();

cct.NumberFormat = new System.Globalization.NumberFormatInfo();

cct.NumberFormat.CurrencySymbol = "USD";

這是我們雙擊編輯該單元格會發現,單元格進入編輯狀態后格式消失了:

clip_image007

然后,設置單元格類型編輯模式:

//設置單元格類型的編輯格式

cct.EditMode.NumberFormat = new System.Globalization.NumberFormatInfo();

cct.EditMode.NumberFormat.CurrencySymbol = "$";

效果圖如下:

clip_image008

以上即為 Spread for ASP.NET 7 新特性-編輯格式。

更多新特性請參考在線演示實例:

http://www.gcpowertools.com.cn/LiveSamples/Spread/ASPNET/sampleexplorer/samples/EditModeFormat/Overview.aspx

性能提升

· 新增LoadOnDemandMode屬性用於支持在用戶滾動到最后一行之前通過后台加載數據。新增TriggerMode屬性用於支持定時加載和越界加載。

· 提升了渲染表格、PDF以及導入Excel文件的性能。

· 提升了客戶端滾動性能,通過后台按需加載數據並觸發新的客戶端事件。

· 增強了虛擬滾動,它可以在加載新的數據行時保持來自前一頁面的額外數據。

· 支持異步渲染圖表。

· 通過合並JS和CSS優化腳本加載時間。

· 使用平行任務庫實現了關鍵性能的提升。

clip_image010

更多有關Spread Studio for .NET產品細節請參考:http://www.gcpowertools.com.cn/products/Spread_Studio.htm

試用版下載:下載鏈接

 

 

相關閱讀:

Spread for Windows Forms 7新功能使用指南

Spread Studio 10.0v1 發布

SpreadJS 10.0v1 發布

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM