- 追加された行はこの色です。
- 削除された行はこの色です。
TITLE:JTextAreaをキャプションとして画像上にスライドイン
#navi(../)
RIGHT:Posted by &author(aterai); at 2011-05-09
*JTextAreaをキャプションとして画像上にスライドイン [#wf8e9a74]
画像の上にJTextAreaをスライドインアニメーションで表示します。
-&jnlp;
-&jar;
-&zip;
//#screenshot
#ref(https://lh4.googleusercontent.com/_9Z4BYR88imo/Tcd9MqA6BlI/AAAAAAAAA64/Q7KLCkUETZ4/s800/EaseInOut.png)
**サンプルコード [#i6cf925e]
#code(link){{
private int delay = 4;
private int count = 0;
@Override public void mouseEntered(MouseEvent e) {
if(animator!=null && animator.isRunning() ||
yy==textArea.getPreferredSize().height) return;
final double h = (double)textArea.getPreferredSize().height;
animator = new javax.swing.Timer(delay, new ActionListener() {
@Override public void actionPerformed(ActionEvent e) {
double a = easeInOut(++count/h);
yy = (int)(.5d+a*h);
textArea.setBackground(new Color(0f,0f,0f,(float)(0.6*a)));
if(yy>=textArea.getPreferredSize().height) {
yy = textArea.getPreferredSize().height;
animator.stop();
}
revalidate();
repaint();
}
});
animator.start();
}
@Override public void mouseExited(MouseEvent e) {
if(animator!=null && animator.isRunning() ||
contains(e.getPoint()) && yy==textArea.getPreferredSize().height) return;
final double h = (double)textArea.getPreferredSize().height;
animator = new javax.swing.Timer(delay, new ActionListener() {
@Override public void actionPerformed(ActionEvent e) {
double a = easeInOut(--count/h);
yy = (int)(.5d+a*h);
textArea.setBackground(new Color(0f,0f,0f,(float)(0.6*a)));
if(yy<=0) {
yy = 0;
animator.stop();
}
revalidate();
repaint();
}
});
animator.start();
}
//@see Math: EaseIn EaseOut, EaseInOut and Beziér Curves | Anima Entertainment GmbH
//http://www.anima-entertainment.de/math-easein-easeout-easeinout-and-bezier-curves
//Math: EaseIn EaseOut, EaseInOut and Beziér Curves | Anima Entertainment GmbH]
public double easeInOut(double t) {
//range: 0.0<=t<=1.0
if(t<0.5d) {
return 0.5d*Math.pow(t*2d, 3d);
}else{
return 0.5d*(Math.pow(t*2d-2d, 3d) + 2d);
}
}
}}
**解説 [#b1064c6f]
上記のサンプルでは、JLabelに画像を表示し、これにマウスカーソルが入った場合、JTextAreaがキャプションとしてease-in,ease-outでスライドインするようになっています。
- OverlayLayout#layoutContainer内で、JTextAreaのy座標を変更してアニメーション
- EaseInOutの計算は、[http://www.anima-entertainment.de/math-easein-easeout-easeinout-and-bezier-curves Math: EaseIn EaseOut, EaseInOut and Beziér Curves | Anima Entertainment GmbH]を参考
- マウスカーソルがJLabel(画像)内にあっても、そこにJTextAreaがスライドインした場合、mouseExitedが発生するので、注意
-- JTextArea#contains(int x, int y) が常にfalseを返すようにすれば、上記の場合でもmouseExitedなどは発生しないが、JTextArea内の文字列が選択できなくなるので、このサンプルでは、JTextAreaにマウスイベントを親へ素通しするリスナーを追加している
- JTextAreaの背景色はsetOpaque(false)にして描画せず、別途JTextArea#paintComponent(...)をオーバーライドしてアルファ成分をEaseInOutした色で全体を塗りつぶしている
----
メモ: 累乗をMath.powの代わりにバイナリ法で
- [http://d.hatena.ne.jp/pcl/20120617/p1 指数が整数ならMath.powは使うな - DoMshi]
- [http://d.hatena.ne.jp/rexpit/20110328/1301305266 整数のべき乗 - rexpit's programming memo]
- [http://c2.com/cgi/wiki?IntegerPowerAlgorithm Integer Power Algorithm]
- [http://www.osix.net/modules/article/?id=696 The Power Algorithm - How a programmer can save time rising a real number to the power of a positive integer number. The code is dot.net but it's easily adaptable to any other language.]
#code{{
public static double intpow(double x, int n) {
double aux = 1.0;
if(n < 0) {
throw new IllegalArgumentException("n must be a positive integer");
}
for(; n > 0; x *= x, n >>>= 1) {
if((n & 1) != 0) {
aux *= x;
}
}
return aux;
}
}}
**参考リンク [#wdb4f6db]
- [http://www.anima-entertainment.de/math-easein-easeout-easeinout-and-bezier-curves Math: EaseIn EaseOut, EaseInOut and Beziér Curves | Anima Entertainment GmbH]
- [http://css-tricks.com/slide-in-image-captions/ Slide In Image Captions | CSS-Tricks]
- [http://radiumsoftware.tumblr.com/post/5031889912 指数関数を使ったお手軽イーズ・アウト - Radium Software]
- [http://radiumsoftware.tumblr.com/post/10719023826 Soft maximum 関数 - Radium Software]
- [http://wonderfl.net/c/3GhW イーズイン/アウトいろいろ - wonderfl build flash online]
**コメント [#c7b3d96a]
#comment