[C++] 91 動的ライブラリdylib作成 カラーコード変換

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

カラーコードを変換する動的ライブラリを作成しました。

コンパイラclang++のオプションとして-std=c++17が必要なのに気がつかず、少し手間取りました。何も付けないとC++03以前のレガシーC++としてコンパイルされるようです。

#pragma once
#include <string>
#include <vector>
#include <stdio.h>
#include <ctype.h>
#include <memory>
#include <sstream>
#include <iostream>
#include <unistd.h>
#include <iomanip>

using std::string; using std::vector;
using std::cout; using std::endl;
using std::to_string; using std::stoi;

class ColorConvert{

public:
vector<string> split(string str, char del);

vector<int> ZeroToRGB(string);
vector<int> SharpToRGB(string);
vector<int> HexToRGB(string);

string ZeroToSharp(string);
string ZeroToHex(string);
string SharpToZero(string);
string SharpToHex(string);
string HexToZero(string);
string HexToSharp(string);
string RGBToHex(string);

string RGBToString(vector<int>);
};
#include "ColorConvert.h"

vector<string> ColorConvert::split(string str, char del) {
    int first = 0;
    int last = str.find_first_of(del);
 
    vector<string> result;
 
    while (first < str.size()) {
        string subStr(str, first, last - first);
 
        result.push_back(subStr);
 
        first = last + 1;
        last = str.find_first_of(del, first);
 
        if (last == string::npos) {
            last = str.size();
        }
    }
    return result;
}

vector<int> ColorConvert::ZeroToRGB(string color_zero){
    vector<int> RGBColor;

    string red0 = color_zero.substr(2,2);
    
    int red = stoi(red0, nullptr, 16);
    RGBColor.push_back(red);

    string green0 = color_zero.substr(4,2);
    int green = stoi(green0, nullptr, 16);
    RGBColor.push_back(green);

    string blue0 = color_zero.substr(6,2);
    int blue = stoi(blue0, nullptr, 16);
    RGBColor.push_back(blue);

    return RGBColor;
}

vector<int> ColorConvert::SharpToRGB(string color_sharp){
    vector<int> RGBColor;

    string red0 = color_sharp.substr(1,2);
    int red = stoi(red0, nullptr, 16);
    RGBColor.push_back(red);

    string green0 = color_sharp.substr(3,2);
    int green = stoi(green0, nullptr, 16);
    RGBColor.push_back(green);

    string blue0 = color_sharp.substr(5,2);
    int blue = stoi(blue0, nullptr, 16);
    RGBColor.push_back(blue);

    return RGBColor;
}

vector<int> ColorConvert::HexToRGB(string color_hex){
    vector<int> RGBColor;

    string red0 = color_hex.substr(0,2);
    int red = stoi(red0, nullptr, 16);
    RGBColor.push_back(red);

    string green0 = color_hex.substr(2,2);
    int green = stoi(green0, nullptr, 16);
    RGBColor.push_back(green);

    string blue0 = color_hex.substr(4,2);
    int blue = stoi(blue0, nullptr, 16);
    RGBColor.push_back(blue);

    return RGBColor;
}

string ColorConvert::ZeroToSharp(string color_zero){
    string color_hex = color_zero.erase(0,2);
    cout << "color_hex " << color_hex.c_str() << endl;

    string color_sharp = "#" + color_hex;

    return color_sharp;
}

string ColorConvert::ZeroToHex(string color_zero){
    string color_hex = color_zero.erase(0,2);
    cout << "color_hex " << color_hex.c_str() << endl;

    return color_hex;
}

string ColorConvert::SharpToZero(string color_sharp){
    string color_hex = color_sharp.erase(0,1);
    cout << "color_hex " << color_hex.c_str() << endl;

    string color_zero = "0x" + color_hex;

    return color_zero;
}

string ColorConvert::SharpToHex(string color_sharp){
    string color_hex = color_sharp.erase(0,1);
    cout << "color_hex " << color_hex.c_str() << endl;

    return color_hex;
}

string ColorConvert::HexToZero(string color_hex){
    string color_zero = "0x" + color_hex;

    return color_zero;
}

string ColorConvert::HexToSharp(string color_hex){
    string color_sharp = "#" + color_hex;

    return color_sharp;
}

string ColorConvert::RGBToHex(string color_rgb){
    vector<string> rgb_list = ColorConvert::split(color_rgb, ',');
    vector<string> red00 = ColorConvert::split(rgb_list[0], '(');
    vector<string> blue00 = ColorConvert::split(rgb_list[2], ')');

    string red0 = red00[1];
    string green0 = rgb_list[1];
    string blue0 = blue00[0];
    cout << "red0 " << red0.c_str() << " green0 " << green0.c_str() << " blue0 " << blue0.c_str() <<endl;

    int red = stoi(red0);
    int green = stoi(green0);
    int blue = stoi(blue0);

    // 10進数から16進数へ変換
    std::stringstream ss1;
    ss1 << std::hex << std::setw(2) << std::setfill('0') << red;
    string red_hex = ss1.str();
    cout << red_hex.c_str() << endl;

    std::stringstream ss2;
    ss2 << std::hex << std::setw(2) << std::setfill('0') << green;
    string green_hex = ss2.str();
    cout << green_hex.c_str() << endl;

    std::stringstream ss3;
    ss3 << std::hex << std::setw(2) << std::setfill('0') << blue;
    string blue_hex = ss3.str();
    cout << blue_hex.c_str() << endl;

    string color_hex = red_hex + green_hex + blue_hex;

    return color_hex;
}

string ColorConvert::RGBToString(vector<int> RGBColor){
    int red = RGBColor[0];
    int green = RGBColor[1];
    int blue = RGBColor[2];
    string color_rgb = "RGB(" + to_string(red) + "," + to_string(green) + "," + to_string(blue) + ")";

    return color_rgb;
}
clang++ -dynamiclib -o ColorConvert.dylib \
ColorConvert.cpp \
-I/code/cpp/mylib/include -std=c++17

[C++] 90 10進数から16進数へ変換、大文字へ変換

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

C++で整数を変換するのは初めてかもしれません。大文字へ変換する関数も載せておきます。

C言語とC++のtoupper関数の違いが分からなくて苦労しました。今回はC言語の方を使っています。C++のtoupper関数は上級者向けでしょうか。型推論が効かないため正確に使わないとコンパイラからのダメ出しが止まりません。

またvectorの範囲コンストラクタというものを初めて使いましたが、最初見た時は関数なのか変数なのか文法的に矛盾しているように見えて意味が分かりませんでした。

現時点でアプリのサイズは455KBです。フル機能のJava版は45.6MBですから100分の1に収まっています。起動はもっさりから爆速になりました。実質的リファクタリングの効果もあると思います。

#include <algorithm>

using std::transform; using std::toupper;

// 大文字へ変換する関数
string capitalizeString(string s)
{
    vector<char> s_char(s.begin(), s.end());

    vector<char> s_char_up;
    for (auto && c:s_char){
        char c_up = toupper(c);
        s_char_up.push_back(c_up);
    }

    string str(s_char_up.begin(), s_char_up.end());

    return str;
}

int red = stoi(red0);
int green = stoi(green0);
int blue = stoi(blue0);

// 10進数から16進数へ変換
std::stringstream ss1;
ss1 << std::hex << red;
// 0埋めで2桁にする場合
// ss1 << std::hex << std::setw(2) << std::setfill('0') << red;
string red_hex = ss1.str();
cout << red_hex.c_str() << endl;

std::stringstream ss2;
ss2 << std::hex << green;
string green_hex = ss2.str();
cout << green_hex.c_str() << endl;

std::stringstream ss3;
ss3 << std::hex << blue;
string blue_hex = ss3.str();
cout << blue_hex.c_str() << endl;

// 大文字へ変換
string color_hex0 = red_hex + green_hex + blue_hex;
string color_hex = capitalizeString(color_hex0);
string color_zero = "0x" + color_hex;
code_input->value("");
code_input->insert(color_zero.c_str());
--------------------------------------------------
出力例
--------------------------------------------------
0xC9171E

[C++] 89 FLTK : ウィジェットの再描画 redraw関数

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

カラーボタンから取得したカラーコードをFl_Boxの色設定に使いました。redraw関数による再描画が必要になります。

extern Fl_Input *name_input, *romaji_input, *code_input;
extern Fl_Tabs *tabs;
extern string colorList[3][140];
extern string colorList2[4][3][120];
extern vector<string> tab_names;
extern Fl_Box *colorBox;
string *name, *romaji, *color;
const char *name_c, *romaji_c, *color_c;

vector<int> RGBConvert(string colorcode){
    vector<int> RGBColor;

    string red0 = colorcode.substr(2,2);
    int red = stoi(red0, nullptr, 16);
    RGBColor.push_back(red);

    string green0 = colorcode.substr(4,2);
    int green = stoi(green0, nullptr, 16);
    RGBColor.push_back(green);

    string blue0 = colorcode.substr(6,2);
    int blue = stoi(blue0, nullptr, 16);
    RGBColor.push_back(blue);

    return RGBColor;
}

void getColor(Fl_Widget*, long num){
    cout << "num " << num << endl;

    Fl_Widget * tab = tabs->value();
    const char* lbl = tab->label();
    cout << "lbl " << lbl << endl;
    string lbl_str = (string)lbl;

    int tab_num = getIndex(tab_names,lbl_str);
    cout << "tab_num " << tab_num << endl;

    if (tab_num == 0){
        name = &(colorList[0][num]);
        name_c = name->c_str();

        romaji_c = "-";

        color = &(colorList[2][num]);
        color_c = color->c_str();
        
    } else {
        name = &(colorList2[tab_num-1][0][num]);
        name_c = name->c_str();

        romaji = &(colorList2[tab_num-1][1][num]);
        romaji_c = romaji->c_str();
        
        color = &(colorList2[tab_num-1][2][num]);
        color_c = color->c_str();
        
    }
    name_input->value("");
    name_input->insert(name_c);

    romaji_input->value("");
    romaji_input->insert(romaji_c);

    code_input->value("");
    code_input->insert(color_c);

    vector<int> rgbcolor = RGBConvert(*color);
    int red = rgbcolor[0];
    int green = rgbcolor[1];
    int blue = rgbcolor[2];
    cout << "RGB " << red << " " << green << " " << blue <<endl;

    colorBox->redraw();
    colorBox->color(fl_rgb_color(red,green,blue));
}

[C++] 88 FLTK : Fl_Tabsのインデックス値取得

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

Fl_Tabsのインデックス値を取得し、押下したカラーボタンの内容を3次元配列データから取り出すようにしました。

Tabのインデックス値取得はfor文内で変数に代入する方法ではうまくいかず、関数の戻り値にするとあっさり出来ました。

ようやく次の段階に移ることができます。選択した色の表示、カラーコードの変換などです。

extern Fl_Tabs *tabs;
extern string colorList[3][140];
extern string colorList2[4][3][120];
extern vector<string> tab_names;

int getIndex(vector<string> &input, string searched) {
    for (int i = 0; i < input.size(); i++) {
        if (input[i] == searched) {
            return i;
        }
    }
    return -1;
}

void getColor(Fl_Widget*, long num){
    cout << "num " << num << endl;

    Fl_Widget * tab = tabs->value();
    const char* lbl = tab->label();
    cout << "lbl " << lbl << endl;
    string lbl_str = (string)lbl;

    int tab_num = getIndex(tab_names,lbl_str);
    cout << "tab_num " << tab_num << endl;

    if (tab_num == 0){
        string* name = &(colorList[0][num]);
        const char* name_c = name->c_str();
        name_input->value("");
        name_input->insert(name_c);

        const char* romaji_c = "-";
        romaji_input->value("");
        romaji_input->insert(romaji_c);

        string* color = &(colorList[2][num]);
        const char* color_c = color->c_str();
        code_input->value("");
        code_input->insert(color_c);

    } else {
        string* name = &(colorList2[tab_num-1][0][num]);
        const char* name_c = name->c_str();
        name_input->value("");
        name_input->insert(name_c);

        string* romaji = &(colorList2[tab_num-1][1][num]);
        const char* romaji_c = romaji->c_str();
        romaji_input->value("");
        romaji_input->insert(romaji_c);

        string* color = &(colorList2[tab_num-1][2][num]);
        const char* color_c = color->c_str();
        code_input->value("");
        code_input->insert(color_c);
    }
}

[C++] 87 FLTK : 長整数型を引数とするcallback関数

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

for文で一気に作成するButtonのcallback関数の書き方で難航しました。左側Tab内のButtonを押して、色名やカラーコードなどその内容を右上のFl_inputに表示します。

Fl_Callback1(Fl_Widget *, long)という長整数型データを第2引数とするcallback関数を使うことで解決しました。第2引数としてButtonのインデックス(通し番号)を設定しています。

今回は有りもので何とかなりましたが、Fl_Callbackを継承すれば好きなデータ型で独自のクラスを作れるでしょう。

Java(Swing)の場合はfor文の中でActionListenerを使えたものの、さすがにFLTKではcallback関数の定義をfor文内に埋め込みできず、加えてButtonのラベルをうまく取得できなくてさすがに詰んだのではないかと一時は諦めかけました。

最大の難関をクリアできたので、後は何とかなると思います。

void getColor(Fl_Widget*, long num){
    cout << "num " << num << endl;

    Fl_Widget* tab = tabs->value(); // 有効なタブのポインタ
    const char* lbl = tab->label(); // タブのラベル
    cout << "lbl " << lbl << endl;
    string lbl_str = (string)lbl;

    if (lbl_str == tab_names[0]){
        string* color_name = &(colorList[0][num]);
        const char* color_name_p = color_name->c_str();
        name_input->insert(color_name_p);
    } 
}

<中略>

button->callback(getColor,(long)num);

[C++] 86 FLTK : カラーアプリ移植 各種ウィジェット配置

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

カラーアプリの右側に各種ウィジェットを配置しました。

Java版であまり使わなかったアルファ値、色調整機能、登録機能、メモ欄を削除し、色コードから色名やアプリ内位置を検索する機能を追加します。

ここまでの内容を1ファイル200行程度で書けており、超初心者だったSwingでの作成時に比べて大分要領が良くなっています。

当時はGridBagLayoutに相当悩まされました。ウィンドウサイズ固定であれば座標で位置決めするのが結局一番速いように思いますね。

[C++] 85 FLTK : カラーアプリ移植 Fl_Button labelcolor

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

ラベルを読みやすくするため、背景色に合わせてラベル色を変えました。

RGBの合計値やGreen値で条件分岐しています。

if (green > 200 && sum < 486){
		button->labelcolor(fl_rgb_color(128,128,128));
} else if(green > 180 && sum < 480){
		button->labelcolor(fl_rgb_color(128,128,128));
} else if(sum < 508){
		button->labelcolor(fl_rgb_color(245,245,245));
} else{
		button->labelcolor(fl_rgb_color(105,105,105));
}

[C++] 84 FLTK : カラーアプリ移植 Fl_Align

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

ボタンのラベルを左寄せにし、はみ出した部分は表示しないようにしました。

JavaのSwingでしたら、中央揃え・はみ出し非表示にしてなおかつ左の文字が切れないようにしてくれます。FLTKではそのような芸当はできないようなので左寄せにしました。

[C++] 83 FLTK : カラーアプリ移植 多次元配列

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

Javaアプリの移植に着手しました。

このアプリを完成させた1月下旬時点と比べてプログラミングスキルはアップしているので、成果を反映させながらグレードアップさせたいです。

まずは配列を3次元にして各要素にアクセスできるようにしました。

[C++] 82 FLTK : Fl_ButtonのFl_Boxtype設定

[M1 Mac, Big Sur 11.6.7, clang 13.0.0, NO IDE]

Fl_buttonのFl_BoxtypeはデフォルトでFL_UP_BOXになっていて出っ張った形状になっています。

これをFl_Widgetから継承したbox関数で変更できます。FL_FLAT_BOXでボタン周囲の枠がなくなります。

この方法が分からなかったためにJava(Swing)で製作したカラーサンプルアプリの移植を進められなかったのですが、これで本格的に着手できます。

Swingの特徴であるLook & Feelは外観に統一感を持たせるのに便利なものの、その分自由度が抑えられてしまう点が引っかかってました。

Java版はサイズが45.6MBなので、どこまで軽量、高速化できるのか楽しみです。

Fl_Button *button = new Fl_Button(loc_x, loc_y, 75, 15);
    button->box(FL_FLAT_BOX);
    button->color(fl_rgb_color(red,green,blue));
    button->labelcolor(fl_rgb_color(169,169,169));
    button->labelsize(10);