Fügen Sie ein komplexes Bild im Bedienfeld mit Schaltflächen um es in einer benutzerdefinierten Benutzeroberfläche

Question

Wie kann ich dieses Bild wie folgt in die slavePanel und darüber JPanel passen die JButtons, die wie das Bild aussieht, aber Schaltflächen korrekt verpackt um?

// 
    // Shot Gun mover up/down/left/right, middle on is for zoom 
    // 
    public void GunMover(JPanel configPanel) throws IOException { 

    // Master Panel - holds everything 
    JPanel masterPanel = new Panel(); 
    masterPanel.setLayout(new SpringLayout()); 

    // Slave Panel - with image background 
    JPanel slavePanel = new Panel(); 
    slavePanel.setLayout(new SpringLayout()); 

    // Row 1 
    final JButton ptzLeft = new JButton("<");  
    masterPanel.add(ptzLeft, BorderLayout.WEST); 

    // Row 2 
    final JButton ptzRight = new JButton(">"); 
    masterPanel.add(ptzRight, BorderLayout.CENTER);  

    // Row 3 
    final JButton ptzUp = new JButton("^"); 
    masterPanel.add(ptzUp, BorderLayout.WEST);  

    // Row 4 
    final JButton ptzDown = new JButton("down"); 
    masterPanel.add(ptzDown, BorderLayout.CENTER);  

    // How do i add slavePanel this background and add all the JButtons 
    // According to that image shape? 

    // Layout the panel. 
    SpringUtilities.makeCompactGrid(masterPanel, 
           1, 4, //rows, cols 
           6, 6, //initX, initY 
           6, 6);   

    configPanel.setLayout(new GridLayout(0,1)); 
    configPanel.add(masterPanel); 
    } 

Follow up (Momentan sind sie in 1 Zeile 4 Spalte förmig): Excellent eine aus Andrew Thompson + at-dest mein gebrochenes Methode

package test; 

import java.awt.*; 
import java.awt.font.FontRenderContext; 
import java.awt.font.TextLayout; 
import javax.swing.*; 

public class New extends JFrame { 

    private static final long serialVersionUID = 1L; 
    private ImageIcon errorIcon = 
      (ImageIcon) UIManager.getIcon("OptionPane.errorIcon"); 
    private Icon infoIcon = 
      UIManager.getIcon("OptionPane.informationIcon"); 
    private Icon warnIcon = 
      UIManager.getIcon("OptionPane.warningIcon"); 

    public static void main(String[] args) { 
    SwingUtilities.invokeLater(new Runnable() { 
     @Override 
     public void run() { 
     New t = new New(); 
     } 
    }); 
    } 

    public New() { 
    setLayout(new BorderLayout()); 

    JPanel slavePanel = new NewPanel(); 
    slavePanel.setLayout(new GridLayout(0, 2, 4, 4)); 
    add(slavePanel);  

    JButton button = new JButton(); 
    button.setBorderPainted(false); 
    button.setBorder(null); 
    button.setFocusable(false); 
    button.setMargin(new Insets(0, 0, 0, 0)); 
    button.setContentAreaFilled(false); 
    button.setIcon((errorIcon)); 
    button.setRolloverIcon((infoIcon)); 
    button.setPressedIcon(warnIcon); 
    button.setDisabledIcon(warnIcon); 
    slavePanel.add(button);  

    setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); 
    pack(); 
    setVisible(true); 
    } 
} 


package test; 

import java.awt.*; 
import java.io.IOException; 
import java.io.InputStream; 
import javax.imageio.ImageIO; 
import javax.swing.*; 
import javax.swing.border.Border; 

public class NewPanel extends JPanel { 

    private Image imageGui; 
    private static Dimension screen; 

    public NewPanel() { 
    try { 
     imageGui = 
       ImageIO.read(
       (InputStream) NewPanel.class.getResourceAsStream(
       "/image/ptz.png")); 
    } catch (IOException e) { 
     e.printStackTrace(System.err); 
    } 

    Border border = BorderFactory.createEmptyBorder(11, 11, 11, 11); 
    setOpaque(true); 
    setBorder(border); 
    setFocusable(true); 
    setSize(getPreferredSize()); 
    revalidate(); 
    repaint(); 
    setVisible(true); 
    } 

    public void paintComponent(Graphics g) { 
    super.paintComponent(g); 
    g.drawImage(imageGui, 0, 0, 
      imageGui.getWidth(null), imageGui.getHeight(null), null); 
    revalidate(); 
    repaint(); 
    } 

    @Override 
    public Dimension getPreferredSize() { 
    return new Dimension(imageGui.getWidth(null), imageGui.getHeight(null)); 
    } 
} 

Answer 1

1. ein 3x3 GridLayout
2. Verwendung Für jede der 9-Zellen erhält eine untergeordnete Bild:
   • Für jede zweite Komponente ein Etikett mit der Unter-Bild hinzufügen.
   • Fügen Sie für jede andere Komponente eine JButton hinzu, aus der der Speicherplatz entfernt wird. Verwenden Sie das Unterbild als Symbol, aber Sie benötigen alternative Symbole, um Fokus, Aktivierung usw. anzugeben. In diesem Beispiel wird ein roter Rahmen um das "gedrückte" Symbol gelegt.

import java.awt.*; 
import java.awt.event.*; 
import java.awt.image.BufferedImage; 
import javax.swing.*; 
import java.io.IOException; 
import java.net.URL; 
import javax.imageio.ImageIO; 

public class CompassButtons { 

    public CompassButtons(BufferedImage bi) { 
     int w = bi.getWidth(); 
     int h = bi.getHeight(); 
     int step = w/3; 
     JPanel p = new JPanel(new GridLayout(3,3)); 
     p.setOpaque(false); 
     int count = 0; 
     for (int ii=0; ii<w; ii+=step) { 
      for (int jj=0; jj<h; jj+=step) { 
       // This is it - GET THE SUB IMAGE 
       Image icon = bi.getSubimage(jj, ii, step, step); 
       if (count%2==1) { 
        JButton button = new JButton(new ImageIcon(icon)); 

        // remove the border - indicate action using a different icon 
        button.setBorder(null); 

        // make a 'pressed' icon.. 
        BufferedImage iconPressed = new BufferedImage(step,step,BufferedImage.TYPE_INT_ARGB); 
        Graphics g = iconPressed.getGraphics(); 
        g.drawImage(icon, 0, 0, p); 
        g.setColor(Color.RED); 
        g.drawRoundRect(
          0, 0, 
          iconPressed.getWidth(p)-1, iconPressed.getHeight(p)-1, 
          12, 12); 
        g.dispose(); 
        button.setPressedIcon(new ImageIcon(iconPressed)); 

        // make it transparent 
        button.setContentAreaFilled(false); 

        button.setActionCommand(""+count); 
        button.addActionListener(new ActionListener(){ 
         @Override 
         public void actionPerformed(ActionEvent ae) { 
          System.out.println(ae.getActionCommand()); 
         } 
        }); 

        p.add(button); 
       } else { 
        JLabel label = new JLabel(new ImageIcon(icon)); 
        p.add(label); 
       } 
       count++; 
      } 
     } 
     JPanel center = new JPanel(new GridBagLayout()); 
     center.setBackground(Color.BLACK); 
     center.add(p); 
     JOptionPane.showMessageDialog(null, center); 
    } 

    public static void main(String[] args) throws IOException { 
     URL url = new URL("http://i.stack.imgur.com/SNN04.png"); 
     final BufferedImage bi = ImageIO.read(url); 
     SwingUtilities.invokeLater(new Runnable(){ 
      @Override 
      public void run() { 
       new CompassButtons(bi); 
      } 
     }); 
    } 
} 

Answer 2

1) Sie müssen die Icons vor und für jeweils 5 JButtons vorbereiten (event here came from ButtonModel)

• Grund Icon ohne Fokus

• Icon für isRollover()

• Icon für isPressed()

2) how to set Icons and to remove all "balast" from JButton

3) setzen diese 012.zum JPanel mit gemalten Kreisen (RemoteSet)

Answer 3

von diesem example Ab bekam ich einen Start von MoveButton wie folgt zu ändern:

this.setBorderPainted(false); 

Sie ControlPanel ein Custom Layout Manager geben könnte. Ich würde auch ein Hintergrundbild und eine Art visuelles Feedback hinzufügen, das auf dem ButtonModel-Status basiert, wie es here vorgeschlagen wurde.