Skip to content

Creating a large number formatting system with K, M, B abbreviations

💡 Need help with number formatting and display systems? 🚀 Get Help Now

NW

NumberWizard_Pro

Posted on January 23, 2024 • Intermediate

🔢 Large number display system help

Hey everyone! I’m working on a clicker/idle game where numbers can get really large (millions, billions, trillions). Right now my game just shows the full numbers like “1,234,567” but it gets messy when numbers reach the millions.

I want to create a system that automatically formats large numbers like:

  • 1,500 → 1.5K
  • 2,300,000 → 2.3M
  • 5,600,000,000 → 5.6B
  • And so on up to trillions

I’ve seen this in many professional games but I’m not sure how to implement the logic in Scratch. How do I detect when a number should be abbreviated and how do I add the right letter (K, M, B, T)?

Any help with the conditional logic would be amazing! 🙏

MF

MathFormatter_Dev

Replied 2 hours later • ⭐ Best Answer

Excellent question @NumberWizard_Pro! Number formatting is essential for any incremental game. Here’s a complete system:

🔢 Number Formatting Logic Flow

Here’s how the number formatting system works:

flowchart TD A[📊 Input Number] --> B{Number >= 1T?} B -->|Yes| C[Divide by 1T, Add 'T'] B -->|No| D{Number >= 1B?} D -->|Yes| E[Divide by 1B, Add 'B'] D -->|No| F{Number >= 1M?} F -->|Yes| G[Divide by 1M, Add 'M'] F -->|No| H{Number >= 1K?} H -->|Yes| I[Divide by 1K, Add 'K'] H -->|No| J[Show Original Number] C --> K[Round to 1 Decimal] E --> K G --> K I --> K J --> L[Display Result] K --> L style A fill:#e1f5fe style C fill:#e8f5e8 style E fill:#fff3e0 style G fill:#f3e5f5 style I fill:#e0f2f1 style L fill:#fce4ec

🔧 Step 1: Basic Number Formatter

Create a custom block that handles the formatting logic:

    // Custom block: format number
define format number (input)
if <(input) >= [1000000000000]> then
set [formatted v] to (join (round (((input) / [1000000000000]) * [10]) / [10])) [T])
else
if <(input) >= [1000000000]> then
set [formatted v] to (join (round (((input) / [1000000000]) * [10]) / [10])) [B])
else
if <(input) >= [1000000]> then
set [formatted v] to (join (round (((input) / [1000000]) * [10]) / [10])) [M])
else
if <(input) >= [1000]> then
set [formatted v] to (join (round (((input) / [1000]) * [10]) / [10])) [K])
else
set [formatted v] to (input)
end
end
end
end

💡 Step 2: Enhanced Formatter with Better Precision

For more precise decimal handling:

    // Enhanced number formatter
define format number advanced (number)
if <(number) >= [1000000000000]> then
set [temp v] to ((number) / [1000000000000])
if <(temp) >= [100]> then
set [formatted v] to (join (round (temp)) [T])
else
set [formatted v] to (join (round ((temp) * [10]) / [10])) [T])
end
else
if <(number) >= [1000000000]> then
set [temp v] to ((number) / [1000000000])
if <(temp) >= [100]> then
set [formatted v] to (join (round (temp)) [B])
else
set [formatted v] to (join (round ((temp) * [10]) / [10])) [B])
end
else
if <(number) >= [1000000]> then
set [temp v] to ((number) / [1000000])
if <(temp) >= [100]> then
set [formatted v] to (join (round (temp)) [M])
else
set [formatted v] to (join (round ((temp) * [10]) / [10])) [M])
end
else
if <(number) >= [1000]> then
set [temp v] to ((number) / [1000])
if <(temp) >= [100]> then
set [formatted v] to (join (round (temp)) [K])
else
set [formatted v] to (join (round ((temp) * [10]) / [10])) [K])
end
else
set [formatted v] to (number)
end
end
end
end

🎮 Step 3: Real-time Display System

Integrate the formatter into your game’s display:

    when flag clicked
forever
// Format and display money
format number advanced (money)
set [money display v] to (formatted)

// Format and display score
format number advanced (score)
set [score display v] to (formatted)

// Update UI text
go to x: [-200] y: [150]
set [text v] to (join [Money: $] (money display))

go to x: [-200] y: [120]
set [text v] to (join [Score: ] (score display))
end

🚀 Step 4: Extended Formatting (Quadrillions and Beyond)

For games that reach even larger numbers:

    // Extended formatter for massive numbers
define format huge number (num)
if <(num) >= [1000000000000000000]> then
set [formatted v] to (join (round (((num) / [1000000000000000000]) * [10]) / [10])) [Qi])
else
if <(num) >= [1000000000000000]> then
set [formatted v] to (join (round (((num) / [1000000000000000]) * [10]) / [10])) [Qa])
else
if <(num) >= [1000000000000]> then
set [formatted v] to (join (round (((num) / [1000000000000]) * [10]) / [10])) [T])
else
// Use previous formatter for smaller numbers
format number advanced (num)
end
end
end

🎯 Step 5: Complete Implementation Example

Here’s how to use it in a clicker game:

    // Main game loop with formatting
when flag clicked
set [money v] to [0]
set [money per click v] to [1]

forever
// Update display every frame
format number advanced (money)
go to x: [-180] y: [150]
set [text v] to (join [Money: $] (formatted))

format number advanced (money per click)
go to x: [-180] y: [120]
set [text v] to (join [Per Click: $] (formatted))
end

// When clicking for money
when this sprite clicked
change [money v] by (money per click)
play sound [coin v]

💎 Pro Tips for Number Formatting

  • Consistent rounding: Always round to 1 decimal place for readability
  • Threshold management: Switch to whole numbers when displaying 100+ of a unit
  • Performance: Only format numbers when they change, not every frame
  • Localization: Consider different number formats for different regions
  • Color coding: Use different colors for different magnitude levels

This system will keep your numbers clean and readable no matter how large they get! 🎯

NW

NumberWizard_Pro

Replied 1 hour later

@MathFormatter_Dev This is incredible! 🤩 The step-by-step breakdown is perfect!

I implemented the basic version and it works beautifully. One question - how do I handle negative numbers? Should they show as “-1.5K” or handle them differently?

UI

UIDesigner_Maya

Replied 30 minutes later

@NumberWizard_Pro Great question about negative numbers! Here’s how to handle them:

    // Negative number formatter
define format with negatives (number)
if <(number) < [0]> then
set [is negative v] to [true]
set [abs number v] to ((number) * [-1])
else
set [is negative v] to [false]
set [abs number v] to (number)
end

// Format the absolute value
format number advanced (abs number)

// Add negative sign if needed
if <(is negative) = [true]> then
set [formatted v] to (join [-] (formatted))
end

This way you get clean results like “-2.5M” for negative millions! 💯

VB

Vibelf_Community

Pinned Message • Moderator

🔢 Master Advanced Number Systems

Fantastic discussion on number formatting! For developers ready to create even more sophisticated numerical displays, our community can help you implement:

  • 📊 Scientific notation systems
  • 🌍 Localized number formats
  • 🎨 Animated number transitions
  • 📈 Progress bar integrations
  • 🔄 Currency conversion systems

📚 Related Topics

Ready to create stunning numerical displays? Get expert guidance from our UI/UX specialists!