Úvod do architektury MVC: Vysvětlení příkladů

Architektura Model-View-Controller (MVC) je jedním z nejpopulárnějších modelů vývoje softwaru. Logika architektury MVC využívá principu návrhu oddělení zájmů. Tento princip má za cíl rozdělit aplikaci do okresních sekcí, kde každá sekce řeší konkrétní a samostatný problém.

Architektura MVC do písmene dodržuje princip oddělení zájmů. Ve skutečnosti každé písmeno v akronymu MVC představuje základní část vaší aplikace. Tento článek podrobně prozkoumává každou část architektury MVC a ukazuje, jak je používat k vývoji softwaru.

co je model?

Model architektury MVC je hlavní složkou návrhového vzoru. Je to proto, že model vaší aplikace ukládá datovou logiku. Model určuje, jak budete svá data ukládat a načítat.

Pro aplikaci, která používá architekturu řadiče MVC, jsou data nezbytnou součástí jejího provozu.

Jaký je pohled?

Pohled na architekturu MVC je uživatelské rozhraní (UI) vaší aplikace. Uživatelské rozhraní je to, co uživatel vidí na svém zařízení při interakci s vaším programem. Stav pohledu závisí na datech uložených pomocí modelu.

Co je ovladač?

Ovladač si můžete představit jako most mezi komponentami Model a View.

Když uživatel dodá data prostřednictvím vašeho uživatelského rozhraní (View), předá View tato data řadiči. Správce používá tato data k aktualizaci databáze (prostřednictvím modelu). Kontrolér také stahuje data z databáze (prostřednictvím modelu) a vrací je do pohledu.

Kromě toho, že je ovladač datovým kanálem, je také mozkem operace. Rozhoduje, jakou operaci provést s jakými daty a která data vrátit do uživatelského rozhraní.

Jak to všechno jde dohromady?

Architektura MVC vytváří polouzavřenou smyčku, která spoléhá na to, že všechny komponenty budou správně fungovat. Následující obrázek ukazuje, jak funguje architektura MVC.

Jak můžete vidět na obrázku výše, aplikace MVC přijímá počáteční vstup dat od uživatele prostřednictvím uživatelského rozhraní. Poté aplikace předá tato data přes různé komponenty architektury MVC a v některých případech s těmito daty manipuluje v komponentě Controller.

Použití architektury MVC

Řekněme, že vyvíjíte aplikaci pro čerpací stanici, která chce vytvořit evidenci veškerého plynu prodaného na čerpací stanici a pomoci obsluze s výpočtem ceny. Pomocí architektury MVC byste začali s modelem, pak přešli na Controller a poté, co jste přišli na veškerou logiku vaší aplikace, můžete implementovat View.

Při vytváření modelu pro vaši aplikaci musíte vědět, jaký typ dat chcete ukládat, jak chcete tato data ukládat a jak dostupná data chcete mít.

Vytvoření aplikačního modelu

//Java knihovna
import java.io. Serializovatelné;
veřejnosttřída GasPriceModel nářadí Serializovatelný{
 //attributes
soukromýstatickýfináledlouhoserialVersionUID = 1 1;
soukromý String driverName;
soukromýplovák množství plynu;
soukromý Typ strunového plynu;
soukromýplovák náklady;
// výchozí konstruktor
veřejnost GasPriceModel() {
tento.driverName = "";
tento.plynČástka = 0,00f;
tento.gasType = "";
tento.náklady = 0,00f;
 }
 //primární konstruktory
veřejnost GasPriceModel (string driverName, plovák gasAmount, String gasType, plovák náklady) {
tento.driverName = jméno řidiče;
tento.gasAmount = gasAmount;
tento.gasType = gasType;
tento.náklady = náklady;
 }
 //gettery a settery, které získávají data a manipulují s nimi
veřejnost Řetězec getDriverName() {
vrátit se jméno řidiče;
 }
veřejnostprázdnota setDriverName (String driverName) {
tento.driverName = jméno řidiče;
 }
veřejnostplovák getGasAmount() {
vrátit se množství plynu;
 }
veřejnostprázdnota setGasAmount(plovák množství plynu) {
tento.gasAmount = gasAmount;
 }
veřejnost String getGasType() {
vrátit se gasType;
 }
veřejnostprázdnota setGasType (String gasType) {
tento.gasType = gasType;
 }
veřejnostplovák getCost() {
vrátit se náklady;
 }
veřejnostprázdnota setCost(plovák náklady) {
tento.náklady = náklady;
 }
}

Ve výše uvedeném kódu modelu je třeba identifikovat několik důležitých věcí. První je, že implementuje rozhraní Serializable. Toto rozhraní vám umožňuje uložit stav každého objektu vytvořeného pomocí GasPriceModel třídy převedením na byte stream. Implementace rozhraní Serializable znamená, že musíte také vytvořit ID verze, což dělá první atribut ve třídě výše.

Příbuzný: Naučte se vytvářet třídy v Javě Další čtyři atributy v GasPriceModel třídy jsou stejně důležité, protože vám řeknou, kdo bude mít přístup k datům, která tento model vytvoří. Také vám řekne, jaký typ dat bude model ukládat (řetězce a floats).

Vytvoření aplikačního řadiče

//Java knihovny
import java.io. Soubor;
import java.io. FileNotFoundException;
import java.io. FileOutputStream;
import java.io. IOException;
import java.io. ObjectOutputStream;
veřejnosttřída GasPriceController {
 //vypočítá cenu plynu zákazníka a vrátí jej
veřejnostplovák vypočítatCost(plovák množství, String gasType){
plovák náklady = 0,00f;
fináleplovák dieselCena = 4,925f;
fináleplovák premiumPrice = 5,002f;
fináleplovák běžná cena = 4,680f;
-li (gasType == "Diesel")
 cena = množství * naftaCena;
-li (gasType == "Premium")
 cena = částka * prémiumPrice;
-li (gasType == "Normální")
 cena = částka * běžná Cena;
vrátit se náklady;
 }
//uloží data z každého prodeje do souboru pomocí modelu
veřejnostbooleovský saveEntry (data GasPriceModel){
Snaž se {
FileOutputStream fs = Nový FileOutputStream(Nový Soubor("data.dat"), skutečný);
 ObjectOutputStream os = Nový ObjectOutputStream (fs);
 os.writeObject (data);
 os.flush();
 os.close();
vrátit seskutečný;
 } chytit (FileNotFoundException e) {
 e.printStackTrace();
 } chytit (IOException e) {
 e.printStackTrace();
 }
vrátit seNepravdivé;
 }
}

Výše uvedený Controller dělá dvě věci, provádí výpočet na datech přijatých z pohledu a rozhoduje, jaká data vrátit. Výše uvedený řadič také používá model aplikace k ukládání objektů vytvořených ze vstupu pohledu pomocí saveEntry() metoda.

Vytvoření zobrazení aplikace

//Java knihovny
import java.awt. BorderLayout;
import java.awt. Rozvržení mřížky;
import java.awt.event. ActionEvent;
import java.awt.event. ActionListener;
import javax.swing. JButton;
import javax.swing. JComboBox;
import javax.swing. JFrame;
import javax.swing. JLabel;
import javax.swing. JOptionPane;
import javax.swing. JPanel;
import javax.swing. JTextField;
public class GasPriceView rozšiřuje JFrame implementuje ActionListener {
//attributes
 private static final long serialVersionUID = 1L;
 soukromý ovladač GasPriceController;
 private JLabel driverName;
 private JTextField nameField;
 soukromý JLabel gasMnožství;
 private JTextField numberField;
 soukromý typ plynu JLabel;
 soukromý JComboBox typeCombo;
 soukromé JButton btnClear;
 private JButton btnSave;
 private static final String[] typ =
 {"Diesel", "Premium", "Normální"};
//výchozí konstruktor
 public GasPriceView() {
 this (new GasPriceController());
 }
//primární konstruktor, který způsobuje uživatelské rozhraní
 public GasPriceView (regulátor GasPriceController) {
super("Žádost o prodej plynu");
 setDefaultCloseOperation (JFrame. EXIT_ON_CLOSE);
 setSize (400 500);
 setVisible (pravda);
this.controller = kontrolor;
configureView();
 }
//vygenerování uživatelského rozhraní pro aplikaci
 private void configureView() {
setLayout (new BorderLayout());
 JPanel pnl = nový JPanel (nový GridLayout (4,2,2,2));
driverName = new JLabel("Jméno řidiče:");
 pnl.add (jméno ovladače);
 nameField = new JTextField();
 pnl.add (jménoPole);
 gasAmount = new JLabel("Množství plynu (galon):");
 pnl.add (gasAmount);
 množstvíPole = new JTextField();
 pnl.add (částkaPole);
 gasType = new JLabel("Gas Type:");
 pnl.add (gasType);
 typeCombo = nový JComboBox(typ);
 pnl.add (typeCombo);
 btnClear = new JButton("Clear");
 pnl.add (btnClear);
 btnSave = new JButton("Uložit");
 pnl.add (btnSave);
přidat (pnl, BorderLayout. CENTRUM);
ActionListener();
}
 //poslouchá kliknutí na jedno ze dvou tlačítek
 public void ActionListener() {
 btnClear.addActionListener (toto);
btnSave.addActionListener (toto);
 }
//po kliknutí na konkrétní tlačítko provede akci
 @Přepsat
 public void actionPerformed (ActionEvent ev) {
if (ev.getSource().equals (btnClear)) {
 nameField.setText("");
 množstvíPole.setText("");
 }
if (ev.getSource().equals (btnSave)){
String gasType = (String) typeCombo.getSelectedItem();
 float gasAmount = Float.parseFloat (amountField.getText());
 float driverTotal = controller.calculateCost (gasAmount, gasType);
 String driverName = nameField.getText();
 JOptionPane.showMessageDialog (null, driverName +" by měl platit $" + driverTotal );
GasPriceModel zákazník = nový GasPriceModel (jméno řidiče, množství plynu, typ plynu, celkem);
controller.saveEntry (zákazník);
 }
}
}

Výše uvedený pohled vytváří uživatelské rozhraní pomocí configureView() metoda. Poté shromažďuje data poté, co dojde k události (prostřednictvím posluchače akcí). Výše uvedený pohled poté odešle shromážděná data do řadiče, který poté provede některé výpočty a vrátí data do pohledu.

Spuštění aplikace MVC

import java.awt. EventQueue;
veřejnosttřída Aplikace {
veřejnoststatickýprázdnota main (String args[]) {
 EventQueue.invokePozději(
Nový Runnable() {
@Přepsat
veřejnostprázdnota spustit() { 
 Regulátor GasPriceController = Nový GasPriceController(); 
Nový GasPriceView (ovladač); 
 }
 });
 }
}

Provádění Aplikace třída výše vygeneruje následující uživatelské rozhraní:

Naplnění uživatelského rozhraní příslušnými daty vygeneruje následující vyskakovací uživatelské rozhraní:

Pokud se podíváte na levou část obrázku výše, uvidíte, že aplikace také vytvořila nový soubor s názvem "data.dat." Tato aplikace MVC tedy shromažďuje data od uživatele prostřednictvím uživatelského rozhraní (View), které tato data odesílá do Ovladač. Řadič manipuluje s daty provedením některých výpočtů a poté tato data uloží do souboru pomocí modelu. Příbuzný: Vstup a výstup Java: Průvodce pro začátečníky

Vstup a výstup Java: Průvodce pro začátečníky

Pokud se blíže podíváte na aplikaci vytvořenou v tomto článku, existuje několik zjevných výhod. Některé z těchto výhod zahrnují:

• Škálovatelnost
• Jednodušší testování kódu
• Vytvoření stručnějšího kódu

Architektura MVC však není jediným užitečným návrhovým vzorem, který může zlepšit váš vývojový proces.

Jak vytvořit opakovaně použitelný kód v JavaScriptu pomocí návrhových vzorů

Pochopení toho, jak používat návrhové vzory, vám umožní používat opakovaně použitelný kód v JavaScriptu. Zde je to, co potřebujete vědět.

Přečtěte si další

O autorovi