设计3D标签
java自带的Label太枯燥了,真是拿不出手啊。
所以,我们要设计3D标签!!
看看下面这张图
原理
看看这图,可以看到哈哈有三种颜色:白色、黑色和灰色
实现的时候并不像PS那样,按几个按钮就O了
其实实际是画出3个“哈哈”,一种白色,一种黑色,一种灰色
然后想象一下,如果三种颜色的”哈哈“,重叠了起来,只留下了很小的一部分,那么就形成了阴影。
既然有三种颜色的”哈哈“,那么就需要画三次。
下面开始,我们将左上角的阴影(白色的哈哈)称为左阴影,将右下角的阴影称为由右阴影
此时阴影的位置就显得格外重要了,需要自定义左右阴影的偏移量
总所周知,对于位置的表示是坐标即横纵坐标,这时就需要设置4个偏移量——左阴影x、左阴影y、右阴影x、右阴影y
然后覆盖JLabel类中的paintComponent方法,原本这个方法只是花一次,现在我们让他画3次!!
代码实现
import java.awt.*;
import javax.swing.*;
public class ThreeDLabel extends JLabel{
private int tracking;//这是字符空隙
private int left_x,left_y,right_x,right_y;//四个阴影偏移量
private Color left_color,right_color;// 左右阴影的颜色
public ThreeDLabel(String text,int tracking){//参数为文本内容和字符空隙
super(text);
this.tracking=tracking;
}
//设置左阴影
public void setLeftShadow(int left_x,int left_y,Color left_color){
this.left_x=left_x;
this.left_y=left_y;
this.left_color=left_color;
}
//设置右阴影
public void setRightShadow(int right_x,int right_y,Color right_color){
this.right_x=right_x;
this.right_y=right_y;
this.right_color=right_color;
}
//重写getPreferredSize()方法,如果在通过setSize来设置尺寸的话,可以不覆写这个方法
public Dimension getPreferredSize(){
int x,y;
FontMetrics font=this.getFontMetrics(this.getFont());
x=(getText().length()-1)*tracking+left_x+right_x+font.stringWidth(getText());//宽=字符串所有字符空隙之和+左阴影x值+右阴影x值+字符串的宽度
y=font.getHeight()+left_y+right_y;
return new Dimension(x,y);
}
//重点!!覆写paintComponent,以达到画3次就能画出阴影效果
public void paintComponent(Graphics g){
//这句感觉是可有可无的,目的是让字体圆润柔和些,就像PS的饱和效果
((Graphics2D)g).setRenderingHint(RenderingHints.KEY_TEXT_ANTIALIASING,RenderingHints.VALUE_TEXT_ANTIALIAS_ON);
char[] chars=getText().toCharArray();
FontMetrics fm=this.getFontMetrics(getFont());
int h=fm.getAscent();
int x=0;
for(char c:chars){
int w=fm.charWidth(c)+tracking;//w=字符c的宽度+字符间隙
//画作阴影
g.setColor(left_color);
g.drawString(c+"",x-left_x,h-left_y);
//画右阴影
g.setColor(right_color);
g.drawString(c+"",x+right_x,h+right_y);
//画正文
g.setColor(getForeground());
g.drawString(c+"",x,h);
x+=w;
}
//这句话感觉也没什么用,目的是把anti-alising状态恢复到默认值
((Graphics2D)g).setRenderingHint(RenderingHints.KEY_TEXT_ANTIALIASING,RenderingHints.VALUE_TEXT_ANTIALIAS_DEFAULT);
}
}
下面是实例代码
class Demo{
public static void main(String[] args){
DIYLabel label=new DIYLabel("小柒再出发",40);
label.setLeftShadow(2,1,Color.white);//设置左阴影属性
label.setRightShadow(4,5,Color.gray);//设置右阴影属性
label.setForeground(Color.black);//设置正文颜色
label.setFont(label.getFont().deriveFont(140f));//设置字体大小为140像素
JFrame frame=new JFrame("title");
frame.getContentPane().add(label);
frame.pack();//窗口自动调节大小
frame.setVisible(true);
}
}
结果如图
几个解释的地方
为什么要有一个字符间隙tracking?
因为:当右阴影的偏移量过大时,右阴影可能就会跑到下一个字符所在的地方,这样看起来就很难看的
上图看看有字符间隙和没有字符间隙的区别
这个图的字符间隙是0,右阴影的偏移量right_x=60,right_y=40
可以看到,前一个字的右阴影和下一个字都挤到了一起了
这张图的字符间隙为80,阴影的偏移量和上一个字一样
有了字符间隙,就可以避免前一个字的阴影和下一个字挤到了一起
所以字符间隙至少是left_x+right_x
为什么要重写getPrefferedSize()?
因为pack()这个方法,可以自动调节窗口的尺寸(前提是有布局管理器,也就是不是绝对布局)
然后pack()这个方法的原理是根据每个组件的最适尺寸来安排窗体的尺寸的,也就是每个组件的getPrefferedSize()方法
现在已经知道了getPrefferedSize()的用处了,然后我们来讲讲如果不重写getPrefferedSize()会怎么样?
原始的getPrefferedSize()方法的实现是根据Label的文本信息、图标、文本信息与图标之间的距离来安排最佳尺寸的
然而原始的文本信息是没有阴影的,所以最佳尺寸也就没有加上阴影的尺寸和字符间距
这会使得,最佳尺寸偏小,甚至右边或左边的字有一部分显示不出来(超出了组件的尺寸)
画三遍的顺序有讲究
画阴影和正文的顺序有讲究,因为画画的时候,当下一次画画的时候与上一次画画有重复的部分,那么下一次画画就会覆盖上一次的部分
所以,应该先画左右阴影(左右阴影的顺序没有讲究),最后再画正文,要确保正文不被覆盖,阴影一定要被覆盖
设计3D标签的更多相关文章
- css3实践之摩天轮式图片轮播+3D正方体+3D标签云(perspective、transform-style、perspective-origin)
本文主要通过摩天轮式图片轮播的例子来讲解与css3 3D有关的一些属性. demo预览: 摩天轮式图片轮播(貌似没兼容360 最好用chrome) 3D正方体(chrome only) 3D标签云(c ...
- SP2010 3D标签云Web部分--很酷的效果,强烈推荐!!
SP2010 3D标签云Web部分--很酷的效果.强烈推荐! ! 项目描述叙事 基于简单Flash的3D标签云Web部件.SP Server 2010使用. 建立在内置标签云Web部件 ...
- 解析3D标签云,其实很简单
声明:本文为原创文章,如需转载,请注明来源WAxes,谢谢! 最近开始用canvas搞3D了,搞得也是简单的东西,就是球体转圈.做出来后,突然想起以前看过的3D标签云,在以前觉得真心狂拽酷炫叼啊,当时 ...
- 3D标签
动态实现3D标签, 主要代码: // // XLMatrix.h // XLSphereView // // Created by 史晶晶 on 16/4/4. // Copyright © 2016 ...
- 十. 图形界面(GUI)设计3.标签、按钮和按钮事件
标签和按钮也许是图形界面中最常见的两种组件,按钮又总是与激发动作事件有关. 标签 标签(JLabel)是最简单的Swing组件.标签对象的作用是对位于其后的界面组件作说明.可以设置标签的属性,即前景色 ...
- jquery 3D 标签云
http://www.gbin1.com/technology/jquerynews/20111205tagcloudbyjquery/index.html 相关选项 zoom: 90 初始的缩放度 ...
- 【HMTL】3D标签球
这是一个3D TAG 在网站展示中是个不错的东东,能让人眼前一亮,值得收藏. 这个是效果: 源码下载: 点 击 下 载
- 纯JS实现的3D标签云,不依赖不论什么第三方库,支持移动页面
<span style="font-family: Arial, Helvetica, sans-serif;"><!DOCTYPE html PUBLIC &q ...
- 程序员每日一乐:html动态烟花设计 3D
3D版烟花 效果图:file:///C:/Users/QianXin/Desktop/3D%E7%83%9F%E8%8A%B1.html 经过一天的的工作或者学习是否感到枯燥乏味?现在的你是否想找些乐 ...
随机推荐
- Linux常用命令03
上篇我们写到,如何编辑文件,我们有时候,在编辑的时候,有可能会异常的退出,这样的话, linux会针对这个文件生成一个swp文件,当你下次进入vi模式时,就会提示你一个错误 这样,即使你按enter键 ...
- Liferay7 BPM门户开发之37: Liferay7下的OSGi Hook集成开发
hook开发是Liferay客制扩展的一种方式,比插件灵活,即可以扩展liferay门户,也能对原有特性进行更改,Liferay有许多内置的服务,比如用hook甚至可以覆盖Liferay服务. 可作为 ...
- java的LINQ :Linq4j简明介绍
开发JAVA一段时间,面临的一大问题就是集合操作,习惯了LINQ的简洁语法,对JAVA的集合操作实在是无甚好感,只能通过C系的循环实现筛选等操作,由于没有延迟执行特性,内存占用实在不敢恭维.因此便在网 ...
- [algorithm] My rookie plan to start
若干年后,经验有一些,但根基不牢靠.[algorithm] series 借助学习Standard Template Library: Algorithms的这段时期,在自己的算法和c++基础方面加些 ...
- 简单设置,解决使用webpack前后端跨域发送cookie的问题
最近用vue来做项目,用webpack来做前端自动化构建.webpack-dev-server会在本地搭建一个服务器,在和后端调试的时候,就会涉及到跨域的问题. 刚开始时,没有用vue-cli来构建项 ...
- PetaPoco - 轻量级高性能的ORM框架(支持.NET Core)
我们都知道ORM全称叫做Object Relationship Mapper,也就是可以用object来map我们的db. 而且市面上的orm框架有很多,有重量级的Entity Framework,有 ...
- JS魔法堂: Native Promise Only源码剖析
一, 前言 深入学习Promise的朋友应该都看过<深入理解Promise五部曲>这一系列的文章, 以解除回调地狱之外的观点来剖析Promise更多的内涵,确实十分精彩. Part 1: ...
- Data URL简介及Data URL的利弊
之前写过一篇“漫谈前端优化”的文章,里面提到过DataUrl,粗鲁的描述了下,感觉不甚详焉,所以这几天也总结了这方面的知识,参考一些资料,补充一篇文章在这里,对这方面的资料来说,也是一种强化记忆应用: ...
- [转]virtualenv建立多个Python独立开发环境
不同的人喜欢用不同的方式建立各自的开发环境,但在几乎所有的编程社区,总有一个(或一个以上)开发环境让人更容易接受. 使用不同的开发环境虽然没有什么错误,但有些环境设置更容易进行便利的测试,并做一些重复 ...
- Razor语法
1. 截取字符串 @(i.Title.Length > 18 ? i.Title.Substring(0, 18) + "" : i.Title) 2. 格式化日期 @s ...