how2j.cn


工具版本兼容问题
布局器是用在容器上的。 用来决定容器上的组件摆放的位置和大小


本视频是解读性视频,所以希望您已经看过了本知识点的内容,并且编写了相应的代码之后,带着疑问来观看,这样收获才多。 不建议一开始就观看视频



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



示例 1 : 绝对定位   
示例 2 : FlowLayout   
示例 3 : BorderLayout   
示例 4 : GridLayout   
示例 5 : setPreferredSize   
示例 6 : CardLayout   
示例 7 : 练习-计算器上的按钮   
示例 8 : 答案-计算器上的按钮   

绝对定位就是指不使用布局器,组件的位置和大小需要单独指定
package gui; import javax.swing.JButton; import javax.swing.JFrame; public class TestGUI { public static void main(String[] args) { JFrame f = new JFrame("LoL"); f.setSize(400, 300); f.setLocation(200, 200); // 设置布局器为null,即进行绝对定位,容器上的组件都需要指定位置和大小 f.setLayout(null); JButton b1 = new JButton("英雄1"); // 指定位置和大小 b1.setBounds(50, 50, 80, 30); JButton b2 = new JButton("英雄2"); b2.setBounds(150, 50, 80, 30); JButton b3 = new JButton("英雄3"); b3.setBounds(250, 50, 80, 30); // 没有指定位置和大小,不会出现在容器上 JButton b4 = new JButton("英雄3"); f.add(b1); f.add(b2); f.add(b3); // b4没有指定位置和大小,不会出现在容器上 f.add(b4); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.setVisible(true); } }
设置布局器为FlowLayout,顺序布局器
容器上的组件水平摆放
加入到容器即可,无需单独指定大小和位置
FlowLayout
package gui; import java.awt.FlowLayout; import javax.swing.JButton; import javax.swing.JFrame; public class TestGUI { public static void main(String[] args) { JFrame f = new JFrame("LoL"); f.setSize(400, 300); f.setLocation(200, 200); // 设置布局器为FlowLayerout // 容器上的组件水平摆放 f.setLayout(new FlowLayout()); JButton b1 = new JButton("英雄1"); JButton b2 = new JButton("英雄2"); JButton b3 = new JButton("英雄3"); // 加入到容器即可,无需单独指定大小和位置 f.add(b1); f.add(b2); f.add(b3); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.setVisible(true); } }
设置布局器为BorderLayout
容器上的组件按照上北 下南 左西 右东 中的顺序摆放
BorderLayout
package gui; import java.awt.BorderLayout; import java.awt.FlowLayout; import javax.swing.JButton; import javax.swing.JFrame; public class TestGUI { public static void main(String[] args) { JFrame f = new JFrame("LoL"); f.setSize(400, 300); f.setLocation(200, 200); // 设置布局器为BorderLayerout // 容器上的组件按照上北下南左西右东中的顺序摆放 f.setLayout(new BorderLayout()); JButton b1 = new JButton("洪七"); JButton b2 = new JButton("段智兴"); JButton b3 = new JButton("欧阳锋"); JButton b4 = new JButton("黄药师"); JButton b5 = new JButton("周伯通"); // 加入到容器的时候,需要指定位置 f.add(b1, BorderLayout.NORTH); f.add(b2, BorderLayout.SOUTH); f.add(b3, BorderLayout.WEST); f.add(b4, BorderLayout.EAST); f.add(b5, BorderLayout.CENTER); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.setVisible(true); } }
GridLayout,即网格布局器
GridLayout
package gui; import java.awt.GridLayout; import javax.swing.JButton; import javax.swing.JFrame; public class TestGUI { public static void main(String[] args) { JFrame f = new JFrame("LoL"); f.setSize(400, 300); f.setLocation(200, 200); // 设置布局器为GridLayerout,即网格布局器 // 该GridLayerout的构造方法表示该网格是2行3列 f.setLayout(new GridLayout(2, 3)); JButton b1 = new JButton("洪七"); JButton b2 = new JButton("段智兴"); JButton b3 = new JButton("欧阳锋"); JButton b4 = new JButton("黄药师"); JButton b5 = new JButton("周伯通"); f.add(b1); f.add(b2); f.add(b3); f.add(b4); f.add(b5); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.setVisible(true); } }
即便 使用 布局器 ,也可以 通过setPreferredSize,向布局器建议该组件显示的大小.
只对部分布局器起作用,比如FlowLayout可以起作用。 比如GridLayout就不起作用,因为网格布局器必须对齐
setPreferredSize
package gui; import java.awt.Dimension; import java.awt.FlowLayout; import javax.swing.JButton; import javax.swing.JFrame; public class TestGUI { public static void main(String[] args) { JFrame f = new JFrame("LoL"); f.setSize(400, 300); f.setLocation(200, 200); f.setLayout(new FlowLayout()); JButton b1 = new JButton("英雄1"); JButton b2 = new JButton("英雄2"); JButton b3 = new JButton("英雄3"); // 即便 使用 布局器 ,也可以 通过setPreferredSize,向布局器建议该组件显示的大小 b3.setPreferredSize(new Dimension(180, 40)); f.add(b1); f.add(b2); f.add(b3); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.setVisible(true); } }
因为CardLayout需要用到面板JComboBox这些内容暂时还没学的内容,所以放在后面讲: CardLayout
CardLayout
示例 7 :

练习-计算器上的按钮

edit  姿势不对,事倍功半! 点击查看做练习的正确姿势
使用布局器做出计算器上的按钮效果
练习-计算器上的按钮
示例 8 :

答案-计算器上的按钮

edit
在查看答案前,尽量先自己完成,碰到问题再来查看答案,收获会更多
在查看答案前,尽量先自己完成,碰到问题再来查看答案,收获会更多
在查看答案前,尽量先自己完成,碰到问题再来查看答案,收获会更多
查看本答案会花费3个积分,您目前总共有点积分。查看相同答案不会花费额外积分。 积分增加办法 或者一次性购买JAVA 中级总计0个答案 (总共需要0积分)
查看本答案会花费3个积分,您目前总共有点积分。查看相同答案不会花费额外积分。 积分增加办法 或者一次性购买JAVA 中级总计0个答案 (总共需要0积分)
账号未激活 账号未激活,功能受限。 请点击激活
本视频是解读性视频,所以希望您已经看过了本答案的内容,带着疑问来观看,这样收获才多。 不建议一开始就观看视频

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


package gui; import java.awt.GridLayout; import java.util.ArrayList; import java.util.List; import javax.swing.JButton; import javax.swing.JFrame; import javax.swing.JPanel; public class TestGUI { public static void main(String[] args) { JFrame f = new JFrame("计算器"); int gap = 8; f.setSize(322, 272); f.setLocation(200, 200); f.setLayout(null); JPanel middlePanel = new JPanel(); middlePanel.setBounds(gap, gap, 300, 225); f.add(middlePanel); middlePanel.setLayout(new GridLayout(4, 5,gap,gap)); middlePanel.add(new JButton("7")); middlePanel.add(new JButton("8")); middlePanel.add(new JButton("9")); middlePanel.add(new JButton("/")); middlePanel.add(new JButton("sq")); middlePanel.add(new JButton("4")); middlePanel.add(new JButton("5")); middlePanel.add(new JButton("6")); middlePanel.add(new JButton("*")); middlePanel.add(new JButton("%")); middlePanel.add(new JButton("1")); middlePanel.add(new JButton("2")); middlePanel.add(new JButton("3")); middlePanel.add(new JButton("-")); middlePanel.add(new JButton("1/x")); middlePanel.add(new JButton("0")); middlePanel.add(new JButton("+/-")); middlePanel.add(new JButton(".")); middlePanel.add(new JButton("+")); middlePanel.add(new JButton("=")); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.setVisible(true); } }


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


问答区域    
2021-10-16 练习 - 简化版计算器
胡乱起个名




使用布局器做出计算器上的按钮效果
加载中
JFrame f = new JFrame("简化版计算器");
		f.setSize(300, 265);
		f.setLocation(200, 200);
		f.setLayout(new FlowLayout());
		
		JButton b1 = new JButton("7"); 
		JButton b2 = new JButton("8");
		JButton b3 = new JButton("9");
		JButton b4 = new JButton("/");
		JButton b5 = new JButton("sq");
		
		JButton b6 = new JButton("4");
		JButton b7 = new JButton("5");
		JButton b8 = new JButton("6");
		JButton b9 = new JButton("*");
		JButton b10 = new JButton("%");
		
		JButton b11 = new JButton("1");
		JButton b12 = new JButton("2");
		JButton b13 = new JButton("3");
		JButton b14 = new JButton("-");
		JButton b15 = new JButton("1/x");
		
		JButton b16 = new JButton("0");
		JButton b17 = new JButton("+/-");
		JButton b18 = new JButton(".");
		JButton b19 = new JButton("+");
		JButton b20 = new JButton("=");
		
		b1.setPreferredSize(new Dimension(51, 51));b2.setPreferredSize(new Dimension(51, 51));b3.setPreferredSize(new Dimension(51, 51));b4.setPreferredSize(new Dimension(51, 51));b5.setPreferredSize(new Dimension(51, 51));
		b6.setPreferredSize(new Dimension(51, 51));b7.setPreferredSize(new Dimension(51, 51));b8.setPreferredSize(new Dimension(51, 51));b9.setPreferredSize(new Dimension(51, 51));b10.setPreferredSize(new Dimension(51, 51));
		b11.setPreferredSize(new Dimension(51, 51));b12.setPreferredSize(new Dimension(51, 51));b13.setPreferredSize(new Dimension(51, 51));b14.setPreferredSize(new Dimension(51, 51));b15.setPreferredSize(new Dimension(51, 51));
		b16.setPreferredSize(new Dimension(51, 51));b17.setPreferredSize(new Dimension(51, 51));b18.setPreferredSize(new Dimension(51, 51));b19.setPreferredSize(new Dimension(51, 51));b20.setPreferredSize(new Dimension(51, 51));
		
		f.add(b1);f.add(b2);f.add(b3);f.add(b4);f.add(b5);
		f.add(b6);f.add(b7);f.add(b8);f.add(b9);f.add(b10);
		f.add(b11);f.add(b12);f.add(b13);f.add(b14);f.add(b15);
		f.add(b16);f.add(b17);f.add(b18);f.add(b19);f.add(b20);
		
		
		f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		f.setVisible(true);	

							


3 个答案

胡乱起个名
答案时间:2024-01-31
// update

M_GX
答案时间:2022-05-01
极简

First_Auraro
答案时间:2021-11-21



回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
答案 或者 代码至少填写一项, 如果是自己有问题,请重新提问,否则站长有可能看不到





2021-04-13 有什么方法可以竖直排列吗?
byxdbyj玉

有什么方法可以竖直排列吗?







回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
答案 或者 代码至少填写一项, 如果是自己有问题,请重新提问,否则站长有可能看不到




2020-05-02 计算器
2020-02-23 简单版
2019-04-06 那个中间模板感觉看着有点别扭


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

提问之前请登陆
提问已经提交成功,正在审核。 请于 我的提问 处查看提问记录,谢谢
关于 JAVA 中级-图形界面-布局器 的提问

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

上传截图