[JAVA] JPanel met background image

[JnX]

Ik heb het hele forum en het halve internet gehad, maar ik heb tot nu toe geen oplossing kunnen vinden voor mijn probleem

Voor een project moeten wij een pinautomaat simuleren in de taal JAVA. Ik ben bezig met de GUI en loop tegen een probleem aan. Ik wil een JPanel maken met een plaatje als achtergrond. Het is de bedoeling dat daarover weer een ander JPanel komt met een layout waar tekst op komt.

Kan iemand mij vertellen of dit uberhaupt mogelijk is, en zo ja: hoe?

[Robtimus]

Eenvoudig testje:

Java:

import java.awt.*;
import javax.swing.*;
import nl.icemanx.gui.ImageLabel;

public class Test extends JPanel
{
    public Test(String file)
    {
        setLayout(new OverlayLayout(this));
        JLabel label = new JLabel(new ImageIcon(file));
        JPanel panel = new JPanel();
        panel.add(new JButton("OK"));
        panel.setOpaque(false);
        add(panel);
        add(label);
    }

    public static void main(String[] args)
    {
        JFrame frame = new JFrame();
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.getContentPane().add(new Test(args[0]));
        frame.pack();
        frame.setVisible(true);
    }
}

Resultaat, gestart met een leuk plaatje

Ik weet alleen niet hoe je die balk aan de linkerkant verwijdert.

Even samenvattend: OverlayLayout

[ Voor 14% gewijzigd door Robtimus op 16-02-2004 23:30 ]

[JnX]

Thanks, dit is in ieder geval een begin
Het werkt alleen niet helemaal perfect. Hieronder heb ik het stuk uit mn code gezet waar het om draait. Het JPanel wat bovenop de achtergrond ligt heeft 12 JLabels, waar straks tekst op moet komen. Als ik al die JLabels leeg laat wordt de achtergrond prima weergegeven, maar zodra ik bijvoorbeeld schermLabel5 invul valt er een deel van mijn achtergrond weg

Eventueel het plaatje: http://jnx-neo.mine.nu/Achtergrond.jpg

Java:

import java.awt.*;
import javax.swing.*;
import javax.swing.border.*;

public class Test extends JFrame
{
    
    private JLabel schermLabel1, schermLabel2, schermLabel3, schermLabel4,
        schermLabel5, schermLabel6, schermLabel7, schermLabel8, schermLabel9, 
        schermLabel10, schermLabel11, schermLabel12;
    private JLabel achtergrondLabel;
    private ImageIcon achtergrondPlaatje;
    
    public static void main(String[] args) 
    {
        Test frame = new Test();
        
        frame.pack();
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setVisible(true); 
    }

    public Test()
    {
        
        // Labels aanmaken
        schermLabel1 = new JLabel("");
        schermLabel2 = new JLabel("");
        schermLabel3 = new JLabel("");
        schermLabel4 = new JLabel("");
        schermLabel5 = new JLabel("Hooii");
        schermLabel6 = new JLabel("");
        schermLabel7 = new JLabel("");
        schermLabel8 = new JLabel("");
        schermLabel9 = new JLabel("");
        schermLabel10 = new JLabel("");
        schermLabel11 = new JLabel("");
        schermLabel12 = new JLabel("");

        // Schermachtergrond
        JPanel schermAchtergrond = new JPanel();
        schermAchtergrond.setLayout(new OverlayLayout(schermAchtergrond));
        schermAchtergrond.setBorder(new TitledBorder(""));
        
        // Achtergrondplaatje en label
        achtergrondPlaatje 
          = new ImageIcon(this.getClass().getResource("Achtergrond.jpg"));
        achtergrondLabel = new JLabel(achtergrondPlaatje);
        
        // Het scherm
        JPanel scherm = new JPanel();
        scherm.setLayout(new GridLayout(4, 3));
        scherm.setOpaque(false);

        scherm.add(schermLabel1);
        scherm.add(schermLabel2);
        scherm.add(schermLabel3);
        scherm.add(schermLabel4);
        scherm.add(schermLabel5);
        scherm.add(schermLabel6);
        scherm.add(schermLabel7);
        scherm.add(schermLabel8);
        scherm.add(schermLabel9);
        scherm.add(schermLabel10);
        scherm.add(schermLabel11);
        scherm.add(schermLabel12);

        // Achtergrond en scherm op schermAchtergrond aanbrengen
        schermAchtergrond.add(scherm);
        schermAchtergrond.add(achtergrondLabel);

        getContentPane().add(schermAchtergrond);
    }
}

[ Voor 4% gewijzigd door JnX op 17-02-2004 09:05 ]

[Robtimus]

Omdat het me zelf ook wel een interessant iets leek ben ik zelf maar aan de slag gegaan.

Resultaat:


Componenten toevoegen gaat dmv getPanel().add(...)
Ik heb hem zelfs veilig gemaakt zodat je nooit per ongeluk het main panel kan verwijderen.

Source:
BackgroundPanelTest.java (de test die bovenstaand plaatje opleverde)
BackgroundPanel.java (het panel zelf)
ImageLabel.java (een JLabel die alleen een plaatje afbeeld, heeft wat leuke extra methods)
GuiUtils.java (utility class, om windows te centeren of dialogs te centeren tov een window)

Alles uitgebracht onder de GPL.

[Robtimus]

Eventjes jouw code aangepast zodat ie BackgroundPanel gebruikt:

Java:

import java.awt.*;
import javax.swing.*;
import javax.swing.border.*;
import nl.icemanx.gui.BackgroundPanel;

public class Test extends JFrame
{
    private JLabel schermLabel1, schermLabel2, schermLabel3, schermLabel4,
                   schermLabel5, schermLabel6, schermLabel7, schermLabel8,
                   schermLabel9, schermLabel10, schermLabel11, schermLabel12;
    private JLabel achtergrondLabel;

    public static void main(String[] args)
    {
        Test frame = new Test();
        frame.pack();
        frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        frame.setVisible(true);
    }

    public Test()
    {
        // Labels aanmaken
        schermLabel1 = new JLabel("");
        schermLabel2 = new JLabel("");
        schermLabel3 = new JLabel("");
        schermLabel4 = new JLabel("");
        schermLabel5 = new JLabel("Hooii");
        schermLabel6 = new JLabel("");
        schermLabel7 = new JLabel("");
        schermLabel8 = new JLabel("");
        schermLabel9 = new JLabel("");
        schermLabel10 = new JLabel("");
        schermLabel11 = new JLabel("");
        schermLabel12 = new JLabel("");

        // Schermachtergrond
        String file = this.getClass().getResource("Achtergrond.jpg").getFile();
        BackgroundPanel schermAchtergrond = new BackgroundPanel(
            file, BackgroundPanel.NONE, BackgroundPanel.LEFT, BackgroundPanel.TOP
        );

        JPanel scherm = schermAchtergrond.getPanel();
        schermAchtergrond.setBackground(Color.white);
        scherm.setLayout(new GridLayout(4, 3));
        scherm.setBorder(new TitledBorder(""));

        scherm.add(schermLabel1);
        scherm.add(schermLabel2);
        scherm.add(schermLabel3);
        scherm.add(schermLabel4);
        scherm.add(schermLabel5);
        scherm.add(schermLabel6);
        scherm.add(schermLabel7);
        scherm.add(schermLabel8);
        scherm.add(schermLabel9);
        scherm.add(schermLabel10);
        scherm.add(schermLabel11);
        scherm.add(schermLabel12);

        getContentPane().add(schermAchtergrond);
    }
}

Ik heb je plaatje maar niet getiled in de linkerbovenhoek geplaatst (NONE, LEFT, TOP). Zoals je ziet is het enige dat ik met schermAchtergrond doe de kleur op wit zetten, de rest doe ik met scherm.

[ Voor 9% gewijzigd door Robtimus op 17-02-2004 14:00 ]

[JnX]

Thnx man ! Alleen hoe kom ik aan de package BackgroundPanel? nl.icemanx.gui.BackgroundPanel heb ik uiteraard niet...

Hoe stom kan je zijn Dat is natuurlijk gewoon het bestandje uit je vorige post

[ Voor 30% gewijzigd door JnX op 17-02-2004 14:09 ]

[Robtimus]

JnX schreef op 17 februari 2004 @ 14:07:
Thnx man ! Alleen hoe kom ik aan de package BackgroundPanel? nl.icemanx.gui.BackgroundPanel heb ik uiteraard niet...

Hoe stom kan je zijn Dat is natuurlijk gewoon het bestandje uit je vorige post

np man, ik zal er zelf ook vast nog wel es gebruik van maken. En anders knal ik hem wel op sourceforge oid, kan ie nog beter verspreid worden.

offtopic:
let je bij het evt verspreiden wel ff op de licentie?

[JnX]

Ja dat doe ik, ik zal er verder niet aanzitten hr

Het wil alleen nog niet echt lukken.. Als ik alle bestanden (ImageLabel.java, BackgroundLabel.java, GuiUtils.java) compileer en mijn eigen Test.java (wat jij hebt aangepast) compileer en uitvoer zou hij het moeten doen? Ik krijg namelijk 15 errors Het heeft er vast te maken met jou package. Moet ik die nog aanmaken op een of andere manier?

Test.java:4: package nl.icemanx.gui does not exist
import nl.icemanx.gui.BackgroundPanel;
^
.\BackgroundPanel.java:87: cannot resolve symbol
symbol : class ImageLabel
location: class nl.icemanx.gui.BackgroundPanel
private ImageLabel background;
^
Test.java:40: cannot resolve symbol
symbol : variable NONE
location: class BackgroundPanel
file, BackgroundPanel.NONE, BackgroundPanel.LEFT, BackgroundPanel.TO
P
^
Test.java:40: cannot resolve symbol
symbol : variable LEFT
location: class BackgroundPanel
file, BackgroundPanel.NONE, BackgroundPanel.LEFT, BackgroundPanel.TO
P
^
Test.java:40: cannot resolve symbol
symbol : variable TOP
location: class BackgroundPanel
file, BackgroundPanel.NONE, BackgroundPanel.LEFT, BackgroundPanel.TO
P
^
Test.java:43: cannot resolve symbol
symbol : method getPanel ()
location: class BackgroundPanel
JPanel scherm = schermAchtergrond.getPanel();
^
Test.java:44: cannot resolve symbol
symbol : method setBackground (java.awt.Color)
location: class BackgroundPanel
schermAchtergrond.setBackground(Color.white);
^
Test.java:61: cannot resolve symbol
symbol : method add (BackgroundPanel)
location: class java.awt.Container
getContentPane().add(schermAchtergrond);
^
.\BackgroundPanel.java:152: cannot resolve symbol
symbol : class ImageLabel
location: class nl.icemanx.gui.BackgroundPanel
background = new ImageLabel(file);
^
.\BackgroundPanel.java:240: cannot resolve symbol
symbol : class ImageLabel
location: class nl.icemanx.gui.BackgroundPanel.Layout
remove((ImageLabel)i.next());
^
.\BackgroundPanel.java:258: cannot resolve symbol
symbol : class ImageLabel
location: class nl.icemanx.gui.BackgroundPanel.Layout
ImageLabel tile = (ImageLabel)background.clone();
^
.\BackgroundPanel.java:258: cannot resolve symbol
symbol : class ImageLabel
location: class nl.icemanx.gui.BackgroundPanel.Layout
ImageLabel tile = (ImageLabel)background.clone();
^
.\BackgroundPanel.java:266: cannot resolve symbol
symbol : class ImageLabel
location: class nl.icemanx.gui.BackgroundPanel.Layout
ImageLabel stretch = background.resizeLabel(
^
.\BackgroundPanel.java:302: cannot resolve symbol
symbol : class ImageLabel
location: class nl.icemanx.gui.BackgroundPanel.Layout
ImageLabel img = (ImageLabel)background.clone();
^
.\BackgroundPanel.java:302: cannot resolve symbol
symbol : class ImageLabel
location: class nl.icemanx.gui.BackgroundPanel.Layout
ImageLabel img = (ImageLabel)background.clone();
^
15 errors

[Robtimus]

Alles in 1 directory gooien, dan

code:

javac -d . *.java

Zo deed ik het ook net. Zonder de -d . kan hij idd de package structuur niet herkennen.

PS: je mag de code juist WEL aanpassen, zolang je bij het verspreiden van de aangepaste code maar mijn copyright erbij laat staan en het ook onder de GPL verspreidt.

[ Voor 65% gewijzigd door Robtimus op 17-02-2004 15:09 ]

[JnX]

Hmm.. Sorry dat ik je bezighoud
Maar mijn achtergrond blijft wit

[Robtimus]

Wat ik net nog heb gedaan:
- Ik save BackgroundPanel.java (als .java, niet als .html), GuiUtils.java en ImagePanel.java
- Ik save Achtergrond.java
- Ik copy paste de code die ik heb afgeleid uit jouw code naar Test.java

Ik heb nu in 1 directory 5 bestanden dus: de 4 java files en je plaatje. Vervolgens voer ik uit

code:

javac -d . *.java

gevolgd door

code:

java Test

Et voila, ik zie een (kleine) panel met een (onduidelijk) plaatje en een label. Hier werkt het uitstekend.

Dat de frame zo klein blijft komt door de panel in de BackgroundPanel, deze grootte is zijn preferred size. Als je meer toevoegt zal de initiele grootte ook toenemen.

Zie je wel een plaatje als je een andere achtergrond neemt? Of krijg je misschien errors in de dosbox van waaruit je de app start?

[ Voor 24% gewijzigd door Robtimus op 17-02-2004 15:38 ]

[JnX]

Dat is erg apart
Ik doe precies hetzelfde. Ik krijg geen errors of meldingen, er verschijnt een popupje met de tekst in het midden en een witte achtergrond. Er staat verder ook niks in de map of iets dergelijks..

[Robtimus]

JnX schreef op 17 februari 2004 @ 15:49:
Dat is erg apart
Ik doe precies hetzelfde. Ik krijg geen errors of meldingen, er verschijnt een popupje met de tekst in het midden en een witte achtergrond. Er staat verder ook niks in de map of iets dergelijks..

Wat staat er na de javac actie in de map? De java files, je jpegje, Test.class en een directory nl/?

En weet je zeker dat je je plaatje niet ziet? Dat rode is niet erg duidelijk. Zoals ik al zei, zie je het wel als je een ander plaatje neemt?

[JnX]

Oke, het ligt niet aan jou
Op een andere computer doet ie het wel gewoon.. Misschien ligt het aan mn PATH en CLASSPATH ofzo

[Robtimus]

JnX schreef op 17 februari 2004 @ 15:53:
Oke, het ligt niet aan jou
Op een andere computer doet ie het wel gewoon.. Misschien ligt het aan mn PATH en CLASSPATH ofzo

Als je echo %CLASSPATH% doet, staat daar dan toevalig . (de huidige dir) in?

[JnX]

Er staat: .

[Robtimus]

Ik heb het net nog getest met een lege classpath, maar zelfs dan werkt het.

Vreemd...

[JnX]

Ik snap er inderdaad ook niks van. Op een andere computer doet hij het perfect! Ik zal JAVA maares proberen opnieuw te installeren, misschien dat dat effect heeft.
In ieder geval hardstikke bedankt voor deze mooie oplossing
*respect*

[Verwijderd]

Nu we toch hier mee bezig zijn...hoe is het mogelijk om van een image op de achtergrond (zoals hierboven gedaan met een Jpanel) te zorgen dat je op delen van het plaatje kan klikken???

Doel: Ik heb een plaatje van nederland met alle wegen....ik wil dat de gebruikers hiervan hun vertrekplaats en bestemming door middel van muisklikken kunnen bepalen...

[NDF82]

zie hier

[Robtimus]

Dat werkt alleen niet als er iets volledig over het plaatje heen ligt zoals bij mijn BackgroundPanel dat ook een MouseListener heeft. Is dit nml het geval, dan neemt die laatste alle mouse events op.

Maar idd, MouseListeners are the way to go, want MouseEvents hebben een Point, waarmee je precies kunt bepalen waar geklikt is.

[ Voor 25% gewijzigd door Robtimus op 18-02-2004 11:21 ]

[JnX]

Ik heb bij toeval ontdekt waardoor het probleem wordt veroorzaakt. Zodra ik het programma uitvoer in een map met een spatie in de mapnaam (of een spatie in de mapnaam van de map waar de map zich in bevindt ) wordt er geen achtergrond weergegeven. Als ik het programma daarentegen uitvoer in een map zonder spaties krijg ik een prachtig achtergrondplaatje

Dus bv. C:\Mapnaam\Map hoi\Test.class en C:\Mapnaam hoi\Map\Test.class geven problemen, maar bv. C:\Mapnaam\Map\Test.class doet het prima..

Erg wazig, ik heb geen idee waar het aan ligt..

PS
(Ik heb je trouwens op MSN toegevoegd IceManX om het te zeggen, maar ik weet niet of je dat adres wel gebruikt dus post ik het ook hier even)

[Robtimus]

JnX schreef op 18 februari 2004 @ 19:11:
Ik heb bij toeval ontdekt waardoor het probleem wordt veroorzaakt. Zodra ik het programma uitvoer in een map met een spatie in de mapnaam (of een spatie in de mapnaam van de map waar de map zich in bevindt ) wordt er geen achtergrond weergegeven. Als ik het programma daarentegen uitvoer in een map zonder spaties krijg ik een prachtig achtergrondplaatje

Dus bv. C:\Mapnaam\Map hoi\Test.class en C:\Mapnaam hoi\Map\Test.class geven problemen, maar bv. C:\Mapnaam\Map\Test.class doet het prima..

Erg wazig, ik heb geen idee waar het aan ligt..

PS
(Ik heb je trouwens op MSN toegevoegd IceManX om het te zeggen, maar ik weet niet of je dat adres wel gebruikt dus post ik het ook hier even)

Vreemd dat dit het probleem veroorzaakt, want het plaatje dat in mijn voorbeeld is gebruikt is C:\Documents and Settings\<ik>\My Documents\My Pictures\Sample.jpg (zat spaties dus). Ook de classes net in een dir gezet met een spatie erin (E:\Temp\Temp Dir\), werkt ook uitstekend. Gebruik je wel quotes op de command line als je dir spaties bestaat?

Over MSN: ff opnieuw in mijn profiel kijken, ik was vergeten hier de nieuwe neer te zetten
Ik gebruik nml niets meer van @Home wegens aflopend abo.

PS:
http://www.stack.nl/~iceman/temp/BackgroundPanel.java
http://www.stack.nl/~iceman/temp/BackgroundPanelTest.java
http://www.stack.nl/~iceman/temp/FileFilter.java
http://www.stack.nl/~iceman/temp/GuiUtils.java
http://www.stack.nl/~iceman/temp/ImageLabel.java

Versie 0.3 met test en requirements; nu kun je ook runtime achtergrond pic, tiling/stretching strategie en alignments veranderen.

[ Voor 14% gewijzigd door Robtimus op 18-02-2004 19:39 ]

[Rex]

Zou je die java bestandjes opnieuw online kunnen zetten, of vertellen waar ik ze nu kan vinden?
Ik heb namelijk een vergelijkbaar probleem en wil graag jouw oplossing uitproberen.

Alvast bedankt.

[Robtimus]

Ik heb ondertussen het geheel wat hergeschreven onlangs, versie 0.4 gebruikt gewoon Graphics.drawImage ipv een panel vol met labels.
Bijkomend voordeel is dat je niet per ongeluk componenten kan toevoegen aan het verkeerde panel; getPanel() is deprecated, en returned gewoon het panel zelf.

Ik heb de nieuwste versie alweer op CodeBase gezet.

[ Voor 24% gewijzigd door Robtimus op 30-10-2004 13:25 ]