这是第一张图片上显示的工作 UI 的完整示例:(
没有魔法 - 只需使用图形和基本 UI 知识)
import java.awt.BasicStroke;
import java.awt.Color;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.Stroke;
import java.awt.geom.GeneralPath;
import javax.swing.JComponent;
import javax.swing.JFrame;
import javax.swing.JSlider;
import javax.swing.SwingConstants;
import javax.swing.plaf.basic.BasicSliderUI;
/**
*
* @see http://stackoverflow.com/a/12297384/714968
*/
public class CustomSliderUI extends BasicSliderUI {
private BasicStroke stroke = new BasicStroke(1f, BasicStroke.CAP_ROUND,
BasicStroke.JOIN_ROUND, 0f, new float[]{1f, 2f}, 0f);
public CustomSliderUI(JSlider 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(12, 16);
}
@Override
public void paintTrack(Graphics g) {
Graphics2D g2d = (Graphics2D) g;
Stroke old = g2d.getStroke();
g2d.setStroke(stroke);
g2d.setPaint(Color.BLACK);
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);
}
@Override
public void paintThumb(Graphics g) {
Graphics2D g2d = (Graphics2D) g;
int x1 = thumbRect.x + 2;
int x2 = thumbRect.x + thumbRect.width - 2;
int width = thumbRect.width - 4;
int topY = thumbRect.y + thumbRect.height / 2 - thumbRect.width / 3;
GeneralPath shape = new GeneralPath(GeneralPath.WIND_EVEN_ODD);
shape.moveTo(x1, topY);
shape.lineTo(x2, topY);
shape.lineTo((x1 + x2) / 2, topY + width);
shape.closePath();
g2d.setPaint(new Color(81, 83, 186));
g2d.fill(shape);
Stroke old = g2d.getStroke();
g2d.setStroke(new BasicStroke(2f));
g2d.setPaint(new Color(131, 127, 211));
g2d.draw(shape);
g2d.setStroke(old);
}
public static void main(String[] args) {
JFrame frame = new JFrame();
JSlider slider = new JSlider(0, 100);
slider.setPaintTicks(true);
slider.setPaintLabels(true);
slider.setMinorTickSpacing(5);
slider.setMajorTickSpacing(25);
slider.setUI(new CustomSliderUI(slider));
frame.add(slider);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.pack();
frame.setVisible(true);
}
}
您可以通过更改返回的边界轻松修改拇指(抓手)大小。拇指绘画将适应任何尺寸。您还可以轻松自定义任何其他滑块部分的绘画。
顺便说一句,这是最终视图:
PS 我没有为垂直滑块调整 UI,但这不应该花太长时间。