Skip to content

Fix captcha clarity issues for small dimensions (120x30) with configurable font sizes and bold text#138

Draft
Copilot wants to merge 4 commits into
masterfrom
copilot/fix-ec852fb1-7f0f-471e-ad94-c90f281e86c4
Draft

Fix captcha clarity issues for small dimensions (120x30) with configurable font sizes and bold text#138
Copilot wants to merge 4 commits into
masterfrom
copilot/fix-ec852fb1-7f0f-471e-ad94-c90f281e86c4

Conversation

Copy link
Copy Markdown

Copilot AI commented Sep 29, 2025

This PR addresses captcha clarity issues specifically reported for 120x30 pixel dimensions, implementing three key improvements while maintaining full backward compatibility.

Issues Fixed

Font Size Too Small (验证码显示不够清晰)
The original font size calculation height * (rand.Intn(7) + 7) / 16 could produce fonts as small as 13 pixels for a 30px height image, making text hard to read:

// Before: Font size range for 30px height
fontSize := 30 * (rand.Intn(7) + 7) / 16  // Range: 13-24 pixels

Text Positioning Near Borders (文字开始写的地方太容易在边界)
The positioning calculation x := fontWidth*i + fontWidth/fontSize could place text too close to image edges without proper margins.

No Bold Text Support (希望增加文字加粗的效果还有文字大小的控制)
There was no mechanism to render bold text or control font sizes for better clarity.

Solution

New Configurable Parameters

Added three new optional fields to DriverString:

type DriverString struct {
    // ... existing fields ...
    MinFontSize int  // Minimum font size (auto-calculated if 0)
    MaxFontSize int  // Maximum font size (auto-calculated if 0)  
    Bold        bool // Enable bold text rendering
}

Intelligent Font Size Defaults

  • Small captchas (height ≤ 40px): Minimum font size automatically set to 16px for readability
  • General default: MinFontSize = 60% of height, MaxFontSize = 80% of height
  • 120x30 example: Font size range improved to 18-24px (was 13-24px)

Enhanced Text Positioning

  • Added 10% margins on left and right sides
  • Proper character centering within available space
  • Bounded vertical positioning to prevent clipping

Bold Text Rendering

Multi-stroke rendering technique that draws additional character strokes at slight offsets for enhanced visibility.

Usage Examples

Backward Compatible (No Changes Required)

// Existing code continues to work unchanged
driver := base64Captcha.NewDriverString(30, 120, 0, 0, 4, "1234567890", nil, nil, []string{})

Enhanced Small Captcha

// Create improved small captcha
driver := base64Captcha.NewDriverString(30, 120, 0, 0, 4, "1234567890", nil, nil, []string{})
driver.Bold = true         // Enable bold text
driver.MinFontSize = 18    // Ensure readability  
driver.MaxFontSize = 24    // Control variation
driver = driver.ConvertFonts()

Auto-Configuration

// For small captchas, sizes are automatically optimized
driver := base64Captcha.NewDriverString(25, 100, 0, 0, 4, "1234567890", nil, nil, []string{})
driver.Bold = true  // Just enable bold, sizes auto-configured
// MinFontSize will be automatically set to 16px
// MaxFontSize will be automatically set to 20px (80% of height)

Implementation Details

  • Added drawTextWithFontSize() method with enhanced control
  • Original drawText() method unchanged, calls new method internally
  • Comprehensive test coverage including specific 120x30 dimension tests
  • Minimal performance impact: O(1) font calculations, ~6x character draws when bold enabled
  • All existing tests continue to pass

Verification

Generated visual comparisons demonstrate significant clarity improvement for 120x30 pixel captchas while maintaining full backward compatibility with existing implementations.

Original prompt

This section details on the original issue you should resolve

<issue_title>当图片 120x30 尺寸的时候 验证码显示不够清晰</issue_title>
<issue_description>当图片 120x30 尺寸的时候

  1. 验证码显示不够清晰
  2. 文字开始写的地方 太容易在边界
  3. 希望增加文字加粗的效果 还有文字大小的控制
    </issue_description>

<agent_instructions>tell me why</agent_instructions>

Comments on the Issue (you are @copilot in this section)

Fixes #135

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot wasn't able to review any files in this pull request.


Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Copilot AI and others added 3 commits September 29, 2025 10:17
Co-authored-by: mojocn <34467684+mojocn@users.noreply.github.com>
…ions

Co-authored-by: mojocn <34467684+mojocn@users.noreply.github.com>
Co-authored-by: mojocn <34467684+mojocn@users.noreply.github.com>
Copilot AI changed the title [WIP] 当图片 120x30 尺寸的时候 验证码显示不够清晰 Fix captcha clarity issues for small dimensions (120x30) with configurable font sizes and bold text Sep 29, 2025
Copilot AI requested a review from mojocn September 29, 2025 10:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

当图片 120x30 尺寸的时候 验证码显示不够清晰

3 participants