Question

我想在JSlider后面放置一个图像（音频的可视化），它代表了音响播放器，即播放过程。首先，我试图覆盖Slider的paint-method

public void paintComponent(Graphics g) {
    // Draw the previously loaded image to Component
    g.drawImage(img, 0, -100, null);
    super.paintComponent(g);
}

这很有用，但是图像高于滑块，所以我的下一次尝试是JLayeredPane，我将JSlider放在JLabel上面。第一时间看起来不错。但我提到我需要滑块的轨道背后的图像，而不是整个滑块。左右两侧有空间。任何人都能告诉我如何计算这个空间吗？或者轨道到滑块边框的宽度和偏移量？这应该在Windows和MacO下运行，因此不同的LookAndFeels，所以我认为硬编码值不起作用。 Example Slider with background image

三江源。

Answer 1

我对此问题的解决方案现在是覆盖SliderUI。所以这是一个非常特殊的组件，因此它在所有LookAndFeel上看起来都是相同的。它还支持直接跳转到鼠标位置，这与BasicSliderUI不同。

/**
 *
 * Custom SliderUI for AudioPlayer with audioimage in background
 */
public class AudioSliderUI extends BasicSliderUI {

    private BasicStroke stroke = new BasicStroke(1f, BasicStroke.CAP_ROUND, 
            BasicStroke.JOIN_ROUND, 0f);

    public AudioSliderUI(AudioSlider b) {
        super(b);
    }

    @Override
    public void paint(Graphics g, JComponent c) {
        Graphics2D g2d = (Graphics2D) g;
        g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, 
                RenderingHints.VALUE_ANTIALIAS_ON);
        super.paint(g, c);
    }

    @Override
    protected Dimension getThumbSize() {
        return new Dimension(2, 200);
    }

    @Override
    public void paintTrack(Graphics g) {
        Graphics2D g2d = (Graphics2D) g;
        Stroke old = g2d.getStroke();
        g2d.setStroke(stroke);
        g2d.setPaint(Color.WHITE);
        if (slider.getOrientation() == SwingConstants.HORIZONTAL) {
            g2d.drawLine(trackRect.x, trackRect.y + trackRect.height / 2, 
                    trackRect.x + trackRect.width, trackRect.y + trackRect.height / 2);
        } else {
            g2d.drawLine(trackRect.x + trackRect.width / 2, trackRect.y, 
                    trackRect.x + trackRect.width / 2, trackRect.y + trackRect.height);
        }
        g2d.setStroke(old);
        Image img = ((AudioSlider)slider).getImage();
        g2d.drawImage(img, trackRect.x, trackRect.y, trackRect.width, trackRect.height, slider);

    }

    @Override
    public void paintThumb(Graphics g) {
        Rectangle knobBounds = thumbRect;
        int w = knobBounds.width;
        int h = 100;
        int newStarty = knobBounds.height/2- h/2;
        g.translate(knobBounds.x, knobBounds.y);

        //     "plain" version
        g.setColor(Color.YELLOW);
        g.fillRect(0, newStarty, w, h);

    }

    @Override
    protected TrackListener createTrackListener(JSlider slider) {
        return new TrackListener() {
            @Override
            public void mousePressed(MouseEvent e) {
                if (UIManager.getBoolean("Slider.onlyLeftMouseButtonDrag")
                        && SwingUtilities.isLeftMouseButton(e)) {
                    JSlider slider = (JSlider) e.getComponent();
                    switch (slider.getOrientation()) {
                    case SwingConstants.VERTICAL:
                        slider.setValue(valueForYPosition(e.getY()));
                        break;
                    case SwingConstants.HORIZONTAL:
                        slider.setValue(valueForXPosition(e.getX()));
                        break;
                    default:
                        throw new IllegalArgumentException(
                                "orientation must be one of: VERTICAL, HORIZONTAL");
                    }
                    super.mousePressed(e); // isDragging = true;
                    super.mouseDragged(e);
                } else {
                    super.mousePressed(e);
                }
            }

            @Override
            public boolean shouldScroll(int direction) {
                return false;
            }
        };
    }
}

匹配滑块：

public class AudioSlider extends JSlider {

    private Image img;

    public AudioSlider() {
        setOpaque(false);
    }

    /**
     * @return the img
     */
    public Image getImage() {
        return img;
    }

    public void setImage(Image img) {
        this.img = img;
    }
}

适合我，也许涵盖不是所有潜在客户。

JSlider图像跟踪

1 个答案: