在Orchard中寫一個(gè)Widget案例是本文要介紹的內(nèi)容，本文在以前所創(chuàng)建的產(chǎn)品模塊基礎(chǔ)上，擴(kuò)展了一個(gè)可以顯示***發(fā)布產(chǎn)品的Widget。通過此示例講解Widget的一些相關(guān)概念和開發(fā)Widget的基本步驟。關(guān)于產(chǎn)品模塊示例的介紹請點(diǎn)擊這里。

什么是Widget

Widget就是小部件的意思。是一個(gè)可重用的UI塊，它可以部署到網(wǎng)站的任意區(qū)域（Zone）中。如網(wǎng)頁上常見的標(biāo)簽云、快速搜索，***博文，博文日歷等等這些都可以做成小部件的形式來豐富頁面的布局。

需求分析

本例要實(shí)現(xiàn)一個(gè)能在首頁顯示***發(fā)布的N條產(chǎn)品的功能。根據(jù)這個(gè)需求，我們至少需要有兩個(gè)畫面來完成這個(gè)功能，一是在添加Widget的時(shí)候可以設(shè)置顯示***的條數(shù)的畫面，另外一個(gè)就是顯示***N條產(chǎn)品的畫面。

創(chuàng)建內(nèi)容部件

首先我們需要創(chuàng)建一個(gè)內(nèi)容部件。因?yàn)樵贠rchard中內(nèi)容的組織都是以內(nèi)容部件為單位的，Widget也不例外。這個(gè)內(nèi)容部件需要完成以下功能：

1、存取***顯示條數(shù)的設(shè)置；

2、顯示***N條數(shù)據(jù)。

和以前創(chuàng)建產(chǎn)品內(nèi)容部件一樣，我們需要創(chuàng)建一個(gè)數(shù)據(jù)模型（RecentProductsPartRecord），用于存儲***顯示條數(shù)的設(shè)置。還需要創(chuàng)建一個(gè)RecentProductsPart，同時(shí)還需要創(chuàng)建這個(gè)part的處理器（RecentProductsPartHandler）和驅(qū)動器（RecentProductsPartDriver），也當(dāng)然需要創(chuàng)建這個(gè)Part的編輯視圖和顯示視圖，同時(shí)我們也需要在Placement.info文件中注冊新添加部件的一些信息。

這些步驟和代碼都類似于創(chuàng)建產(chǎn)品部件時(shí)的代碼，大家可以在本示例代碼下載中查看。有一點(diǎn)需要注意的是這個(gè)部件的顯示并不是顯示***N條的設(shè)置，而是需要顯示***N條產(chǎn)品。

將內(nèi)容部件轉(zhuǎn)成一個(gè)Widget

要將內(nèi)容部件定義為一個(gè)Widget，需要在數(shù)據(jù)庫安裝文件中指定相應(yīng)的代碼來實(shí)現(xiàn)。我們打Migrations.cs文件，在原有的基礎(chǔ)上添加一個(gè)UpateFrom1的方法表示這個(gè)模塊需要升級，輸入以下代碼：

public int UpdateFrom1()  
        {  
            //創(chuàng)建一個(gè)表存儲設(shè)置***多少條數(shù)據(jù)  
            SchemaBuilder.CreateTable("RecentProductsPartRecord", table => table  
                .ContentPartRecord()                              
                .Column<int>("Count")                        //產(chǎn)品價(jià)格  
            );  
 
            //定義一個(gè)Widget  
            ContentDefinitionManager.AlterTypeDefinition("RecentProducts", cfg => cfg  
                .WithPart("RecentProductsPart")  
                .WithPart("WidgetPart")  
                .WithPart("CommonPart")  
                .WithSetting("Stereotype", "Widget"));  
 
            return 2; 

在定義一個(gè)Widget的時(shí)候需要結(jié)合需要變成Widget的部件和WidgetPart部件以及CommonPart部件，并且需要設(shè)置此類型的屬性為Widget。

部署Widget

通過上面幾個(gè)簡單的步驟，一個(gè)Widget就完成了。首先我們用管理登錄管理后臺，一進(jìn)入后臺我們就可以看見有模塊需要升級的提醒。

點(diǎn)擊升級產(chǎn)品模塊

升級完成后進(jìn)入控制后臺的Widgets菜單，并選擇當(dāng)前層為TheHomePage（表示只在首頁顯示），然后在AsideFirst上點(diǎn)擊添加。選擇我們剛剛創(chuàng)建的RecentProducts小部件。

Title屬性是小部件的標(biāo)題，我們可以輸入RecentProducts，Count屬性就是需要顯示的記數(shù)了，我們輸入2。保存后回到前臺網(wǎng)站的首頁就能看見效果了。

小結(jié)：在Orchard中寫一個(gè)Widget案例的內(nèi)容介紹完了，希望通過Widget應(yīng)用內(nèi)容的學(xué)習(xí)能對你有所幫助！