设计模式之MVC

什么是MVC

MVC三个单词分别是model（模型）、view（视图）、control（控制），MVC设计模式的特点就是把模型、视图、控制三个部分的代码分开写，使得各个部分最大限度地实现松耦合，视图部分持有模型部分和控制部分的引用，控制部分持有视图部分和模型部分的引用，而模型部分不持有它们的引用。如果要实现模型对视图的影响，可以使用观察者模式，在模型中注册视图的观察者对象，当有信息更新的时候可以通知所有观察者。
下图即MVC的基本模型：

下面通过MVC设计模式实现一个简单的节拍器。

视图（V）

1、构造方法。视图的构造方法传入模型和控制器的引用，并且调用模型的registerObserver方法注册称为观察者。这里用到了两个视图，于是实现了两个观察者接口，都有update方法，在“主题”更新的时候可以得到通知。

   /**
     * 构造方法，获得M和C的引用
     * 在模型中注册，称为模型的观察者，以便获取数据更新的通知
     * @param model
     * @param controller
     */
	public DJView(BeatModelInterface model, ControllerInterface controller) {
   
		this.model = model;
		this.controller = controller;
		model.registerObserver((BeatObserver)this);
		model.registerObserver((BPMObserver)this);
	}

public interface BPMObserver {
   
	void updateBPM();			
}

public interface BeatObserver {
   
      void updateBeat();
}

2、视图持有的引用。在如下例子中我们可以发现，视图部分除了模型和控制器的引用，其他的都是组件的申明，代码十分干净，视图只负责显示。视图部分用到了组合模式，用户界面组合了嵌套的组件。

    BeatModelInterface model;//持有模型的引用
    ControllerInterface controller;//持有控制器的引用
    //申明所有显示组件
    JFrame viewFrame;
    JPanel viewPanel;
    BeatBar beatBar;
    JLabel bpmOutputLabel;
    JFrame controlFrame;
    JPanel controlPanel;
    JLabel bpmLabel;
    JTextField bpmTextField;
    JButton setBPMButton;
    JButton increaseBPMButton;
    JButton decreaseBPMButton;
    JMenuBar menuBar;
    JMenu menu;
    JMenuItem startMenuItem;
    JMenuItem stopMenuItem;

3、视图的创建代码。这部分代码实例化了组件，调用这个方法就可以使得视图显示出来。如果有按钮，可以直接实现监听器方法，按钮是用来触发控制器的方法的，这个在后面还会提到。

	/**
	 * 创建视图1，显示参数部分
	 * 调用这个方法实例化所有组件并创建视图
	 * 这段代码只管显示（不涉及任何逻辑）
	 */
	public void creatView(){
   
		viewPanel=new JPanel(new GridLayout(1, 2));
		viewFrame=new JFrame("View");
		viewFrame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		viewFrame.setSize(new Dimension(100, 80));
		bpmOutputLabel=new JLabel("offline", SwingConstants.CENTER);
		beatBar=new BeatBar();
		beatBar.setValue(0);
		JPanel bpmPanel=new JPanel(new GridLayout(2, 1));
		bpmPanel.add(beatBar);
		bpmPanel.add