美化界面

一、前言
二、添加背景图
- 1.注意事项
- 2.创建图片对象
- 3.创建JLabel的对象（一个用来放图片的容器）
- 4.调整位置
- 5.将容器放到界面中
- 6.优化代码
三、添加边框
- 1.查看源码
- 2.查看API帮助文档
- 3.查看BevelBorder方法
- 4.阅读BevelBorder源码
四、完整代码
五、结语

一、前言

在了解完了三种监听事件后，接下来我们要把监听事件正式运用到到拼图小游戏中，但是在绑定监听事件以前，我们要先对这个游戏界面进行美化，让它的界面不再是光秃秃的，在实际开发过程中也不用担心图片设计的问题，一般会交给UI设计的小伙伴来完成（如果是一个人完成一个项目的话…那当我没说）话不多说，我们进入今天的主题

二、添加背景图

1.注意事项

由于要添加背景图片，所以这里所有的代码都要写在 initImage() 方法内
这里要注意：先加载的图片在上方，后加载的图片在下方，所以我们要把创建背景图的代码放在我们之前创建十五个小图片的代码后面，否则会出现背景图片将我们要拼的图片覆盖的情况（如下图）

2.创建图片对象

如果这一步不会的话，可以看【Java实现拼图小游戏（3）—— 添加图片（含JFrame源码阅读）】回顾一下

ImageIcon bg = new ImageIcon("图片路径")

3.创建JLabel的对象（一个用来放图片的容器）

JLabel background = new JLabel(bg)

4.调整位置

这里小伙伴可以自己调整一下之前添加图片的位置和背景图片的位置，不一定要按照我的来写，之前添加的图片一定要调整使其放在背景图片内

background.setBounds(42,21,508,560);

5.将容器放到界面中

注意：隐藏容器要手动获取，图片放在这个隐藏容器中，默认图片放在正中间，所以我们要取消默认设置，并以 XY 轴坐标形式来存放图片
取消默认设置图片放置位置已经在initJFrame()方法中写了，所以我们不需要再写一遍
手动获取隐藏容器：getContentPane()
获取隐藏容器后还要再向容器内添加JLabel的对象

this.getContentPane().add(background);

6.优化代码

这里可以把2、3步的代码合在一起，如果分开写也是完全可以的

JLabel background = new JLabel(new ImageIcon("图片路径"));

三、添加边框

1.查看源码

使用setBorder()来实现设置边框
选中 setBorder 后 Ctrl+B跟进查看源码
再选中Border后跟进，发现这是一个接口

2.查看API帮助文档

搜索一下Border来查看一下它有哪些实现类，这么多的实现类看的眼花缭乱，那么我们就点开来看看。哪个是我们需要的，这里我们选择 BevelBorder来实现我们添加边框的效果

3.查看BevelBorder方法

Modifier and Type	Method and Description
int getBevelType()	返回斜角边框的类型

Insets getBorderInsets(Component c, Insets insets)	初始化参数和边界的插图插图
Color getHighlightInnerColor()	返回斜角边框的内部突出显示颜色
Color getHighlightInnerColor(Component c)	当渲染到指定的组件时，返回斜角边框的内部突出显示颜色
Color getHighlightOuterColor()	返回斜角边框的外部突出显示颜色
Color getHighlightOuterColor(Component c)	当渲染到指定的组件时，返回斜角边框的外部突出显示颜色
Color getShadowInnerColor()	返回斜角边框的内部阴影颜色
Color getShadowInnerColor(Component c)	当渲染到指定的组件时，返回斜角边框的内部阴影颜色
Color getShadowOuterColor()	返回斜角边框的外部阴影颜色
Color getShadowOuterColor(Component c)	当渲染到指定的组件时返回斜角边框的外部阴影颜色
boolean isBorderOpaque()	返回是否边框是不透明的
void paintBorder(Component c, Graphics g, int x, int y, int width, int height)	用指定的位置和大小绘制指定组件的边框

4.阅读BevelBorder源码

由于我们不知道括号内传递的是什么参数，所以最直接的方法就是去看源码！
我们的代码如下，但是打问号的地方我们只知道是int类型的参数，但是具体该填哪个数字我们不知道，那么就去看看源码

jLabel.setBorder(new BevelBorder(？？？));

选中BevelBorder后跟进查看源码

this关键字调用本类中的对象，那么我们 选中this后的bevelType再跟进一次

一共两个参数，对应效果也有体现，或许光看描述不知道哪个更好看，那么都试验一下

参数为1

参数为0

我们选择自己喜欢的就好，这里我选择了参数为0

四、完整代码

 private void initImage() {//添加十五张小图片for(int i = 0; i < 4; i++){for(int j = 0; j < 4; j++){int number = data[i][j];JLabel jLabel = new JLabel(new ImageIcon("F:\\IDEA\\PuzzleGame\\image\\image\\animal\\animal3\\"+ number +".jpg"));//设置小图片的位置及大小jLabel.setBounds(105 * j + 85, 105 * i + 115,105,105);//设置边框效果jLabel.setBorder(new BevelBorder(0));//将图片添加到界面中this.getContentPane().add(jLabel);}}//添加背景图片JLabel background = new JLabel(new ImageIcon("F:\\IDEA\\PuzzleGame\\image\\image\\background.png"));//设置背景图片位置及大小background.setBounds(42,21,508,560);//将背景图片添加到界面中this.getContentPane().add(background);}

五、结语

接下来的文章就要实现移动图片的效果了！！！也可以把之前学习的绑定监听事件运用到实际开发中，最后如果是第一次看到这篇文章的小伙伴对拼图小游戏感兴趣的话可以点击查看【拼图小游戏（Java）】专栏，跟着一起写出这个小游戏

Java实现拼图小游戏（5）—— 美化界面（含源码阅读）相关推荐

边玩边学，13个 Python 小游戏真有趣啊(含源码)
经常听到有朋友说,学习编程是一件非常枯燥无味的事情.其实,大家有没有认真想过,可能是我们的学习方法不对? 比方说,你有没有想过,可以通过打游戏来学编程? 今天我想跟大家分享几个Python小游戏,教你 ...
汉字大英雄-赚钱类小游戏脚本系列（含源码）
"ui"; //更多精品源码请访问:https//01jb.cn/ var 软件名 = "汉字大英雄" var 包名 = "com.ruiqugame ...
cocos2d-x 学习笔记（4）cocos2d-x 小游戏类似打地鼠（含源码）
源码下载 http://download.csdn.net/detail/u011261250/5719559 这是我自学一星期写的,cocos2d-x版本是2.1.4,是一个简单的类似打地鼠的游戏, ...
使用Python制作个消灭病毒的小游戏吧（教程含源码）
近年来,电子游戏有了很大的发展.大约十年前,(那时我还不知道自己的名字怎么拼)我最喜欢的手机游戏是"space-impact":我曾经在诺基亚的手机上玩过. 这很容易,也很有趣! ...
java对拼图小游戏的简单实现（详解）
使用Java编写拼图小游戏主要包括: 初始化界面初始化菜单初始化数据初始化图片其他必要功能的实现这几部分.在进行细分时包括了菜单的搭建,添加图片,打乱图片位置,让图片移动起来,查看完整图片, ...
JAVA课程设计（小游戏贪吃蛇）完整源码附素材（二）
目录 JAVA课程设计(小游戏贪吃蛇)完整源码附素材(一) JAVA课程设计(小游戏贪吃蛇)完整源码附素材(二) JAVA课程设计(小游戏贪吃蛇)完整源码附素材(三) 前言 1. 任务描述 1.1 ...
基于JAVA网页小游戏交流论坛计算机毕业设计源码+数据库+lw文档+系统+部署
基于JAVA网页小游戏交流论坛计算机毕业设计源码+数据库+lw文档+系统+部署基于JAVA网页小游戏交流论坛计算机毕业设计源码+数据库+lw文档+系统+部署本源码技术栈: 项目架构:B/S架构开 ...
java游戏下载象棋暗棋_JS小游戏之象棋暗棋源码详解
本文实例讲述了JS小游戏的象棋暗棋源码,分享给大家供大家参考.具体如下: 游戏运行后如下图所示: Javascript 部分: /** chinese chess * Author: fdipzone ...
java计算机毕业设计HTML5游戏网站设计与实现源码+mysql数据库+系统+lw文档+部署
技术栈项目架构:B/S架构开发语言:Java语言开发软件:idea eclipse 前端技术:Layui.HTML.CSS.JS.JQuery等技术后端技术:JAVA 运行环境:Win10.J ...

Java实现拼图小游戏（5）—— 美化界面（含源码阅读）