Component Based Software Engineering

Size: px

Start display at page:

Download "Component Based Software Engineering"

Holly Griffith
6 years ago
Views:

1 Component Based Software Engineering Masato Suzuki School of Information Science Japan Advanced Institute of Science and Technology 1 Schedule Mar :30-15:00 : 09. Introduction and basic concepts 15:10-16:40 : 10. Client side components(1) Mar :30-15:00 : 11. Client side components(2) 15:10-16:40 : 12. Server side components(1) Mar :30-15:00 : 13. Server side components(2) 15:10-16:40 : 14. Frameworks and middlewares Mar :30-14:00 : 15. State-of-the-art topics 2

2 #11 Client side components(2) Contents!! JavaBeans!!Delegation event model!!indirect connection by adapters!! MVC architecture style!! Examples 3 Application by JavaBeans JavaBeans are components mainly used for building clients in Java. They are!! based on introspection and serialization!! related to some visual image!! unit of applications/applets Reservation System Vacency in Single Twin OK JFrame/JApplet JLabel VacancyBean VacancyScrollBean VacancyContentsBe an JButton 4

3 Communication through Events!! Beans will interact through events, which notify!! mousemoved / mousepressed / keypressed etc.!! value of a property is changed!! Sender and receiver don't know each other, so we need a mechanism to pass the event. VacancyScrollBean Vacancy in 10 property: Month=10 create forward event when mouse is pressed at here event mouse pressed forward Adapter VacancyContentsBean Single Twin property: StartDay=10/20 increment StartDay by one when forward is received 5 Delegation event model!! A sender makes an event.!! A receiver is called through an eventlistener.!! An adapter will connect them indirectly. VacancyScrollBean Reservation System JButton JLabel JButton Vacancy in 10 pushed update pushed Single Twin Adapter changed update OK (adapters usually have no visuals) JLabel JLabel VacancyContentsBean JTable 6

4 Mechanisms for Delegation 1.! Listners are added to the source and the target to the action. 2.! The event is fired. 3.! The source broadcast the event to the all listeners. 4.! The listener who can accept the event will invoke the action corresponding to the event. 5.! The method in the target is called by the action. VacancyScrollBean ForwardEvent e... forward listener listeners L1 L2 L3 VacancyContentsBean incr action A1 A2 A3 target 7 Collaboration in classes!! Event source: class in which the event is fired!! Event target: class for which the event is sent!! Event listener: interface which must be implemented in the event target Source VacancyScrollBean addforwardlister() removefowardlister() fireforwardevent() e = new ForwardEvent(); forall l in listeners do l.forwardhappend(e); done (2)broadcase to all listeners listeners (0) add lister <<creates>> (1) create Event Object ForwardEvent getsource() s = e.getsource() // do operation ForwardListener ForwardHappend (forwardevent e) <<param>> Listener Target (VacancyContentsBean) ForwardHappend (forwardevent e) (3) perform operations 8

5 Role of Adapters!! Adapter works as event listener for the event source.!! Adapter works as action listener for the event target. Source Target VacancyScrollBean addforwardlister() removefowardlister() fireforwardevent() VacancyContentsBean StartDay: Date incrementstartday() addactionlistener(adp) 1:n relation might be allowed btwn source:target ActionListener actionperformed(e) ForwardListener ForwardHappend (forwardevent e) ForwardAdapter ForwardHappend (forwardevent e) target.incrementstartda y (e.getcount()) 9 Properties and Accessors Property is a value which shows status of Bean and read/write is allowed from the outside. Naming rule: Accessors of a property foo whose type is T must be as follows: getter : T getfoo() setter : setfoo(t foo) If you want to use other names, you have to specify them into the corresponding BeanInfo. public PropertyDescriptor[] getpropertydescriptor() { private Method getmethod = new Method( myget, beanclass); private Method setmethod = new Method( myset, beanclass); private PropertyDescriptor property = new PropertyDescriptor ( foo, getmethod, setmethod ); private static PropertyDescriptor[] pds = { property }: } return pds; 10

6 Notification of property change Using same mechanism to eventlisteners source VacancyContentsBean PropertyChangeSupport chg; addpropertychangelistener() removepropertychangelister() setvalue() getvalue() generated event PropertyChangeEvent getsource() getpropertyname() getnewvalue() getoldvalue() chg.firepropertychange( Month, old, new ); Month = new; adapter PropertyChangeAdapter listener interface PropertyChangeListener PropertyChange () PropertyChange (e) target.setmonth (e.getnewvalue()); 11 Model-View-Controller(1) An architecture style generally used for GUI. Role of each components: View Model!"#$"#! '(&()*! %&$"#! Controller persistent storage 12

7 Model-View-Contoller(2) Model holds encapsulated data.!! It grants readonly to the view!! It grants r/w to the controller Model +content +getcontent() +setcontent() R1: Suzuki 10/1 10/10 10/12 2 R2: Sato 10/4 10/11 10/ /10 10/12 R1: Suzuki 10/1 10/11 10/13 R2: Sato 10/4 2 (101,102) 1 (103) ResvModel +setowner() +setcreatedate() +setduration() +setroomcnt() (args are omitted) 13 Model-View-Contoller(3) View shows data.!! Many views might be used!! It provides update op. View +init(model) +update() R1: R2: Suzuki 10/10 10/12 2 Sato 10/11 10/13 1 ResvView1 ResvView2 Thay show latest information hold in the model when update is called. 10/10 10/11 10/12 10/ R1 R1 R1 102 R1 R1 R1 103 R2 R2 R2 14

8 Model-View-Contoller(4) Controller is responsible for input/change of data.!! Transfer events to corresponding inputs.!! If its behavior depends on the model, update must be automatically called. (eg. disable add button when data is readonly) R1: R2: new: Suzuki 10/10 10/12 2 Sato 10/11 10/13 1 Tanaka 10/12 10/13 1 Controller +handleev() +update() add Cancel ResvCont. V and C might be mixed sometimes. +handleev() 15 Integration in MVC (1) Class diagram shows static relashonships. InputWindow - model - controller +init(model) +makectrl() +update() create delegate refer use InputController - model - view +init(model,view) +handleevent() +update() ResvModel +init(view) +attach(ctrl) +getdata(field) +setdata(field) +service() 16

9 Integration in MVC (2) Communication diagram shows dynamisms. Change of num.,inputcont.,resvmodel handleevent(input) service(input) setdata(),inputwin Submit button handleevent(send) update() update() getdata() service(send) update() 17 Example: Reservation System Based on Client/Server architecture. Functional requirements : Submit/retrieve/cancel from user client Show status from manager client Consume/dispose from frontdesk clerk client No additional softwares are necessary for clients Non-functional requirements: scalability MVC is suitable for clients. It is interactive. It is required to present the same data on the different view. Structure of views might be changed. 18

10 Impl. of MVC with JavaBeans AWT/Swing Beans are already built on MVC. Ex: java.awt.textarea View ta.contentspane Software Architechture TextArea ta = new TextArea(); update() Model ta.text Software\nArchitecture\n ta.currentposition (1,3) ta.scrollbarpolicy BOTH Controller insert(t,pos) MouseEvent KeyEvent ta.actionlistener (Some detail in model are omitted) 19 Client with Beans(1) Example of view for retrieve/cancel resv. Model R1 Suzuki 10/10 10/20 10/23 S2T0 [101,102] R2 Sato 10/14 10/22 10/25 S1T2 [103,201,202] 1.retrieve from the server 2.disp. 4.disp. View1 R1 Suzuki R2 Sato Cont1 show show new 3.create View2 ID R1 Owner Suzuki Ckin 10/20 Ckout 10/23 Rooms S2 T0 Status OK user: buttons for his/her record only Cont2 cancel OK manager: all of buttons are enabled 20 send to the server when cancel is pressed

11 Client with Beans(2) Example of view for submit new resv. Model R1 Suzuki 10/10 10/20 10/23 S2T0 [101,102] R2 Sato 10/14 10/22 10/25 S1T2 [103,201,202] R1 Suzuki 10/10 10/29 11/03 S0T1 [] 3:send to the server 4.disp. 2.disp. View1 R1 Suzuki Cont1 show View3 Owner Suzuki Ckin 12/29 10/29 Ckout 01/02 11/03 R2 Sato show Rooms 1.create S0/T1 new Cont3 send back (View1 is updated after the request is accepted by the server) 21 Summary!! Delegation event model!! A sender and a receiver are independent.!! An adapter connects them by eventlister / actionlister.!! MVC architecture style!! Input (control) / Output (view) / Storage (model)!! Provide maximum flexibility.!! Implementation: Hotel Reservation System!! Retrieve/cancel reservation: static connection btwn a view and a controller!! Submit new reservation: dynamic connection btwn a view and a model 22

12 Next Chapter Server side components (1)!! Web application!! Servlet and JSP 23 Exercise Review the content of my lecture by answering the following simple questions.!! What is the delegation event model?!! What is the role of event / eventlistener?!! What is the role of action / actionlistener?!! What is the MVC architecture?!! Why we use MVC for client of our reservation system?!! Trace the behavior of clients shown in p20 and p21 step by step. 24

6 The MVC model. Main concepts to be covered. Pattern structure. Using design patterns. Design pattern: Observer. Observers

6 The MVC model. Main concepts to be covered. Pattern structure. Using design patterns. Design pattern: Observer. Observers Main concepts to be covered 6 The MVC model Design patterns The design pattern The architecture Using design patterns Inter-class relationships are important, and can be complex. Some relationship recur