CS计算机代考程序代写 prolog data structure Java ITI 1121. Introduction to Computing II – subtitle

ITI 1121. Introduction to Computing II – subtitle

ITI 1121. Introduction to Computing II
Graphical user interface : Model-View-Controller

by

Marcel Turcotte

Version April 4, 2020

Preamble

Preamble

Overview

Overview

Graphical user interface : Model-View-Controller

In software development, a design pattern is a specific arrangement of classes. It’s a
standard way to solve well-known problems. Programmers in the industry are familiar
with these patterns. This week, we discover the design pattern Model-View-Controller
(MVC) which is used in the development of graphical user interfaces.

General objective:
This week, you will be able to design the graphical user interface of a simple
application by applying the Model-View-Controller design pattern.

1 26

Preamble

Learning objectives

Learning objectives

Describe in your own words the Model-View-Controller design pattern.
Use the Model-View-Controller design pattern to produce the visual rendering of a
graphical user interface.

Readings:
https://en.wikipedia.org/wiki/Model-view-controller

http://heim.ifi.uio.no/~trygver/2007/MVC_Originals.pdf

2 26

https://en.wikipedia.org/wiki/Model-view-controller
http://heim.ifi.uio.no/~trygver/2007/MVC_Originals.pdf

Preamble

Plan

Plan

1 Preamble

2 Théorie

3 Exemple

4 Prologue

3 26

Theory

Design pattern

In software development, a design pattern is a specific arrangement of classes.
It’s a standard way to solve well-known problems.
Programmers in the industry are familiar with these patterns.

4 26

Model-View-Controller

ViewController

Model

1

3

2 4

MVC separates the data, the view and the logic from the application.

5 26

Benefits

Allows you to modify or adapt each part of the application independently;
Promotes the implementation of several views;
The association between the model and the view is done dynamically at
runtime (not at compile time), which allows the view to be changed during execution.

6 26

Definitions

Model – implementation, state: attributes and behaviors;
View – the output interface, a representation of the model for the outside world;
Controller – the input interface, routes user requests to update the model.

7 26

Model

Contains the application data and methods for transforming the data;
Possesses a minimal knowledge of the graphical interface (sometimes no
knowledge at all);
The view and the model are very different.

8 26

View

A representation (graphical, textual, vocal, etc.) of the model for the user.

9 26

Controller

A controller is an object that allows the user to transform the data or the
representation;
Knows the model very well.

10 26

Example

Counter

ViewController

Model

update()

getValue()

actionPerformed()

increment()
reset()

A graphical interface for the class Counter.

11 26

Counter: Model
pub l i c c l a s s Counter {

p r i v a t e i n t v a l u e ;
pub l i c Counter ( ) {

v a l u e = 0 ;
}
pub l i c vo id i n c r ement ( ) {

v a l u e++;
}
pub l i c i n t ge tVa lue ( ) {

re tu rn v a l u e ;
}
pub l i c vo id r e s e t ( ) {

v a l u e = 0 ;
}
pub l i c S t r i n g t o S t r i n g ( ) {

re tu rn ” Counter : { v a l u e=”+v a l u e+”}” ;
}

}
12 26

View

pub l i c i n t e r f a c e View {
vo id update ( ) ;

}

To facilitate the development of multiple views, we create the interface View.
Our example will have two views: GraphicalView and TextView.

13 26

pub l i c c l a s s TextView implements View {

p r i v a t e Counter model ;

pub l i c TextView ( Counter model ) {
t h i s . model = model ;

}

pub l i c vo id update ( ) {
System . out . p r i n t l n ( model . t o S t r i n g ( ) ) ;

}

}

pub l i c c l a s s Graph i ca lV i ew extends JFrame implements View {
p r i v a t e JLabe l i n p u t ;
p r i v a t e Counter model ;
pub l i c Graph i ca lV i ew ( Counter model , C o n t r o l l e r c o n t r o l l e r ) {

s e tLayou t (new Gr idLayout ( 1 , 3 ) ) ;
t h i s . model = model ;
JButton button ;
but ton = new JButton ( ” Inc r ement ” ) ;
but ton . a d d A c t i o n L i s t e n e r ( c o n t r o l l e r ) ;
add ( but ton ) ;
JButton r e s e t ;
r e s e t = new JButton ( ” Reset ” ) ;
r e s e t . a d d A c t i o n L i s t e n e r ( c o n t r o l l e r ) ;
add ( r e s e t ) ;
i n p u t = new JLabe l ( ) ;
add ( i n p u t ) ;

}
pub l i c vo id update ( ) {

i n p u t . s e tTex t ( I n t e g e r . t o S t r i n g ( model . ge tVa lue ( ) ) ) ;
}

}

pub l i c c l a s s C o n t r o l l e r implements A c t i o n L i s t e n e r {

p r i v a t e Counter model ;

p r i v a t e View [ ] v i ews ;
p r i v a t e i n t numberOfViews ;

pub l i c C o n t r o l l e r ( ) {

v i ews = new View [ 2 ] ;
numberOfViews = 0 ;

model = new Counter ( ) ;

r e g i s t e r (new Graph i ca lV i ew ( model , t h i s ) ) ;
r e g i s t e r (new TextView ( model ) ) ;

update ( ) ;

}

p r i v a t e vo id r e g i s t e r ( View v iew ) {
v i ews [ numberOfViews ] = v iew ;
numberOfViews++;

}

p r i v a t e vo id update ( ) {
f o r ( i n t i =0; i