套版組件使用指南

一、組件

1、表格

表格控制項是由行和列組成的資料控制項。新添加到設計區頁面的表格預設為三行三列,三行代表表格的三個功能區域:表頭區域、明細區域、表尾區域,而每個儲存格中包含一個文字方塊元件。

首行代表表頭區域,用於顯示表格的標題列目,可以自行輸入,也可以在綁定資料欄位時,由系統自動設定為欄位的名稱。
第二行代表明細區域,用於顯示資料。生成報表時,系統會根據資料集的記錄條數,自動生成為多行。
末行代表表尾區域,一般用於顯示合計、報表備註等資訊,可以自行輸入。

操作步驟:

(1)添加表格元件

在左側工具箱中,透過按一下或拖拽,將表格元件添加到設計區域。

(2)新增行/列數

選中儲存格,按一下滑鼠右鍵,根據需要進行行/列的新增、刪除操作。

(3)綁定數據

選中表格明細區域的儲存格,按一下右側的小方塊按鈕,然後在下拉清單中選擇資料集的欄位進行資料綁定。完成資料綁定後,報表生成時會根據所綁定的資料進行自動擴展。
也可從右側資料綁定面板中,拖拽資料集中的欄位放進表格。

(4)添加運算式

可以透過以下兩種方法打開運算式編輯器:
選中表格儲存格,① 按一下滑鼠右鍵,選擇【表達式】

② 在右側屬性設定面板中,找到常規選項->資料,點擊欄位元右邊的小方塊,選擇【表達式】

在彈出的表達式編輯器視窗中,從左側清單中按兩下添加,或在文字方塊內直接輸入表達式,也可在右上角的[查找]框內快速搜索。

(5)合併儲存格

選中儲存格,透過按住滑鼠左鍵進行拖拽框選(或按住鍵盤Ctrl鍵,用滑鼠逐一點擊選擇),連續選中同一行的多個儲存格,進而點擊滑鼠右鍵,在彈出的功能表中選擇儲存格->合併儲存格。

 

如果選中的多個儲存格有不同的內容,則合併後只會保留第一個選中的儲存格內容。

 

拆分儲存格
選中已合併的儲存格,點擊滑鼠右鍵,在彈出的功能表中選擇儲存格->拆分儲存格。

(6)拓展顯示區域

點擊灰色按鈕拓展表格顯示區域,灰色區域為一頁中表格資料自動擴展時可顯示的範圍。

示例:

①表頭區域設為列儲存格的標題;

② 在明細區域,第一列使用運算式{RowNumber()}來顯示表格明細區域的行序號,其餘列分別綁定資料集中的欄位;

③在表尾區域的[數量]列處,使用計算數值總和的Sum函數運算式。

設計頁面:

④預覽效果:

2、矩表

矩表控制項用來顯示按行和列進行分組的資料匯總,行和列都可根據所綁定欄位的資料進行自動擴展。
矩表分為表角區域、行/列分組儲存格、資料區域四個部分。

表角區域:用於顯示表格中固定不變的標題等資訊。可自行輸入,也可綁定資料集中的資料欄位。
行/列分組儲存格:用於綁定行分組欄位和列分組欄位。實際生成報表時,系統會根據所綁定的資料集中的欄位進行擴展。
資料區域:用於綁定和顯示資料。實際生成報表時,會根據行分組和列分組進行統計顯示,每個資料都是同時滿足所在行分組和列分組的交叉統計資料。

操作步驟:

(1)添加矩表組件

在左側工具箱中,透過按一下或拖拽,將矩表元件添加到設計區域。

(2)配置矩表設計嚮導 在彈出的矩表設計嚮導視窗中,根據需要拖動資料集中的欄位到列分組、行分組、數值區域中,完成後點擊確定。

也可在關閉設計嚮導後,選中矩表儲存格,按一下矩表右上角的齒輪按鈕,再次打開矩表嚮導。

如以下例子所示,

①將列分組綁定[貨品名稱]欄位,行分組綁定[貨品特徵]欄位;

②資料區域綁定[數量]欄位;

③勾選[顯示行分組總計]和[顯示列分組總計];

④在表角區域添加容器元件,設計表角細節。

⑤設計頁面:



⑥預覽效果:

3、圖表

圖表控制項以圖形的形式顯示資料,有多種圖表類型供使用者進行選擇。
操作步驟:

(1)添加圖表元件

在左側工具箱中,透過按一下或拖拽,將圖表元件添加到設計區域。

(2)配置嚮導

在彈出的圖表創建嚮導視窗中,選擇資料集和圖表類型->數據綁定和設定->預覽效果並調整外觀。

①選擇資料集和圖表類型,完成後點擊【下一步】。

也可在關閉嚮導視窗後,在右側屬性設定面板,修改圖表類型。

②綁定數值欄位、分類欄位以及子類欄位,點擊欄位欄的小方塊綁定資料集中的欄位,完成後點擊【下一步】。

數值欄位:表示按什麼欄位進行顯示數值的大小。

分類欄位:表示資料按什麼欄位進行分類顯示。

子類欄位:設定圖表的其他子類欄位的綁定欄位、分組方式以及排序等。

也可在關閉嚮導視窗後,在右側資料綁定面板中,將欄位分別拖拽至對應的區域進行綁定。

③預覽效果並調整外觀,點擊【完成】。

(3)詳細設定

詳細設定-明細:即每個分類下細分為哪些子系列;

詳細設定-顏色:即顏色按哪個欄位劃分,綁定後將顯示圖例;

詳細設定-文本:即圖表內每個資料以什麼欄位顯示文字。

示例:

①圖表類型設為橫條圖;

②資料欄位綁定[數量]欄位,分類欄位綁定[貨品名稱]欄位;

③在詳細設定中,將文本與[數量]欄位相綁定。

④設計頁面:

⑤預覽效果:

4、文字方塊

文字方塊控制項可用於自訂輸入文字,也可用於顯示資料。

操作步驟:

(1)添加文字方塊組件
在左側工具箱中,透過按一下或拖拽,將文字方塊元件添加到設計區域。

(2)設定內容

可直接在文字方塊內輸入文本,也可點擊文字方塊內右側的小方塊按鈕,選擇資料集或內建資料中的欄位進行綁定。還可以在文字方塊中使用運算式,在文字方塊內按一下滑鼠右鍵,選擇【運算式】。

示例:

①添加一個文字方塊,輸入報表標題[採購單],並設定相應文字屬性;

②添加多個文字方塊,輸入相應單據資訊,並從右側資料綁定面板中,拖拽相應資料欄位放入設計區域。

③設計頁面:

④預覽效果:

5、圖片

圖片控制項用於圖片的插入和展示,可插入共用圖片、內嵌圖片和資料庫圖片。

操作步驟:

(1) 添加圖片元件

在左側工具箱中,透過按一下或拖拽,將圖片元件添加到設計區域。

(2) 設定內容

在右側屬性設定面板中,按一下【圖片】欄位元,選擇所需圖片,並設定大小、位置等。

6、列表

清單控制項是一種容器性質的報表元素。清單區域內可以放置其他的報表元件,它會根據所綁定的資料集中的欄位資料來重複地顯示清單區域內的控制項。

操作步驟:

(1) 添加清單組件

在左側工具箱中,透過按一下或拖拽,將清單元件添加到設計區域。

(2) 添加數據

將其他控制項拖拽至清單中。
以圖形+文字方塊為例:

 

7、帶狀列表

帶狀清單控制項由頭部、明細區、尾部三個區域組成。明細區的控制項會根據資料行數重複。頭部和尾部只渲染一次,可分別用於顯示標題和總計。

操作步驟:

(1) 添加帶狀清單組件
在左側工具箱中,透過按一下或拖拽,將帶狀清單元件添加到設計區域。

(2) 添加數據

將資料集中的欄位或其他元件拖至頭部、明細區、尾部進行綁定。
如以下例子所示:

①在頭部區域中,插入文字方塊用於顯示[單據號碼];

② 在明細區中,插入表格,插入相應資料欄位;

③ 在尾部區域中,插入文字方塊用於顯示[預出庫日]和[數量總計]。

④設計頁面:

⑤預覽效果:

8、子報表

子報表控制項用來顯示其他報表的內容,可以從主報表中將參數傳遞給子報表以實現資料過濾。

操作步驟:

(1) 添加子報表元件
在左側工具箱中,透過按一下或拖拽,將子報表元件添加到設計區域。

(2) 設定內容
在右側屬性設定面板中,按一下報表名稱,選擇所需綁定的報表,並設定大小、位置等。

9、迷你圖

迷你圖控制項以一個較小的圖像來展示資料的趨勢,支援折線、柱形、盈虧、面積圖和堆積圖。迷你圖既可單獨使用,作為整個報表的一個獨立元素顯示某種資料趨勢;也可以嵌入到表格類元素的儲存格中,代替數位內容,以便更好地理解和分析業務資料。

操作步驟:

(1) 添加迷你圖組件

在左側工具箱中,透過按一下或拖拽,將迷你像素件添加到設計區域。

(2) 綁定數據
將資料集中的欄位分別拖至系列資料與分組條件處進行綁定。

也可選中迷你圖,在右側屬性設定面板中,選擇迷你圖類型和修改系列值、分組條件。

10、數據條

資料條控制項可以非常直觀的顯示資料大小,可以透過資料綁定和自行設定最大資料、目標資料等。

操作步驟:

(1) 添加資料條元件
在左側工具箱中,透過按一下或拖拽,將資料條元件添加到設計區域。

(2) 添加數據
將資料集中的欄位拖至實際資料和目標資料處進行綁定,也可在右側屬性設定面板中手動輸入數值。

11、條碼

條碼控制項用於生成各種一維碼或二維碼。

操作步驟:

(1) 添加條碼組件
在左側工具箱中,透過按一下或拖拽,將條碼元件添加到設計區域。

(2) 設定屬性

在右側屬性設定面板中,在“數值”處手動輸入或綁定資料欄位,在“條碼類型”裡選擇所需的條碼類型。

數值:用於設定條碼顯示的數值資料。

條碼類型:用於設定條碼的類型。

 

操作技巧:

常用條碼類型:

一維碼:Code 128 A, Code 128 B, Code 128 C, Code 128 Auto

Code 128 A: 表示大寫英文字母、數位、標點符號、控制字元組成的字串,如ABC123;

Code 128 B: 表示大小寫英文字母、數位、字元組成的字串,如A-01(B),Abc01;

Code 128 C: 表示純數位組成的字串,如01110527;

Code 128 Auto:表示根據資料內容自動選擇code 128 A/B/C,如無法確定字元內容,建議選該類型。

二維碼:QR Code

12、富文本

富文本控制項用於圖文混排的頁面,可針對不同的文本內容設定不同的格式。富文本接受HTML輸入,並支援合併列印功能。

操作步驟:

(1)添加富文本元件
在左側工具箱中,透過按一下或拖拽,將富文本元件添加到設計區域。

(2) 設定內容
在右側屬性設定面板中,設定HTML內容以及元件位置、大小等。

13、容器

容器控制項是其他項的容器,可以在容器內放置其他控制項。容器控制項不與具體的資料相關聯。當相鄰元件增長導致元件分開時,使用容器保持元件之間的關係;也可以當一個表格的儲存格內需要綁定多個內容時,拖入一個容器,即可在容器內添加多種元件進行綁定。

操作步驟:

(1) 添加容器組件
在左側工具箱中,透過按一下或拖拽,將容器元件添加到設計區域。

(2) 設定內容

將其他控制項拖拽到容器內。

如以下例子所示:

在矩表元件的表角區域中添加兩個文字方塊元件和一個線條元件,

①將容器組件添加到矩表的表角儲存格中;

②在容器中添加兩個文字方塊並設定文字方塊內的文本和樣式;

③在容器內添加一個線條元件,並調整角度和線條樣式。

④預覽效果:

14、線條

線條控制項用於顯示邊線、斜線等線段,或者高亮顯示報表特定區域的資料,不與具體的資料相關聯。

操作步驟:

(1) 添加線條組件

在左側工具箱中,透過按一下或拖拽,將線條元件添加到設計區域。

(2) 設定屬性

在右側屬性設定面板中,設定線條的粗細、顏色等屬性。

15、圖形

圖形控制項用於顯示一個控制項的邊界,或者高亮顯示報表中特定的區域。可選擇矩形、圓角矩形和橢圓。圖形不與具體的資料相關聯。

與容器不同的是,該控制項內不能放置其它控制項。

操作步驟:

(1) 添加圖形元件
在左側工具箱中,透過按一下或拖拽,將圖形元件添加到設計區域。

(2) 設定樣式

在右側屬性設定面板中,設定圖形樣式、大小、顏色等屬性。

16、核取方塊

核取方塊控制項一般由圖示和文字兩部分組成。

圖示可設定為“選中”或“不選中”兩種狀態;文字一般用來顯示自訂文本、資料集中的欄位或運算式。

操作步驟:

(1) 添加核取方塊組件
在左側工具箱中,透過按一下或拖拽,將核取方塊元件添加到設計區域。

(2) 設定內容

可以直接在核取方塊中輸入文本,也可以按一下核取方塊內的小方塊來選擇資料集中的欄位進行綁定,還可以點擊滑鼠右鍵使用運算式。

17、目錄

目錄控制項用於製作同一報表內的元件元素目錄。實際應用時,按一下目錄中的目錄項,即可跳轉到對應的元件元素處。

操作步驟:

(1) 添加目錄元件
在左側工具箱中,透過按一下或拖拽,將目錄元件添加到設計區域。

(2) 設定內容

目錄中顯示的內容來自於報表中其他元素屬性設定中的“標籤”選項,只有設定了標籤內容的元素,才會出現在目錄中。

如以下例子所示:

①添加一個目錄元件;

②添加一個表格元件,並將其屬性設定->其他選項->標籤 設為[單據-表格];

③添加一個圖表元件,並將其屬性設定->其他選項->標籤 設為[資料統計-圖表]。

④設計頁面:

⑤預覽效果:

18、內容溢出預留位置

內容溢出預留位置用來顯示表格、矩表和清單等資料區域元件中未能顯示出的資料,只能在頁面報表中使用。

操作步驟:

(1) 添加內容溢出預留位置元件
在左側工具箱中,透過按一下或拖拽,將內容溢出預留位置元件添加到設計區域。

(2) 設定連結

選中報表中的表格、矩表或清單等資料區域元件,在右側屬性設定面板中的“內容預留位置名稱”處,選擇內容預留位置的名稱。

設計頁面:

預覽效果:

19、輸入欄位

輸入欄位控制項為匯出的PDF報表中的可編輯欄位提供支援。

操作步驟:

(1) 添加輸入欄位元件
在左側工具箱中,透過按一下或拖拽,將輸入欄位元件添加到設計區域。

(2) 設定內容
在右側屬性設定面板中,設定類型、位置、大小等屬性。

二、工具列

剪下:刪除原有文本的基礎上將所選中的內容放入剪貼簿。
複製:在原有內容保持不變的基礎上,將所選中的內容放入剪貼簿。
貼上:將內容複製或剪切後移動到另一個位置。
刪除:將所選中的內容進行刪除操作。
字體:設定所選中的文本內容的字體型號。
字型大小:設定所選中的文本內容的字型大小大小。
字重:設定所選中的文本內容的字體粗細(普通/粗體)。
字形:設定所選中的文本內容的字形(普通/斜體)。
底線:設定所選中的文本內容的特殊效果(無/底線)。
顏色:設定所選中的文本內容的字體顏色。
背景色:設定所選中的文本內容的背景顏色。
左對齊:將所選的文本內容向文字方塊左邊對齊。
居中對齊:將所選的文本向文字方塊中間對齊。
右對齊:將所選的文本內容向文字方塊右邊對齊。
兩端對齊:將所選的文本內容向文字方塊左右兩邊對齊。
頂端對齊:將所選的文本內容向文字方塊頂端對齊。
垂直居中:將所選的文本內容向文字方塊上下兩邊對齊。
底端對齊:將所選的文本內容向文字方塊底部對齊。

返回頂端