DXライブラリ

DXライブラリで点を描画する方法

2025-04-15更新日: 2025-04-15

DXライブラリで点を描画するには、関数 DrawPixel を使用します。

この関数は、指定した座標に1ピクセルの点を描画します。

引数として、描画するX座標、Y座標、色を指定します。

色は GetColor関数を使ってRGB値を指定することが一般的です。

例えば、赤い点を描画する場合は GetColor(255, 0, 0) を使用します。

目次から探す

点を描画する基本的な方法
点の描画に関する応用
点描画の実践例
まとめ

点を描画する基本的な方法

DrawPixel関数の使い方

DXライブラリにおける点の描画には、DrawPixel関数を使用します。

この関数は、指定した座標に指定した色の点を描画するためのものです。

基本的な使い方は以下の通りです。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    // 点を描画
    DrawPixel(100, 100, GetColor(255, 0, 0)); // (100, 100)に赤い点を描画
    // 描画結果を画面に表示
    ScreenFlip();
    // 終了まで待機
    WaitKey();
    DxLib_End(); // DXライブラリの終了
    return 0;
}

このコードでは、DrawPixel関数を使って、座標(100, 100)に赤い点を描画しています。

GetColor関数で色を指定する方法

GetColor関数は、RGB形式で色を指定するために使用します。

引数には赤、緑、青の値を0から255の範囲で指定します。

例えば、赤色はGetColor(255, 0, 0)、緑色はGetColor(0, 255, 0)、青色はGetColor(0, 0, 255)となります。

座標系の基本

DXライブラリでは、画面の左上を原点(0, 0)とする座標系を使用しています。

X座標は右に行くほど増加し、Y座標は下に行くほど増加します。

このため、画面の中心に点を描画したい場合は、画面の幅と高さを考慮して座標を計算する必要があります。

点を描画するサンプルコード

以下は、画面の中心に青い点を描画するサンプルコードです。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    // 画面の幅と高さを取得
    int screenWidth = GetScreenWidth();
    int screenHeight = GetScreenHeight();
    // 中心に点を描画
    DrawPixel(screenWidth / 2, screenHeight / 2, GetColor(0, 0, 255)); // 中心に青い点を描画
    // 描画結果を画面に表示
    ScreenFlip();
    // 終了まで待機
    WaitKey();
    DxLib_End(); // DXライブラリの終了
    return 0;
}

このコードでは、画面の中心に青い点を描画しています。

GetScreenWidthとGetScreenHeightを使って、画面のサイズを取得し、中心座標を計算しています。

点の描画に関する応用

複数の点を描画する方法

複数の点を描画するには、DrawPixel関数を複数回呼び出す必要があります。

以下のサンプルコードでは、異なる座標に3つの点を描画しています。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    // 複数の点を描画
    DrawPixel(50, 50, GetColor(255, 0, 0)); // 赤い点
    DrawPixel(150, 50, GetColor(0, 255, 0)); // 緑の点
    DrawPixel(250, 50, GetColor(0, 0, 255)); // 青い点
    // 描画結果を画面に表示
    ScreenFlip();
    // 終了まで待機
    WaitKey();
    DxLib_End(); // DXライブラリの終了
    return 0;
}

このコードでは、赤、緑、青の3つの点を異なる座標に描画しています。

ループを使った点の描画

ループを使用することで、効率的に複数の点を描画することができます。

以下のサンプルコードでは、ループを使って横一列に10個の点を描画しています。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    // 横一列に点を描画
    for (int i = 0; i < 10; i++) {
        DrawPixel(50 + i * 10, 100, GetColor(255, 255, 0)); // 黄色い点
    }
    // 描画結果を画面に表示
    ScreenFlip();
    // 終了まで待機
    WaitKey();
    DxLib_End(); // DXライブラリの終了
    return 0;
}

このコードでは、forループを使って、横一列に黄色い点を描画しています。

点の間隔は10ピクセルです。

点の色を動的に変更する方法

点の色を動的に変更するには、変数を使って色の値を変更しながら描画します。

以下のサンプルコードでは、時間経過に応じて点の色を変化させています。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    // 色の変数
    int red = 255;
    int green = 0;
    int blue = 0;
    // 点の描画ループ
    while (1) {
        // 点を描画
        DrawPixel(100, 100, GetColor(red, green, blue)); // 点の色を描画
        // 色を変更
        red = (red + 1) % 256; // 赤を増加
        green = (green + 2) % 256; // 緑を増加
        blue = (blue + 3) % 256; // 青を増加
        // 描画結果を画面に表示
        ScreenFlip();
        // 終了条件
        if (CheckHitKey(KEY_INPUT_ESCAPE)) break; // ESCキーで終了
    }
    // 終了処理
    DxLib_End(); // DXライブラリの終了
    return 0;
}

このコードでは、点の色が時間とともに変化します。

ESCキーを押すことでプログラムを終了できます。

点の描画速度を最適化する方法

点の描画速度を最適化するためには、描画処理を効率的に行うことが重要です。

以下のサンプルコードでは、描画を一度にまとめて行う方法を示しています。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    // 描画開始
    SetDrawScreen(DX_SCREEN_BACK); // バックバッファに描画
    // 点を描画
    for (int i = 0; i < 100; i++) {
        DrawPixel(i, 100, GetColor(255, 0, 0)); // 赤い点
    }
    // 描画結果を画面に表示
    ScreenFlip();
    // 終了まで待機
    WaitKey();
    DxLib_End(); // DXライブラリの終了
    return 0;
}

このコードでは、SetDrawScreen(DX_SCREEN_BACK)を使用して、バックバッファに描画を行い、最後に一度だけScreenFlipで画面に表示しています。

これにより、描画速度が向上します。

点描画の実践例

グリッド状に点を描画する

グリッド状に点を描画するには、二重のループを使用して、指定した間隔で点を描画します。

以下のサンプルコードでは、10ピクセル間隔でグリッド状に点を描画しています。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    // グリッド状に点を描画
    for (int x = 0; x < 640; x += 10) { // X座標
        for (int y = 0; y < 480; y += 10) { // Y座標
            DrawPixel(x, y, GetColor(0, 255, 0)); // 緑の点
        }
    }
    // 描画結果を画面に表示
    ScreenFlip();
    // 終了まで待機
    WaitKey();
    DxLib_End(); // DXライブラリの終了
    return 0;
}

このコードでは、640×480の画面に緑の点を10ピクセル間隔で描画しています。

ランダムな位置に点を描画する

ランダムな位置に点を描画するには、GetRand関数を使用してランダムな座標を生成します。

以下のサンプルコードでは、画面内のランダムな位置に赤い点を描画しています。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    // ランダムな位置に点を描画
    for (int i = 0; i < 100; i++) { // 100個の点を描画
        int x = GetRand(640); // X座標をランダムに取得
        int y = GetRand(480); // Y座標をランダムに取得
        DrawPixel(x, y, GetColor(255, 0, 0)); // 赤い点
    }
    // 描画結果を画面に表示
    ScreenFlip();
    // 終了まで待機
    WaitKey();
    DxLib_End(); // DXライブラリの終了
    return 0;
}

このコードでは、画面内のランダムな位置に赤い点を100個描画しています。

点を使った簡単なアニメーション

点を使ったアニメーションを作成するには、位置を変化させながら描画を繰り返します。

以下のサンプルコードでは、点が右に移動するアニメーションを実現しています。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    int x = 0; // 点の初期X座標
    // アニメーションループ
    while (1) {
        // 画面をクリア
        ClearDrawScreen();
        // 点を描画
        DrawPixel(x, 240, GetColor(0, 0, 255)); // 青い点
        // X座標を更新
        x = (x + 1) % 640; // 画面の幅を超えたら戻る
        // 描画結果を画面に表示
        ScreenFlip();
        // 終了条件
        if (CheckHitKey(KEY_INPUT_ESCAPE)) break; // ESCキーで終了
    }
    // 終了処理
    DxLib_End(); // DXライブラリの終了
    return 0;
}

このコードでは、青い点が画面の中央で右に移動し、画面の端に達すると戻るアニメーションを実現しています。

点を使った図形の描画

点を使って図形を描画することも可能です。

以下のサンプルコードでは、三角形を点で描画しています。

#include <DxLib.h>
int main() {
    // DXライブラリの初期化
    ChangeWindowMode(TRUE); // ウィンドウモードにする
    if (DxLib_Init() == -1) return -1; // 初期化に失敗したら終了
    // 三角形の頂点
    int x1 = 320, y1 = 100; // 頂点1
    int x2 = 270, y2 = 300; // 頂点2
    int x3 = 370, y3 = 300; // 頂点3
    // 三角形を点で描画
    DrawPixel(x1, y1, GetColor(255, 0, 0)); // 頂点1
    DrawPixel(x2, y2, GetColor(255, 0, 0)); // 頂点2
    DrawPixel(x3, y3, GetColor(255, 0, 0)); // 頂点3
    // 描画結果を画面に表示
    ScreenFlip();
    // 終了まで待機
    WaitKey();
    DxLib_End(); // DXライブラリの終了
    return 0;
}