DevExpress Reporting是.NET Framework下功能完善的報(bào)表平臺(tái)，它附帶了易于使用的Visual Studio報(bào)表設(shè)計(jì)器和豐富的報(bào)表控件集，包括數(shù)據(jù)透視表、圖表，因此您可以構(gòu)建無與倫比、信息清晰的報(bào)表。

DevExpress Reports — 跨平臺(tái)報(bào)表組件，允許用戶在針對(duì)任何基于.NET平臺(tái)的應(yīng)用程序中生成報(bào)表文檔，可部署在任何支持的操作系統(tǒng)上。在過去的幾個(gè)月里，官方技術(shù)團(tuán)隊(duì)一直專注于增強(qiáng)多個(gè)環(huán)境中的報(bào)表生成進(jìn)程，同時(shí)保持與主機(jī)操作系統(tǒng)本身的獨(dú)立性。在我們深入研究細(xì)節(jié)之前，先簡(jiǎn)單介紹一下Visual Studio Code，以及為什么選擇它而不是其他可用的替代品。

獲取DevExpress Reporting v23.1正式版下載

DevExpress技術(shù)交流群9：909157416      歡迎一起進(jìn)群討論

在過去的三年里，Visual Studio Code (VS Code)一直是全球開發(fā)者社區(qū)成員首選的IDE(這個(gè)結(jié)論是基于Stack Overflow開發(fā)者調(diào)查)。廣泛采用是我們選擇VS Code的一個(gè)原因，另一個(gè)是微軟最近關(guān)于的公告。

DevExpress Visual Studio Code報(bào)表設(shè)計(jì)器擴(kuò)展

VS Code報(bào)表設(shè)計(jì)器擴(kuò)展允許您在Visual Studio Code IDE中創(chuàng)建和編輯DevExpress報(bào)表文檔，在本文中，我們將指導(dǎo)您完成macOS上的安裝過程，并說明如何利用該擴(kuò)展的功能來開發(fā)和修改現(xiàn)有的報(bào)告。

注意：當(dāng)前DevExpress VS Code擴(kuò)展是社區(qū)技術(shù)預(yù)覽版(CTP)。

基于VS Code擴(kuò)展的技術(shù)

如果您在過去的Web應(yīng)用程序中加入了DevExpress Reporting工具，會(huì)發(fā)現(xiàn)DevExpress Web Report Designer（報(bào)表設(shè)計(jì)器）和VS Code擴(kuò)展之間的相似之處。

Web報(bào)表設(shè)計(jì)器是使用JavaScript實(shí)現(xiàn)的，服務(wù)器端邏輯在 .NET 中執(zhí)行。我們將這個(gè)設(shè)計(jì)器集成到Visual Studio Code中，允許后端在使用后端配置文件打開工作空間時(shí)安靜地運(yùn)行。當(dāng)您雙擊*. REPX (報(bào)表模板文件)，一個(gè)新的IDEdock面板呈現(xiàn)網(wǎng)頁(yè)與報(bào)表設(shè)計(jì)器，這個(gè)實(shí)現(xiàn)是基于.NET 7的，并且利用了我們基于sky的跨平臺(tái)繪圖引擎(允許您在IDE中預(yù)覽報(bào)表文檔)。

先決條件

下面是您需要在機(jī)器上執(zhí)行的DevExpress VS Code報(bào)表設(shè)計(jì)器相關(guān)的東西：

在本文的以下部分中，我們將使用Docker來展示運(yùn)行的結(jié)果。以示例項(xiàng)目的形式提供各種預(yù)配置的Dockerfiles：。我們創(chuàng)建這些Dockerfiles是為了解決開發(fā)和部署過程中的潛在挑戰(zhàn)，從這些文件創(chuàng)建的Docker容器在初始化期間安裝所有必要的本地庫(kù)。

要在VS Code中顯示文檔打印預(yù)覽，或者如果在本地macOS/Linux上開發(fā)/執(zhí)行報(bào)告，請(qǐng)確保在您的開發(fā)機(jī)器上安裝所有本地依賴項(xiàng)(在macOS上，您必須使用homebrew)：

• libicu
• libc
• fontconfit
• libjpeg

設(shè)置

下載擴(kuò)展并指定相關(guān)設(shè)置

一旦您確認(rèn)機(jī)器滿足所有先決條件：

• 在Visual Studio Code extensions選項(xiàng)卡中搜索擴(kuò)展來安裝它：

• 或者使用下面的Visual Studio Code市場(chǎng)鏈接來下載*. VSIX文件的DevExpress VS Code Report Designer Extension（報(bào)表設(shè)計(jì)器擴(kuò)展）：.，獲得文件后，打開VS Code并導(dǎo)航到extensions選項(xiàng)卡。單擊結(jié)束省略號(hào)圖標(biāo)來顯示其上下文菜單，然后選擇“Install from VSIX…”：

安裝擴(kuò)展后，單擊右下角的齒輪圖標(biāo)來修改設(shè)置：

1. 輸入您的
2. 選擇報(bào)表設(shè)計(jì)器可視主題(在此處查看可用主題列表：)。
3. 版本設(shè)置保持默認(rèn)值。

準(zhǔn)備好環(huán)境

注意：您可以使用自己的示例項(xiàng)目或在Visual Studio Code中打開一個(gè)空文件夾來測(cè)試功能。

我們將利用以下GitHub存儲(chǔ)庫(kù)用于演示目的：。按照本文的步驟，點(diǎn)擊F1，輸入git clone，并提供VS Code的存儲(chǔ)庫(kù)URL，將它復(fù)制到您的機(jī)器上。在Visual Studio Code中打開目錄(包含示例項(xiàng)目)后，將新的Reporting .config.json文件添加到其中，或者使用DX Reporting: Start Designer VS Code命令生成該文件。

擴(kuò)展在后端進(jìn)程啟動(dòng)之前讀取該文件的內(nèi)容，請(qǐng)參閱下面支持的報(bào)表設(shè)計(jì)器設(shè)置列表：

• DataBindingMode (Expressions | DataBindings | ExpressionsAdvanced) - 設(shè)置報(bào)表設(shè)計(jì)器數(shù)據(jù)綁定模式。
• SqlConnectionStrings - 定義可用的基于SQL的數(shù)據(jù)源集合，確保在連接字符串中使用XpoProvider前綴。
• JsonConnectionStrings - 定義可用JSON數(shù)據(jù)源的集合。
• ReportsDirectory - 存儲(chǔ)包含報(bào)表模板的目錄路徑。
• ReportUrlsMap - 存儲(chǔ)與報(bào)表模板文件關(guān)聯(lián)的報(bào)表名稱集合。

一個(gè)示例配置文件如下所示：

{
"DataBindingMode": "Expressions",
"SqlConnectionStrings":{
"Northwind_Connection": "XpoProvider=MSSqlServer;...."
},
"JsonConnectionStrings":{
"Nwind JSON Data": "Uri=nwind.json",
"Dummy 100 Users": "Uri=//dummyjson.com/users/"
},
"ReportsDirectory" : "PredefinedReports",
"ReportUrlsMap":{
"Report1": "Report1.repx",
"newReport": "newReport.repx"
}
}

將文件添加到打開的目錄后，重新打開VS Code以初始化報(bào)表設(shè)計(jì)器擴(kuò)展，或者手動(dòng)調(diào)用DX Reporting: Start Designer命令，IDE將通知您有關(guān)報(bào)表設(shè)計(jì)器初始化的信息。

在接下來的文章中我們將繼續(xù)介紹如何創(chuàng)建DevExpress報(bào)表及運(yùn)行實(shí)例應(yīng)用程序，請(qǐng)持續(xù)關(guān)注我們喲~