簡體   English   中英

Java-使用Swing創建連續的圖像幻燈片

[英]Java - Create a continuous image slide with Swing

我不確定如何在標題中正確地命名我的問題,但我希望我的形象能表達我的期望:

https://i.stack.imgur.com/fIhP8.png

所以我要完成的工作是,例如,您有兩張圖片(如上圖所示),以及旁邊有一張幻燈片的對象[圖片中名為(1)]

根據幻燈片的進度/值(1), IMAGE A是否會滑出,然后IMAGE B會彈出

一旦幻燈片到達底部, IMAGE B將完全占據顯示區域,而IMAGE A被隱藏。 反之亦然,幻燈片上升到頂部。

有什么想法如何在Swing中用Java創建這樣的東西嗎? 我希望我的解釋足夠准確,可以理解。

感謝您的幫助 :)

編輯1:這是我實現@camickr的代碼,我認為它只能通過設置視圖面板才能工作。 按照您的指示我有沒有做錯任何事情?

JPanel bigPanel = new JPanel(new FlowLayout(FlowLayout.CENTER, 5, 20));
JPanel displayPanel = new JPanel();
JScrollPane scrollPane = new JScrollPane();
[...] 
displayPanel.setLayout(new BoxLayout(displayPanel, BoxLayout.X_AXIS));
JLabel label1 = new JLabel(new ImageIcon("R:\\imgA.jpg"));
JLabel label2 = new JLabel(new ImageIcon("R:\\imgB.jpg"));
displayPanel.add(label1);
displayPanel.add(label2);
scrollPane.setViewportView(displayPanel);
bigPanel.add(scrollPane);
  1. 創建兩個JLabels每個JLabels都帶有一個ImageIcon作為圖像。
  2. 使用水平BoxLayout將每個標簽添加到JPanel
  3. 將面板添加到JScrollPane
  4. 將滾動窗格添加到框架。

如果面板沒有完全填滿滾動窗格的可用空間,則滾動窗格將自動顯示滾動條。

編輯:

您發布的代碼不是“ MRE”:

  1. 我們無法編譯該代碼,因此我們不知道代碼使用的確切上下文。

  2. 文本字段的意義是什么? 您的問題是關於滾動兩個圖像。 因此,文本字段與所述問題無關。

  3. 我們無權訪問您的圖片,因此也不應包含在“ MRE”中。

您問題的基礎是滾動兩個標簽的能力。 因此,要對此進行測試,您需要的是:

JLabel red = new JLabel("Image 1");
red.setOpaque(true);
red.setBackground( Color.RED );
red.setPreferredSize( new Dimension(200, 200) ); // for testing only

JLabel blue = new JLabel("Image 2");
...

JPanel displayPanel = new JPanel();
displayPanel.setLayout(new BoxLayout(displayPanel, BoxLayout.X_AXIS));
JScrollPane scrollPane = new JScrollPane(displayPanel);
frame.add(scrollPane);
frame.pack();
frame.setVisible(true);

使用上面的基礎知識創建一個合適的程序。

當顯示框時,圖像將以原尺寸顯示。 縮小邊框,將出現滾動條。

解決方案不完全是您所需要的,但是它向您展示了如何使用默認組件來實現滾動效果。 我個人發現使用水平滾動條而不是垂直滑塊將圖像從右向左滾動更為直觀。

為了控制圖像的繪制方式,我建議為此創建一個自己的面板,並在覆蓋的paintComponent方法中使用drawImage調用。 圖像的“位置”應當優選地是相對值,即,在0.0(示出第一幅圖像)和1.0(示出第二幅圖像)之間的double值,以獨立於分辨率和圖像尺寸。

關於圖像大小一個警告,雖然:一個人必須假定這兩個圖像的大小是一樣的。 否則,您將打開一罐蠕蟲,其中涉及應如何處理不同圖像大小的問題。 此外,當包含的成分大於或小於圖像時,應該發生一些自由度。 但為簡單起見,可以假定它始終具有正確的大小。

然后,一個簡單的實現可能如下所示:

ImageSlide

這是相應的代碼:

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;

import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JSlider;
import javax.swing.SwingConstants;
import javax.swing.SwingUtilities;

public class ImageSlideTest
{
    public static void main(String[] args)
    {
        SwingUtilities.invokeLater(() -> createAndShowGui());
    }

    private static void createAndShowGui()
    {
        JFrame f = new JFrame();
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

        BufferedImage image0 = createImage("Image 0", Color.RED);
        BufferedImage image1 = createImage("Image 1", Color.GREEN);

        ImageSlidePanel imageSlidePanel = new ImageSlidePanel(image0, image1);
        JPanel panel = new JPanel(new BorderLayout());

        panel.add(imageSlidePanel, BorderLayout.CENTER);

        JSlider slider = new JSlider(SwingConstants.VERTICAL, 0, 100, 0);
        slider.addChangeListener(e -> 
        {
            double location = slider.getValue() / 100.0;
            imageSlidePanel.setLocation(location);
        });
        panel.add(slider, BorderLayout.EAST);

        f.getContentPane().add(panel);

        f.pack();
        f.setLocationRelativeTo(null);
        f.setVisible(true);
    }

    private static BufferedImage createImage(String text, Color color)
    {
        int w = 300;
        int h = 200;
        BufferedImage image =
            new BufferedImage(w, h, BufferedImage.TYPE_INT_ARGB);
        Graphics2D g = image.createGraphics();
        g.setColor(color);
        g.fillRect(0, 0, w, h);
        g.setColor(Color.BLACK);
        g.setFont(new Font("Dialog", Font.PLAIN, 30));
        g.drawString(text, 50, 50);
        g.dispose();
        return image;
    }
}

class ImageSlidePanel extends JPanel
{
    private final BufferedImage image0;
    private final BufferedImage image1;
    private double location;

    // Note: The images should have the same size...
    public ImageSlidePanel(BufferedImage image0, BufferedImage image1)
    {
        this.image0 = image0;
        this.image1 = image1;
        this.location = 0.0;
    }

    public void setLocation(double location)
    {
        this.location = Math.min(1.0, Math.max(0.0, location));
        repaint();
    }

    @Override
    protected void paintComponent(Graphics g)
    {
        super.paintComponent(g);
        int dx = (int) (image0.getWidth() * location);
        g.drawImage(image0, -dx, 0, null);
        g.drawImage(image1, -dx + image0.getWidth(), 0, null);
    }

    @Override
    public Dimension getPreferredSize()
    {
        if (isPreferredSizeSet())
        {
            return super.getPreferredSize();
        }
        int w = image0.getWidth();
        int h = image0.getHeight();
        return new Dimension(w, h);
    }

}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM