You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何修改JTextField整体外观 实现蓝色下划线样式且保持可编辑

实现仅保留蓝色下划线的可编辑JTextField

重写paintComponent()没有生效,核心原因一般是两点:一是没有先调用父类的paintComponent()完成文本、光标、选中态等基础内容的绘制,二是没有关闭组件默认的不透明背景和自带边框,导致默认的矩形样式把绘制的线条完全覆盖了。

可以直接用下面的方案实现需求,完全保留原生编辑能力:

  • 先关闭组件的不透明属性,移除默认的立体/矩形边框,预留出下划线的绘制空间
  • 重写绘制方法时先执行父类的默认绘制逻辑,再在组件底部绘制指定样式的蓝色下划线
  • 自定义内边距避免文字和下划线距离过近,观感更好

可直接运行的完整实现代码:

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

public class UnderlineTextField extends JTextField {
    // 可根据UI需求自行调整下划线参数
    private static final Color LINE_COLOR = new Color(26, 115, 232);
    private static final int LINE_THICKNESS = 2;

    public UnderlineTextField(int columns) {
        super(columns);
        // 关闭默认背景填充,移除原有边框,给下划线留出底部空间
        setOpaque(false);
        setBorder(new EmptyBorder(2, 2, LINE_THICKNESS + 3, 2));
    }

    @Override
    protected void paintComponent(Graphics g) {
        // 必须先调用父类方法,否则文本、光标、选中效果都不会正常显示
        super.paintComponent(g);
        Graphics2D g2 = (Graphics2D) g;
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
        g2.setColor(LINE_COLOR);
        // 在组件最底部绘制水平下划线
        g2.fillRect(0, getHeight() - LINE_THICKNESS, getWidth(), LINE_THICKNESS);
    }

    // 测试入口
    public static void main(String[] args) {
        SwingUtilities.invokeLater(() -> {
            JFrame frame = new JFrame();
            frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
            JPanel container = new JPanel(new FlowLayout(FlowLayout.CENTER, 30, 40));
            container.setBackground(Color.WHITE);
            container.add(new UnderlineTextField(20));
            frame.add(container);
            frame.setSize(400, 150);
            frame.setLocationRelativeTo(null);
            frame.setVisible(true);
        });
    }
}

这个实现不会破坏JTextField的任何原生交互:输入删除、光标移动、文本选中、复制粘贴、快捷键操作都和默认组件完全一致。如果需要增加聚焦态效果(比如聚焦时线条变粗、换高亮色),只需要在绘制下划线前判断isFocusOwner()的返回值,切换对应的颜色、线宽参数即可。

默认样式的JTextField效果:
默认样式的JTextField效果:

期望实现的JTextField效果:
期望实现的JTextField效果:

内容的提问来源于stack exchange,提问作者John

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.27 05:45:40