input box
There is no browser build of this example yet.
Is it the same as C?
- Desktop:verified The Zig version renders a final frame that is byte-identical to the C example.
- Browser:not checked yet The browser comparison does not cover this example yet.
//! raylib [text] example - input box
//!
//! Zig-API translation of examples/text/text_input_box.c (raylib 6.2).
//! Example licensed under an unmodified zlib/libpng license.
//! Copyright (c) 2017-2025 Ramon Santamaria (@raysan5)
const rl = @import("raylib");
const max_input_chars = 9;
pub fn main() void {
// Initialization
const screen_width = 800;
const screen_height = 450;
rl.initWindow(screen_width, screen_height, "raylib [text] example - input box");
defer rl.closeWindow(); // Close window and OpenGL context
var name: [max_input_chars + 1]u8 = @splat(0); // NOTE: One extra space required for null terminator char '\0'
var letter_count: usize = 0;
const text_box: rl.Rectangle = .{ .x = screen_width / 2.0 - 100, .y = 180, .width = 225, .height = 50 };
var frames_counter: u32 = 0;
rl.setTargetFPS(60); // Set our game to run at 60 frames-per-second
// Main game loop
while (!rl.windowShouldClose()) { // Detect window close button or ESC key
// Update
const mouse_on_text = rl.checkCollisionPointRec(rl.getMousePosition(), text_box);
if (mouse_on_text) {
// Set the window's cursor to the I-Beam
rl.setMouseCursor(.ibeam);
// Get char pressed (unicode character) on the queue,
// checking if more characters have been pressed on the same frame
var key = rl.getCharPressed();
while (key > 0) : (key = rl.getCharPressed()) {
// NOTE: Only allow keys in range [32..125]
if (key >= 32 and key <= 125 and letter_count < max_input_chars) {
name[letter_count] = @intCast(key);
name[letter_count + 1] = 0; // Add null terminator at the end of the string
letter_count += 1;
}
}
if (rl.isKeyPressed(.backspace)) {
letter_count -|= 1;
name[letter_count] = 0;
}
} else rl.setMouseCursor(.default);
if (mouse_on_text) frames_counter += 1 else frames_counter = 0;
// Draw
rl.beginDrawing();
defer rl.endDrawing();
rl.clearBackground(.ray_white);
rl.drawText("PLACE MOUSE OVER INPUT BOX!", 240, 140, 20, .gray);
const box_x: i32 = @intFromFloat(text_box.x);
const box_y: i32 = @intFromFloat(text_box.y);
rl.drawRectangleRec(text_box, .light_gray);
const border: rl.Color = if (mouse_on_text) .red else .dark_gray;
rl.drawRectangleLines(box_x, box_y, @intFromFloat(text_box.width), @intFromFloat(text_box.height), border);
const text = name[0..letter_count :0];
rl.drawText(text, box_x + 5, box_y + 8, 40, .maroon);
rl.drawText(rl.textFormat("INPUT CHARS: {d}/{d}", .{ letter_count, max_input_chars }), 315, 250, 20, .dark_gray);
if (mouse_on_text) {
if (letter_count < max_input_chars) {
// Draw blinking underscore char
if ((frames_counter / 20) % 2 == 0) rl.drawText("_", box_x + 8 + rl.measureText(text, 40), box_y + 12, 40, .maroon);
} else rl.drawText("Press BACKSPACE to delete chars...", 230, 300, 20, .gray);
}
}
}/*******************************************************************************************
*
* raylib [text] example - input box
*
* Example complexity rating: [★★☆☆] 2/4
*
* Example originally created with raylib 1.7, last time updated with raylib 3.5
*
* Example licensed under an unmodified zlib/libpng license, which is an OSI-certified,
* BSD-like license that allows static linking with closed source software
*
* Copyright (c) 2017-2025 Ramon Santamaria (@raysan5)
*
********************************************************************************************/
#include "raylib.h"
#define MAX_INPUT_CHARS 9
//------------------------------------------------------------------------------------
// Program main entry point
//------------------------------------------------------------------------------------
int main(void)
{
// Initialization
//--------------------------------------------------------------------------------------
const int screenWidth = 800;
const int screenHeight = 450;
InitWindow(screenWidth, screenHeight, "raylib [text] example - input box");
char name[MAX_INPUT_CHARS + 1] = "\0"; // NOTE: One extra space required for null terminator char '\0'
int letterCount = 0;
Rectangle textBox = { screenWidth/2.0f - 100, 180, 225, 50 };
bool mouseOnText = false;
int framesCounter = 0;
SetTargetFPS(60); // Set our game to run at 60 frames-per-second
//--------------------------------------------------------------------------------------
// Main game loop
while (!WindowShouldClose()) // Detect window close button or ESC key
{
// Update
//----------------------------------------------------------------------------------
if (CheckCollisionPointRec(GetMousePosition(), textBox)) mouseOnText = true;
else mouseOnText = false;
if (mouseOnText)
{
// Set the window's cursor to the I-Beam
SetMouseCursor(MOUSE_CURSOR_IBEAM);
// Get char pressed (unicode character) on the queue
int key = GetCharPressed();
// Check if more characters have been pressed on the same frame
while (key > 0)
{
// NOTE: Only allow keys in range [32..125]
if ((key >= 32) && (key <= 125) && (letterCount < MAX_INPUT_CHARS))
{
name[letterCount] = (char)key;
name[letterCount+1] = '\0'; // Add null terminator at the end of the string
letterCount++;
}
key = GetCharPressed(); // Check next character in the queue
}
if (IsKeyPressed(KEY_BACKSPACE))
{
letterCount--;
if (letterCount < 0) letterCount = 0;
name[letterCount] = '\0';
}
}
else SetMouseCursor(MOUSE_CURSOR_DEFAULT);
if (mouseOnText) framesCounter++;
else framesCounter = 0;
//----------------------------------------------------------------------------------
// Draw
//----------------------------------------------------------------------------------
BeginDrawing();
ClearBackground(RAYWHITE);
DrawText("PLACE MOUSE OVER INPUT BOX!", 240, 140, 20, GRAY);
DrawRectangleRec(textBox, LIGHTGRAY);
if (mouseOnText) DrawRectangleLines((int)textBox.x, (int)textBox.y, (int)textBox.width, (int)textBox.height, RED);
else DrawRectangleLines((int)textBox.x, (int)textBox.y, (int)textBox.width, (int)textBox.height, DARKGRAY);
DrawText(name, (int)textBox.x + 5, (int)textBox.y + 8, 40, MAROON);
DrawText(TextFormat("INPUT CHARS: %i/%i", letterCount, MAX_INPUT_CHARS), 315, 250, 20, DARKGRAY);
if (mouseOnText)
{
if (letterCount < MAX_INPUT_CHARS)
{
// Draw blinking underscore char
if (((framesCounter/20)%2) == 0) DrawText("_", (int)textBox.x + 8 + MeasureText(name, 40), (int)textBox.y + 12, 40, MAROON);
}
else DrawText("Press BACKSPACE to delete chars...", 230, 300, 20, GRAY);
}
EndDrawing();
//----------------------------------------------------------------------------------
}
// De-Initialization
//--------------------------------------------------------------------------------------
CloseWindow(); // Close window and OpenGL context
//--------------------------------------------------------------------------------------
return 0;
}
// Check if any key is pressed
// NOTE: We limit keys check to keys between 32 (KEY_SPACE) and 126
bool IsAnyKeyPressed()
{
bool keyPressed = false;
int key = GetKeyPressed();
if ((key >= 32) && (key <= 126)) keyPressed = true;
return keyPressed;
}From raylib 6.2. The original on GitHub.