0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

懐かしい FLTK(Fast Light Toolkit)を試してみた

0
Posted at

20何年か前にちょっとしたツールを作るのに大変便利に使用させて頂いていました。
当時はBorland C++ 5.5.1をよく使っていたのですが、GUIを作るのに軽いツールキットを探しているときに、FLTK(フルティックって呼んでいたと思います)にたどり着きました。
BorlandだとDelphiやC++Builderがありましたが、有償なのと開発ツール自体も比較的重たいので、軽いコンパイラ・リンカーのBorland C++ 5.5.1との組み合わせはお気に入りでした。
その時のFLTKはVer1.1.xだったと思うのですが、Borland C++ 5.5.1でもどうにか構築出来ました(ソースの修正は若干必要でしたが)。といってもFLTK自体そんなに使いこなしていた訳ではないのですが、GUIを簡単に追加するのには便利でした。
もう10数年は使っていませんが、何気なく検索していたら今でも更新されていたので、ちょっと試したくなりました。#自分の忘備録11

  • FL(Fast Light)の名称からしても、とにかく軽快に動く
  • GUIを作るためのビルダーfluid(Fast Light User Interface Designer)が付属している
  • Toolkitライブラリをスタティックリンクしてもexeが小さい
  • Linux、Windows、MacOSXなどマルチプラットフォームで動く

などなど、今回はWindowsのcmake(Visual Studio 2026)でサクっと試させてもらいます。

FLTK構築

Download - Fast Light Toolkit から最新版ソース fltk-1.4.4-source.tar.gz をダウンロードして構築します。ここにはマニュアルもあるので一緒にダウンロードしておきます。

(構築)
fltk-1.4.4-source.tar.gzを解凍する

cd fltk-1.4.4
cmake -S . -B build
cmake --build build

WindowsのcmakeはデフォルトでDebugビルドですが、昔とは違っていろいろなファイルが作成されました。testディレクトリ以外で作成されたファイルは以下の通り。
Ver1.1.xのときは個別に構築したのでfltk.libとfluid.exeだけでしたが(今回のDebugビルドでは、dが付いたfltkd.libになっています)。作成されたライブラリの説明は、pdfマニュアルの1.19.7 Modern CMake(149ページ)に書かれていました。
testディレクトリの中にはいろいろなサンプルが入っていたので参考になるかと思います。

build\lib\Debug\
  fltkd.lib
  fltk_gld.lib
  fltk_jpegd.lib
  fltk_zd.lib
  fltk_pngd.lib
  fltk_imagesd.lib
  fltk_formsd.lib

build\fluid\fluid-lib.dir\Debug\
  fluid-lib.lib

build\bin\Debug\
  fluid-cmd.exe
  fluid.exe

簡単なFLTKアプリを作る

fluid(build\bin\Debug\fluid.exe)を起動すると、fluidのメインウィンドウとウィジェット追加ウィンドウが開きます。
fluidの使い方は最初取っ付き難かったのですが、まずはウィジェット追加ウィンドウ(またはメニュー)からFunction(デフォルトでmake_windows()という関数名)を追加して、WindowやGroupなどのウィジェットを追加して行くのが基本です。
更にFunction+Codeには単なるコードも書くことが出来るので、すご~く簡単なプログラムはfluidだけで作成することも出来ます。

PNGファイルを読み込んで単に表示するだけのプログラムをfluidだけで作成している様子を以下に示します。画面の左上のウィンドウがfluidメインウィンドウ、右のWidget Binウィンドウがウィジェット追加ウィンドウになります。

fltk-fluid.png

fluidメインウィンドウでSave(Ctrl+S)するとflファイル(ここではtest-fltk.fl)で保存することが出来ます。Write Code(Ctrl+Shift+C)すると、作成したGUIのソースコード(test-fltk.cxx, test-fltk.h)が出力されます。

(fluidで出力されたファイル)

test-fltk.fl     fluid GUI設定ファイル
test-fltk.cxx    cxxソースファイル
test-fltk.h      hヘッダーファイル

test-fltk.flの中身が以下のようになっていて、GUIの設定情報が格納されています。
このflファイルをfluidで読み込めば、いつでもGUIのソースコードを出力することが出来ます。

(test-fltk.fl例)
# data file for the Fltk User Interface Designer (fluid)
version 1.0404
utf8_in_src
header_name {.h}
code_name {.cxx}
decl {Fl_Image *png_img;} {private local
}

decl {int space = 40;} {private local
}

decl {\#include <Fl/Fl_Box.h>} {public global
}

class My_Box {open : {public Fl_Box}
} {
  Function {My_Box(int X, int Y, int W, int H, const char *L=0) : Fl_Box(X, Y, W, H, L)} {} {
    code {} {}
  }
  Function {resize(int x, int y, int w, int h)} {open return_type {virtual void}
  } {
    code {Fl_Box::resize(x, y, w, h);
//printf("resize %d %d %d %d\\n", x, y, w, h);
png_img->scale(w - space, h - space, 0);} {}
  }
}

Function {make_window()} {open
} {
  Fl_Window dw1 {
    label {PNG view} open
    xywh {547 330 695 314} type Double align 0 resizable visible
  } {
    Fl_Menu_Bar {} {open
      xywh {0 0 695 26} align 5
    } {
      Submenu {} {
        label {&File} open
        xywh {10 10 100 20}
      } {
        MenuItem {} {
          label {&Open}
          callback {open_pngfile();}
          xywh {10 10 100 20}
        }
        MenuItem {} {
          label {E&xit}
          callback {dw1->hide();}
          xywh {10 10 100 20}
        }
      }
    }
    Fl_Box b1 {
      label {...}
      xywh {0 26 695 287} box ENGRAVED_BOX align 32 when 31 resizable
      class My_Box
    }
  }
}

Function {main()} {open return_type int
} {
  code {printf("Hello, World!\\n");
Fl_Window* w = make_window();

w->show();
return Fl::run();} {}
}

decl {\#include <Fl/Fl_PNG_Image.h>} {public global
}

decl {\#include <FL/Fl_File_Chooser.H>} {public global
}

Function {open_pngfile()} {open return_type void
} {
  code {const char *file = fl_file_chooser("Enter PNG file name ...", "Data Files(*.{png})", "", 0);
if (!file) return;

int w = 1280, h = 768;
png_img = new Fl_PNG_Image(file);
if (png_img->fail()) {
  printf("PNG file read error !!\\n");
  return;
}

png_img->scale(w - space, h - space, 1);
b1->image(png_img);
b1->label(file);

printf("file=%s\\n", file);
printf("w=%d h=%d\\n", png_img->w(), png_img->h());
printf("data_w=%d data_h=%d\\n", png_img->data_w(), png_img->data_h());

dw1->resize(dw1->x(), dw1->y(), png_img->w() + space, png_img->h() + space + b1->y());
b1->resize(0, b1->y(), png_img->w() + space, png_img->h() + space);} {}
}

test-fltk.cxx/test-fltk.hソースファイルから実行ファイルを構築するためにCMakeLists.txtファイルを作成します。cmake(Visual Studio 2026)で構築して実行します。

(CMakeLists.txt例)
# SPECIFY THE MINIMUM VERSION OF CMAKE REQUIRED
cmake_minimum_required(VERSION 3.28)

# SPECIFY YOUR PROJECT NAME
project(test-fltk)

# C++20を設定
set(CMAKE_CXX_STANDARD 20)
set(CMAKE_CXX_STANDARD_REQUIRED ON)

# MAKE SURE FLTK IS INSTALLED CORRECTLY
set(FLTK_DIR "C:/TEST/fltk-1.4.4/build")
find_package(FLTK REQUIRED)

# COMPILE CPP FILES USING THIS LINE
add_executable(test-fltk test-fltk.cxx)

# TARGET INCLUDE AND LIBRARY
target_link_libraries(test-fltk PRIVATE ${FLTK_LIBRARIES})
(構築例)
cd test-fltk        ← test-fltk.cxx/test-fltk.hとCMakeLists.txtを置いたディレクトリ
cmake -S . -B build
cmake --build build

(実行例)
build\Debug\test-fltk.exe

FLTKアプリ実行

test-fltk.exeを実行して、メニューFile > Open からファイル選択ダイアログ開くと、FLTK特有のファイルダイアログが開きます。
マンデルブロ集合のPNG画像(Mandelbrot_sequential.png)を開くと以下のように表示されました。

test-fltk.png test-fltk_Mandelbrot_sequential.png

マンデルブロ集合だったらFLTKのtestディレクトリにもサンプルがあります。
それを使えばパラメータを指定してマンデルブロ集合の描画もやってくれるので、こっちがいいですね:sweat_smile:

fltk_test_mandelbrot.png

参考にしたサイト

FLTK 1.4.4 Programming Manual

Download - Fast Light Toolkit (FLTK)

  • fltk-1.4.4-source.tar.gz
  • fltk-1.4.4-docs-pdf.tar.gz
  • fltk-1.4.4-fluid-docs-pdf.tar.gz
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?