← Back to C++ Course | Chapter 18: Graphics | Lesson 1 of 7

C++ Graphics का परिचय

Graphics programming सिर्फ text की बजाय screen पर pictures और animations draw करना है, एक typewriter से एक paintbrush की ओर move करने जैसा। Games picture को एक second में कई बार redraw करते हैं।

Console बनाम Graphics

Standard C++ I/O text-only है, एक terminal window पर एक बार में एक line characters print करते हुए।

Graphics libraries एक actual window खोलने और इस पर pixel by pixel shapes, images, और colors draw करने की ability add करती हैं -- एक fundamentally अलग rendering model जिसे SFML जैसी एक external library link करने की ज़रूरत है, जिसे Ubuntu पर आप sudo apt-get install libsfml-dev से install करेंगे।

उदाहरण: Console vs Graphics

cpp
#include <iostream>

int main() {
	std::cout << "Text output via std::cout" << std::endl;
	// Graphics libraries like SFML instead open a window and draw
	// shapes/images pixel by pixel -- a different rendering model.
	return 0;
}

Popular Graphics Libraries

SFML beginners और general 2D काम के लिए एक clean, object-oriented API के साथ aimed है। SDL2 2D games और emulators के लिए long-standing standard है, lower-level control offer करते हुए।

OpenGL दोनों से एक level नीचे बैठता है, high-performance 2D या पूरी 3D rendering के लिए GPU तक direct access देते हुए एक steeper learning curve की कीमत पर।

उदाहरण: Popular Graphics Libraries

cpp
// SFML: beginner-friendly, object-oriented 2D API
// SDL2: lower-level, long-standing standard for 2D games/emulators
// OpenGL: direct GPU access for high-performance 2D or full 3D
#include <iostream>

int main() {
	std::cout << "SFML, SDL2, and OpenGL are the three main choices" << std::endl;
	return 0;
}

Game Loop Concept

एक game loop किसी भी interactive graphics program की beating heart है: जब तक window open रहती है, यह बार-बार queued input events process करता है, program की internal state (जैसे एक object की position) advance करता है, और current frame redraw करता है -- typically प्रति second कई बार।

उदाहरण: The Game Loop Concept

cpp
#include <iostream>

int main() {
	bool windowOpen = true;
	int frame = 0;
	while (windowOpen && frame < 3) {
		// 1. process input events
		// 2. update program state
		// 3. redraw the current frame
		std::cout << "Frame " << frame << " rendered" << std::endl;
		frame++;
	}
	return 0;
}

Frame Rate और Delta Time

Frame rate (FPS) measure करता है कि loop हर second कितने complete frames render करता है -- generally ज़्यादा होना smoother दिखता है।

Delta time सबसे हाल के frame की elapsed duration है, और movement को delta time से multiply करना animation speed को consistent रखता है चाहे loop किसी दिए गए machine पर कितनी भी तेज़ या धीमी चल रही हो।

उदाहरण: Frame Rate and Delta Time

cpp
#include <iostream>

int main() {
	double deltaTime = 0.016; // seconds since last frame (~60 FPS)
	double speed = 100.0;     // pixels per second
	double positionX = 0.0;

	positionX += speed * deltaTime;
	std::cout << "Moved to X=" << positionX << " this frame" << std::endl;
	return 0;
}

Graphics में Coordinate Systems

ज़्यादातर 2D graphics libraries origin (0, 0) को window के top-left corner पर रखती हैं, X-axis right में बढ़ते हुए और Y-axis downward बढ़ते हुए -- math coordinate system से opposite vertical direction जिसके आप शायद आदी हों, जहाँ Y upward बढ़ता है।

उदाहरण: Coordinate Systems in Graphics

cpp
// Include std::cout and std::cin
#include <iostream>

// Program execution starts in main()
int main() {
	int x = 50, y = 20;
	// Print to the console with cout
	std::cout << "(0,0) is top-left; X increases right, Y increases down" << std::endl;
	// Print to the console with cout
	std::cout << "Point drawn at (" << x << ", " << y << ")" << std::endl;
	// Return 0 to signal that the program finished successfully
	return 0;
}
Related Topics
{# common_mistakes/chapter_summary/browser_support: on Hindi pages the view already swaps in the hi_ translation fields (or blanks these out if untranslated), so this renders correctly for both languages without a lang_code check here. #}
आम गलतियां
  1. frame rate limit किए बिना game loop चलाना।
  2. delta time ignore करना इसलिए movement speed frame rate पर depend करता है।
  3. console output को एक graphics window से confuse करना।
🔒

Chapter Quiz — Complete all 7 topics to unlock

0/7 topics done

Complete these topics first:

Login to run this code

C/C++/Java/PHP execution requires a free account. Your code is saved — you'll land right back in the editor after logging in.