Swing/TranslucentButton のバックアップソース(No.4)
- バックアップ一覧
- 差分 を表示
- 現在との差分 を表示
- 現在との差分 - Visual を表示
- バックアップ を表示
- Swing/TranslucentButton へ行く。
- 1 (2012-12-31 (月) 06:46:18)
- 2 (2012-12-31 (月) 12:49:52)
- 3 (2013-05-31 (金) 14:22:09)
- 4 (2014-05-10 (土) 23:40:38)
- 5 (2014-05-11 (日) 16:18:49)
- 6 (2014-05-11 (日) 17:22:39)
- 7 (2014-05-14 (水) 16:01:32)
- 8 (2014-09-16 (火) 00:01:32)
- 9 (2014-10-03 (金) 14:19:30)
- 10 (2014-10-24 (金) 16:32:18)
- 11 (2014-11-13 (木) 14:33:22)
- 12 (2014-11-23 (日) 16:56:34)
- 13 (2015-03-26 (木) 15:41:56)
- 14 (2016-06-24 (金) 16:33:33)
- 15 (2017-06-01 (木) 12:30:47)
- 16 (2018-02-24 (土) 19:51:30)
- 17 (2018-05-23 (水) 21:17:50)
- 18 (2019-08-15 (木) 14:39:18)
- 19 (2021-04-10 (土) 02:28:52)
TITLE:JButtonを半透明にする #navi(../) #tags(JButton, Translucent, GradientPaint, Icon, Html, OverlayLayout, JLabel) RIGHT:Posted by &author(aterai); at 2012-12-31 * JButtonを半透明にする [#v7bccd63] 半透明な`JButton`を作成します。 #download #ref(https://lh3.googleusercontent.com/-W5o-8ilpY6k/UOCzLo2oOeI/AAAAAAAABZ0/m1_AjYpKqiY/s800/TranslucentButton.png) ** サンプルコード [#r4eab624] #code(link){{ class TranslucentButton extends JButton{ private static final Color TL = new Color(1f,1f,1f,.2f); private static final Color BR = new Color(0f,0f,0f,.4f); private static final Color ST = new Color(1f,1f,1f,.2f); private static final Color SB = new Color(1f,1f,1f,.1f); private Color ssc; private Color bgc; private int r = 8; public TranslucentButton(String text) { super(text); } public TranslucentButton(String text, Icon icon) { super(text, icon); } @Override public void updateUI() { super.updateUI(); setContentAreaFilled(false); setFocusPainted(false); setOpaque(false); setForeground(Color.WHITE); } @Override protected void paintComponent(Graphics g) { int x = 0; int y = 0; int w = getWidth(); int h = getHeight(); Graphics2D g2 = (Graphics2D)g.create(); g2.setRenderingHint( RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON); Shape area = new RoundRectangle2D.Float(x, y, w-1, h-1, r, r); ssc = TL; bgc = BR; ButtonModel m = getModel(); if(m.isPressed()) { ssc = SB; bgc = ST; }else if(m.isRollover()) { ssc = ST; bgc = SB; } g2.setPaint(new GradientPaint(x, y, ssc, x, y+h, bgc, true)); g2.fill(area); g2.setPaint(BR); g2.draw(area); g2.dispose(); super.paintComponent(g); } } }} ** 解説 [#kc10b7de] - 透明な`JButton`、全体を半透明な`Icon`、タイトルの`Icon`と文字列は`align='middle'`などを指定して配置 -- 参考: [[JRadioButtonを使ってToggleButtonBarを作成>Swing/ToggleButtonBar]] -- `setOpaque(false);`, `setContentAreaFilled(false);`などで、`JButton`自体は透明化 -- タイトル`Icon`と文字列の`align`が、`top`、`middle`、`bottom`のどれにしてもきれいに揃わない -- サイズが固定 -- `MetalLookAndFeel`に変更しても、余計なフチ?が表示されない -- `Html`を使っているので`GTKLookAndFeel`で、`Pressed`時の文字色変更に対応していない #code{{ private static String makeTitleWithIcon(URL u, String t, String a) { return String.format( "<html><p align='%s'><img src='%s' align='%s' /> %s", a, u, a, t); } private static AbstractButton makeButton(String title) { return new JButton(title) { @Override public void updateUI() { super.updateUI(); setVerticalAlignment(SwingConstants.CENTER); setVerticalTextPosition(SwingConstants.CENTER); setHorizontalAlignment(SwingConstants.CENTER); setHorizontalTextPosition(SwingConstants.CENTER); setBorder(BorderFactory.createEmptyBorder()); //setBorderPainted(false); setContentAreaFilled(false); setFocusPainted(false); setOpaque(false); setForeground(Color.WHITE); setIcon(new TranslucentButtonIcon()); } }; } }} - 透明な`JButton`、全体を半透明な`Icon`、タイトルの`Icon`と文字列は`JLabel`を`OverlayLayout`で配置 -- `Html`の`align`ではなく、`Baseline`の揃った`JLabel`を半透明な`JButton`に重ねて表示 -- `JButton`のテキストは空なので、`GTKLookAndFeel`で、`Pressed`時の文字色変更に対応していない #code{{ JLabel label = new JLabel("JLabel", icon, SwingConstants.CENTER); label.setForeground(Color.WHITE); label.setAlignmentX(.5f); b = makeButton(""); b.setAlignmentX(.5f); JPanel p = new JPanel(); p.setLayout(new OverlayLayout(p)); p.setOpaque(false); p.add(label); p.add(b); add(p); }} - 半透明な`JButton` -- `setOpaque(false);`, `setContentAreaFilled(false);`などを設定して`JButton`は透明にし、`JButton#paintComponent(...)`をオーバーライドして半透明の影などを描画 -- %%`MetalLookAndFeel`で、余計なフチ?が表示される%% -- `JButton#setBorderPainted(false);`で、フチを非表示にできる ** 参考リンク [#b8a76b5c] - [[JRadioButtonを使ってToggleButtonBarを作成>Swing/ToggleButtonBar]] - [http://chrfb.deviantart.com/art/quot-ecqlipse-2-quot-PNG-59941546 "ecqlipse 2" PNG by ~chrfb on deviantART] ** コメント [#c2b45262] #comment