MVC模式ppt課件

1、MVC體系結(jié)構(gòu)模式,1,MVC體系結(jié)構(gòu)模式,教學(xué)目標(biāo): 掌握MVC模式的概念 熟練掌握MVC模式的語(yǔ)境、問(wèn)題與解決方案 掌握MVC模式的結(jié)構(gòu)與實(shí)現(xiàn) 教學(xué)重點(diǎn): 掌握MVC模式的概念及其語(yǔ)境、問(wèn)題與解決方案 教學(xué)難點(diǎn): 熟練掌握MVC模式的語(yǔ)境、問(wèn)題與解決方案,2,交互式系統(tǒng),系統(tǒng)與用戶的交互:主要通過(guò)GUI 目的:增強(qiáng)可用性 主要挑戰(zhàn):保持功能內(nèi)核獨(dú)立于用戶接口 UI的易變性:“式樣和感覺(jué)”、適應(yīng)客戶業(yè)務(wù)過(guò)程。,3,交互式系統(tǒng),兩種模式，為交互式軟件系統(tǒng)提供基本的結(jié)構(gòu)化組織。 MVC（Model-View-Controller) 將一個(gè)交互式應(yīng)用程序分為三個(gè)組件 PAC (Presentati

2、on-Abstraction-Control) 以合作agent的層次形式定義了交互式軟件系統(tǒng)的一種結(jié)構(gòu)。,4,模型-視圖-控制器(MVC)模式,該模式將一個(gè)交互式應(yīng)用程序分成3個(gè)組件. 模型：包含核心功能和數(shù)據(jù)。 視圖：向用戶顯示信息。 控制器：處理用戶輸入。 視圖和控制器組成了用戶接口。 變更-傳播機(jī)制保證了模型和用戶接口之間的一致性。,5,Example of MVC,Figure1 Information System for Political Selection,6,語(yǔ)境,具有靈活人-機(jī)接口的交互式應(yīng)用程序。 可以靈活選擇不同的信息顯示方式。 可以靈活選擇用戶的輸入方式。,7,問(wèn)題

3、(1),關(guān)于用戶接口的需求尤其易變。 輸入方式的改變，顯示方式的改變， 不同的用戶期望不同的用戶界面。即使對(duì)于同一個(gè)應(yīng)用，也可能需要集成多種用戶界面。 如果把用戶接口和功能內(nèi)核捆綁在一起，難以得到用戶界面的靈活特性。,8,問(wèn)題(2),考慮以下強(qiáng)制條件 同一個(gè)信息可以在不同的地方有不同的表示。 應(yīng)用程序的顯示和動(dòng)作必須立即反映出對(duì)數(shù)據(jù)的操作。 用戶的接口易于改變，甚至在運(yùn)行時(shí)可也可以改變。 支持不同的“式樣和感覺(jué)”標(biāo)準(zhǔn)，或者移植用戶接口不應(yīng)影響應(yīng)用程序內(nèi)核的代碼。,9,解決方案（1）,將應(yīng)用程序分成三個(gè)部分：處理、輸出和輸入 模型組件：封裝了內(nèi)核數(shù)據(jù)和功能。模型獨(dú)立于特定輸出表示或者輸入方式。

4、視圖組件向用戶顯示信息。視圖從模型獲得數(shù)據(jù)。一個(gè)模型可能有多個(gè)視圖。 每個(gè)視圖有一個(gè)相關(guān)的控制器組件?？刂破鹘M件接受輸入，通常將鼠標(biāo)Move、Click或鍵盤Type等用戶輸入翻譯成為對(duì)視圖或者模型的服務(wù)請(qǐng)求。 用戶僅僅通過(guò)控制器與系統(tǒng)交互。,10,解決方案（2）,一個(gè)模型可以有多個(gè)視圖。 如果用戶通過(guò)一個(gè)視圖的控制器改變了模型，那么依賴于該數(shù)據(jù)的其他視圖也應(yīng)該反映出這樣的變化。 一旦模型的數(shù)據(jù)發(fā)生了變化，模型需要通知所有相關(guān)的視圖做出相應(yīng)的變化。 這樣的方式可以通過(guò)出版者-訂閱者設(shè)計(jì)模式完成。,11,結(jié)構(gòu)（1）,模型組件包含了應(yīng)用程序的功能內(nèi)核。 封裝了相應(yīng)的數(shù)據(jù)并輸出執(zhí)行特定應(yīng)用程序處理的

5、過(guò)程。 控制器代表用戶調(diào)用這些過(guò)程。 模型也提供訪問(wèn)它封裝的數(shù)據(jù)的函數(shù)，這些函數(shù)可以由視圖組件使用。,12,結(jié)構(gòu)（2）,變更-傳播機(jī)制 維護(hù)了一個(gè)模型中相依組件的注冊(cè)表。 所有視圖還有一些控制器在這個(gè)表中登記了對(duì)變更通知的需求。 模型狀態(tài)的改變將觸發(fā)變更-傳播機(jī)制。每個(gè)在表中登記的視圖和控制器都會(huì)收到變更通知。 變更-傳播機(jī)制是模型與視圖、控制器之間的唯一連接。,13,結(jié)構(gòu)（3）,視圖組件向用戶呈現(xiàn)信息 不同的視圖用不同的方法呈現(xiàn)信息。 每個(gè)組件都有一個(gè)更新函數(shù)。這個(gè)函數(shù)被模型變更通知激活。 這個(gè)函數(shù)被激活（此時(shí)模型已經(jīng)改變）后，將使得視圖重新和模型一致。 在初始化階段，視圖向模型登記請(qǐng)求變更

6、通知。每個(gè)視圖將創(chuàng)建一個(gè)合適的控制器。,14,結(jié)構(gòu)（4）,控制器組件接受作為事件的用戶輸入。 事件如何發(fā)送到控制器由用戶界面平臺(tái)決定。 事件被翻譯成為對(duì)模型或者視圖的請(qǐng)求。 如果控制器的行為依賴于模型的狀態(tài)，那么控制器也需要向模型登記請(qǐng)求變更通知。例如：模型的改變使一個(gè)菜單輸入能用或禁用時(shí)。,15,結(jié)構(gòu)（5）,Figure 2 Class diagram of Political Selection,16,動(dòng)態(tài)特征（1）,場(chǎng)景 用戶輸入導(dǎo)致模型變化，并觸發(fā)變更-傳播機(jī)制。 控制器接受到事件，解釋事件并且啟動(dòng)模型的服務(wù)過(guò)程。 模型執(zhí)行相應(yīng)的過(guò)程，并導(dǎo)致內(nèi)部狀態(tài)的變化。 模型調(diào)用其更新過(guò)程，向所有

7、登記請(qǐng)求了變更-傳播機(jī)制的視圖和控制器發(fā)出通知。 每個(gè)視圖從模型中讀取新數(shù)據(jù)并且重新顯示。 每個(gè)控制器修改自己的行為，比如禁用某個(gè)功能。 最初的控制器恢復(fù)控制并從事件處理過(guò)程返回。,17,動(dòng)態(tài)特征（2）,用戶輸入導(dǎo)致模型變化，并觸發(fā)變更-傳播機(jī)制的過(guò)程,18,動(dòng)態(tài)特征（3）,場(chǎng)景初始化過(guò)程 創(chuàng)建模型實(shí)例，并初始化其數(shù)據(jù)。 創(chuàng)建視圖對(duì)象，并用對(duì)模型的引用作為其初始化參數(shù)之一。 視圖通過(guò)調(diào)用附屬過(guò)程支持變更-傳播機(jī)制。 視圖創(chuàng)建控制器，此時(shí)將模型和視圖的引用作為參數(shù)傳遞給控制器初始化過(guò)程。 控制器通過(guò)調(diào)用附屬過(guò)程來(lái)支持變更-傳播機(jī)制。 初始化完成，應(yīng)用程序開(kāi)始處理事件。,19,動(dòng)態(tài)特征（4）,MV

8、C系統(tǒng)的初始化過(guò)程,Main prog.,Model,View,Controller,initialize,view,model,view,start,Model,attach,makeController,initialize,attach,controller,20,實(shí)現(xiàn)（1）,將人機(jī)交互從核心功能中分離出來(lái) 設(shè)計(jì)模型組件來(lái)封裝內(nèi)核所需要的數(shù)據(jù)和功能。 提供訪問(wèn)待顯示數(shù)據(jù)的功能。 確定模型功能的哪一部分應(yīng)該通過(guò)控制器向用戶展示。,21,實(shí)現(xiàn)（1）,class Model List votes; List parties; public: Model(List partyNames); /

9、access interface for modification by controller void clearVotes(); /set voing values to 0 void changeVote(String party, long vote); / factory functions for view access to data Iterator makeVoteIterator() return Iterator(votes); Iterator makePartyIterator() return Iterator(parties); /.to be continued

10、 ,22,實(shí)現(xiàn)（2）,實(shí)現(xiàn)變更-傳播機(jī)制 采用出版者-訂閱者設(shè)計(jì)模式。 模型組件作為出版者，視圖和控制器作為訂閱者。 提供過(guò)程，使得視圖和控制器可以自由訂閱和退定通知。 模型的過(guò)程如果改變了狀態(tài)，那么需要通知每個(gè)訂閱者。 在有些框架軟件中，這個(gè)機(jī)制已經(jīng)被隱含實(shí)現(xiàn)了。,23,class Observer common ancestor for view and controller public: virtual void update() /default is no-op ; class Model /.continued public: void attach(Observer *s) r

11、egistry.add(s); void detach(Observer *s) registry.remove(s); protected: virtural void notify(); private: Set registry; ; void Model:notify() /call update for all observers Iterator iter(registry); while(iter.next() iter.curr()-update(); ,24,實(shí)現(xiàn)（3）,設(shè)計(jì)并實(shí)現(xiàn)視圖 設(shè)計(jì)視圖的外觀，并實(shí)現(xiàn)畫圖過(guò)程來(lái)將視圖顯示在屏幕上（需要使用用戶界面平臺(tái)的功能）。 實(shí)現(xiàn)更

12、新過(guò)程來(lái)反映模型的變化。 可以簡(jiǎn)單地調(diào)用畫圖功能，但是不適應(yīng)模型頻繁變化的情況。 向更新過(guò)程提供一些參數(shù)來(lái)確定是否重畫，以及重畫范圍。 可以通過(guò)累積變化的方式減少重畫的頻率。 還需要實(shí)現(xiàn)視圖的初始化過(guò)程。 支持變更-傳播機(jī)制；初始化控制器。,25,class view: public Observer public: View(Model *m) : myModel(m), myController(0) myModel-attach(this); virtual View() myModel-detach(this); virtual void update() this-draw(); /

13、abstract interface to be redefined: virtual void initialize(); /see below virtual void draw();/ (re-) display view /.to be continued below Model *getModel() return myModel; Controller *getController() return myController; protected: Model*myModel; Controller*myController;/ set by initialize ; class

14、BarChartView :public View public: BarChartView (Model *m) : View(m) virtual void draw(); ; void BarChartView:draw() /.to be continued ,26,實(shí)現(xiàn)（4）,設(shè)計(jì)并實(shí)現(xiàn)控制器 對(duì)于每個(gè)視圖，指定回應(yīng)用戶動(dòng)作的系統(tǒng)行為。 控制器用一個(gè)專用的過(guò)程來(lái)接受并且解釋這些用戶動(dòng)作（事件）。 可以考慮使用command設(shè)計(jì)模式來(lái)隔離模型和控制器之間的聯(lián)系。,27,實(shí)現(xiàn)（4）,class Controller : public Observer public: virtual vo

15、id handleEvent(Event *) /default = no op Controller( View *v) : myView(v) myModel = myView-getModel(); myModel-attach(this); virtual Controller() myModel-detach(this); virtual void update() protected: Model*myModel; View*myView; ;,28,實(shí)現(xiàn)（5）,設(shè)計(jì)并實(shí)現(xiàn)視圖-控制器關(guān)系 視圖在其初始化期間創(chuàng)建和它關(guān)聯(lián)的控制器。 可以考慮使用工廠方法(factory method

16、)設(shè)計(jì)模式來(lái)建立視圖和控制器的類層次結(jié)構(gòu)。,29,class view: public Observer public: / C+ deficit: use initialize to call right factory method virtual void initialize() myController = makeController(); virtual Controller *makeController() return new Controller(this); ; class TableController : public Controller public: Tabl

17、eController(TableView *tv) : Controller(tv) virtual void handleEvent(Event *e) / . interpret event e / for instance, update votes of a party if(vote ,30,實(shí)現(xiàn)（6）,實(shí)現(xiàn)MVC的總體的初始化部分 首先初始化模型。 創(chuàng)建和初始化視圖。 初始化之后進(jìn)入一個(gè)循環(huán)，或者包含循環(huán)的過(guò)程。 在MFC中使用AppWizard時(shí)，這個(gè)部分通常已經(jīng)被實(shí)現(xiàn)了。,31,實(shí)現(xiàn)（6）,main() / initialize model List parties;part

18、ies.append(black); parties.append(blue );parties.append(red ); parties.append(green);parties.append(oth. ); Model m(parties); /initialize views TableView *v1 = new TableView( /now start event processing .,32,實(shí)現(xiàn)（7）,創(chuàng)建動(dòng)態(tài)視圖 如果應(yīng)用程序允許動(dòng)態(tài)打開(kāi)和關(guān)閉視圖，那么可以提供用來(lái)管理這些視圖的組件。 該組件可以在最后一個(gè)視圖被關(guān)閉的時(shí)候終止程序。,33,實(shí)現(xiàn)（8）,可插入的控制器 視

19、圖和控制器之間可以分離來(lái)支持一個(gè)視圖不同控制器的組合。 這種靈活性可以用來(lái)實(shí)現(xiàn)操作的不同模式。 可以靈活地將一個(gè)新的輸入輸出設(shè)備和應(yīng)用程序加入到一起。,34,class View : public Observer / . continued public: virtual controller *setController(Controller *ctlr); ; main() /. / exchange controller delete v1-setController( new Controller(v1); / this one is read only / . /open anot

20、her read-only table view; TableView *v3 = new TableView( / make v3 read-only / continue event processing / . ,35,實(shí)現(xiàn)（9）,層次化視圖和控制器的基礎(chǔ)結(jié)構(gòu) 一個(gè)用戶界面可以依靠預(yù)先定義好的視圖的對(duì)象來(lái)構(gòu)建。 可以考慮組合(composite)設(shè)計(jì)模式來(lái)實(shí)現(xiàn)這樣的處理。 當(dāng)有多個(gè)控制器的時(shí)候，可以考慮職責(zé)鏈(Chain of Responsibility)設(shè)計(jì)模式來(lái)處理。,36,實(shí)現(xiàn)（10）,進(jìn)一步去除系統(tǒng)依賴性 可以考慮建立一個(gè)視圖類和控制器類的集合，希望這些類的實(shí)現(xiàn)是平臺(tái)無(wú)關(guān)的。 可以考慮使用橋接(Bridge)模式，在這些類和基礎(chǔ)平臺(tái)軟件