一本糊涂账系列教材（十二）- 原型-基础

-->

下载区
文件名	文件大小
hutubill.rar	5k
解压rar如果失败，请用5.21版本或者更高版本的winrar 点击下载 winrar5.21

工具版本兼容问题

3分15秒

1.0 原速 1.25 倍速 1.5 倍速 1.75 倍速

本视频采用html5方式播放，如无法正常播放，请将浏览器升级至最新版本，推荐火狐，chrome，360浏览器。如果装有迅雷，播放视频呈现直接下载状态，请调整迅雷系统设置-基本设置-启动-监视全部浏览器 (去掉这个选项)。 chrome 的视频下载插件会影响播放，如 IDM 等，请关闭或者切换其他浏览器

步骤 1 : 原型概念
步骤 2 : 直接在main方法中new JFrame
步骤 3 : 问题
步骤 4 : 解决办法

步骤 1 :

原型概念

edit 顶折

纠问

完整的J2SE桌面项目，从无到有完整的开发流程，涵盖全部52个知识点，154个开发步骤, 一共36个讲解视频，累计时长3小时10分59秒，大小1.94G，充实J2SE项目经验，为简历加上一个有吸引力的砝码
增值内容，点击购买

接下来就开始原型设计。什么是原型设计呢？简单说，就是先把界面做出来。界面上的数据，都是假数据，并不是从数据库中读取的真实数据。

为什么要这么做呢？有了界面，才直观，你才会更有感觉，也才能更清楚各个功能之间怎么实现。更重要的是，有了界面，才能更有效的和客户沟通，哪些功能需要修改，哪些功能可以删减。

步骤 2 :

直接在main方法中new JFrame

edit 顶折

纠问

最直接的方式，就是在main方法中从new JFrame开始撸起来

代码行数较多，请点击查看

import java.awt.BorderLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JToolBar;

class HutuMainFrame {

	public static void main(String[] args) {
		JFrame f = new JFrame();
		f.setSize(500, 450);
		f.setTitle("一本糊涂账");
		f.setLocationRelativeTo(null);
		f.setResizable(false);
		f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

		JToolBar tb = new JToolBar();
		JButton bSpend = new JButton("消费一览");
		JButton bRecord = new JButton("记一笔");
		JButton bCategory = new JButton("消费分类");
		JButton bReport = new JButton("月消费报表");
		JButton bConfig = new JButton("设置");
		JButton bBackup = new JButton("备份");
		JButton bRecover = new JButton("恢复");

		tb.add(bSpend);
		tb.add(bRecord);
		tb.add(bCategory);
		tb.add(bReport);
		tb.add(bConfig);
		tb.add(bBackup);
		tb.add(bRecover);
		f.setLayout(new BorderLayout());
		f.add(tb, BorderLayout.NORTH);
		f.add(new JPanel(), BorderLayout.CENTER);
		
		f.setVisible(true);
		
		bSpend.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bRecord.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bCategory.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bConfig.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bBackup.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bRecover.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});

	}
}

步骤 3 :

问题

edit 顶折

纠问

当界面代码变得复杂之后，就出现这么一个问题。仅仅用于编写界面的代码就会很长，可读性变差，难以维护，而且有各种匿名内部类，非常不好定位。

1. 注意看38行，这是下方用于显示各种功能界面的JPanel。目前这是一个空白Panel, 为了将来显示各种功能，可以想象，这一块的代码会变得非常的复杂

2. 再看42-71行，这是给各个按钮加监听器，目前都还是没有任何实际功能的空白监听器，一旦将来把各种功能都加上去之后，代码会变得非常冗长和难以阅读

代码行数较多，请点击查看

import java.awt.BorderLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;

import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JToolBar;

class HutuMainFrame {

	public static void main(String[] args) {
		JFrame f = new JFrame();
		f.setSize(500, 450);
		f.setTitle("一本糊涂账");
		f.setLocationRelativeTo(null);
		f.setResizable(false);
		f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

		JToolBar tb = new JToolBar();
		JButton bSpend = new JButton("消费一览");
		JButton bRecord = new JButton("记一笔");
		JButton bCategory = new JButton("消费分类");
		JButton bReport = new JButton("月消费报表");
		JButton bConfig = new JButton("设置");
		JButton bBackup = new JButton("备份");
		JButton bRecover = new JButton("恢复");

		tb.add(bSpend);
		tb.add(bRecord);
		tb.add(bCategory);
		tb.add(bReport);
		tb.add(bConfig);
		tb.add(bBackup);
		tb.add(bRecover);
		f.setLayout(new BorderLayout());
		f.add(tb, BorderLayout.NORTH);
		f.add(new JPanel(), BorderLayout.CENTER);
		
		f.setVisible(true);
		
		bSpend.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bRecord.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bCategory.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bConfig.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bBackup.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});
		bRecover.addActionListener(new ActionListener() {
			public void actionPerformed(ActionEvent e) {
				
			}
		});

	}
}

步骤 4 :

解决办法

edit 顶折

纠问

为了使得代码变得更加维护，避免陷入代码冗长的泥坑里，我们需要对代码进行科学的规划。请翻到下一章节界面包的规划

一本糊涂账系列教材（十一）- 原型-基础 - 概述

一本糊涂账系列教材（十三）- 原型-基础 - 界面包的规划

HOW2J公众号，关注后实时获知最新的教程和优惠活动，谢谢。

问答区域

2021-11-01 import总是出现问题是怎么回事？

dyh1

关于实践项目-一本糊涂账-粗陋的JFrame 的提问

我写自己敲，还是粘贴网页上站主写的代码impout都有问题，但是下载站主写的包就impout就没有问题？上网都不知道怎么搜素从ecplic换到idea也没有办法？这是怎么回事？我该怎么办？

import java.awt.BorderLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
 
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JToolBar;

1 个答案

how2j
答案时间：2021-11-02

如果是出了这个问题，通常是因为 eclipse是对应项目没有rt.jar导致的。试试我提供的eclipse版本呢？ https://how2j.cn/k/helloworld/helloworld-version/1718.html#step7509

回答已经提交成功，正在审核。请于我的回答处查看回答记录，谢谢

2020-09-11 目前这是一个空白Panel, 为了将来显示各种功能。这个空白Panel 如何引用和增加组件，小白不懂。。。

Tulys

关于实践项目-一本糊涂账-粗陋的JFrame -问题的提问

f.add(new JPanel(), BorderLayout.CENTER); newJPanel（）后，这个JPanel也没有引用，如何set各种组件？

import java.awt.BorderLayout;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
 
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JToolBar;
 
class HutuMainFrame {
 
    public static void main(String[] args) {
        JFrame f = new JFrame();
        f.setSize(500, 450);
        f.setTitle("一本糊涂账");
        f.setLocationRelativeTo(null);
        f.setResizable(false);
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
 
        JToolBar tb = new JToolBar();
        JButton bSpend = new JButton("消费一览");
        JButton bRecord = new JButton("记一笔");
        JButton bCategory = new JButton("消费分类");
        JButton bReport = new JButton("月消费报表");
        JButton bConfig = new JButton("设置");
        JButton bBackup = new JButton("备份");
        JButton bRecover = new JButton("恢复");
 
        tb.add(bSpend);
        tb.add(bRecord);
        tb.add(bCategory);
        tb.add(bReport);
        tb.add(bConfig);
        tb.add(bBackup);
        tb.add(bRecover);
        f.setLayout(new BorderLayout());
        f.add(tb, BorderLayout.NORTH);
        f.add(new JPanel(), BorderLayout.CENTER);

1 个答案

how2j
答案时间：2020-09-12

这里只是为了演示空白panel ，后续教程会进一步做改动的哈

回答已经提交成功，正在审核。请于我的回答处查看回答记录，谢谢

2020-04-18 关于创建或者是导入项目的问题

2019-07-12 导入项目，运行报错，提示“类路径引用的项目”不存在

2019-03-01 不显示窗体

司木	关于实践项目-一本糊涂账-粗陋的JFrame -直接在main方法中new JFrame 的提问复制代码到eclipse里的，检查没有错。为什么没有运行出窗体，什么反应都没有。怎么解决？

3 个答案

how2j
答案时间：2019-03-13

多比较哈，可以提高学习效率

司木
答案时间：2019-03-12

终于找到原因了，谢谢站长。之前显示无法加载主类，然后在class前面加上public显示HuTuMainFrame有问题。修改一下类名。然后运行就成功了。

代码超过 5行，点击查看

how2j
答案时间：2019-03-02

右上角可运行项目能用吗？

回答已经提交成功，正在审核。请于我的回答处查看回答记录，谢谢

提问太多，页面渲染太慢，为了加快渲染速度，本页最多只显示几条提问。还有 2 条以前的提问，请点击查看

提问之前请登陆

提问已经提交成功，正在审核。请于我的提问处查看提问记录，谢谢

关于实践项目-一本糊涂账-粗陋的JFrame 的提问

尽量提供截图、代码和异常信息，有助于分析和解决问题。也可进本站QQ群交流: 578362961

提问尽量提供完整的代码，环境描述，越是有利于问题的重现，您的问题越能更快得到解答。
对教程中代码有疑问，请提供是哪个步骤，哪一行有疑问，这样便于快速定位问题，提高问题得到解答的速度
在已经存在的几千个提问里，有相当大的比例，是因为使用了和站长不同版本的开发环境导致的,比如 jdk, eclpise, idea, mysql,tomcat 等等软件的版本不一致。
请使用和站长一样的版本，可以节约自己大量的学习时间。站长把教学中用的软件版本整理了，都统一放在了这里，方便大家下载： https://how2j.cn/k/helloworld/helloworld-version/1718.html

上传截图