Renesas RX微控制器、C++ 框架、库、示例_C++_代码_相关文件_下载

Renesas RX65N/RX72N Envision Kit GUI サンプル ========= <img src="../docs/gui_sample.jpg" width="50%"> [Japanese](READMEja.md) ## 概要 - C++ GUI フレームワークを利用したサンプル - GUI のレンダリングは、ソフトウェアー、又は、DRW2D エンジンを選択出来ます。 - ソフトウェアーレンダラーでは、プラットホームを選びません。 - 基本的な GUI フレームワークの利用方法や、操作に対する考え方が判ります。 - GUI を使ったアプリを開発する場合の要領が判ります。 ## プロジェクト・リスト - main.cpp - RX65N/Makefile - RX72N/Makefile ## GUI サンプルの機能 - ボタン「Button」 - ボタン「Active」 - チェックボックス - ラジオボタン - 水平スライダー - 垂直スライダー - メニュー（ItemA, ItemB, ItemC, ItemD） - テキスト（自動スクロール） - テキストボックス（垂直アライメント：センター） 各動作： - 各 widget を操作すると、シリアル出力で、対応する文字列を出力します。 - 「Button」を押す度に、「Active」ボタンの状態が変化します。（ストール -> 許可） - チェックが有効になると、ラジオボタンの描画色を「白」にする。 - ラジオボタンを操作すると、それに応じて、描画色が変化（Red, Green, Blue） - text widget には、表示領域より大きい文字列を登録してあり、それが自動でスクロールします。 --- ## C++/GUI フレームワークの特徴 - 基本的に C++17 準拠で実装されています。 - GNU RX 8.3.0 以降でコンパイル可能。 - GUI の配置ツールなど、他のアプリを連携しない。（これはデメリットと感じる方もいます） - MIT ライセンスでソースコードの全てが公開されているので、改造や拡張が自由に出来る。 - あまり複雑な場面より、単純な場面を想定して設計されている為、扱うのが簡単。 - 複雑な操作を行う GUI を実装する事も可能な自由度がある。 - リアルタイム処理にマッチするよう、画面描画を同期式で行っており、FreeRTOS などを使わなくても描画間隔の制御が簡単。 - もちろん、FreeRTOS を使う場合でも問題なく利用できる。 - C++ の機能を使って、より良い方法で実装が出来る。 GUI のアプリケーションを作成する場合、最初のハードルは、部品（Widget）のデザインや配置です。 デザインに関しては、角をラウンドさせたシンプルなデザインを採用しており、プリミティブの合成により描画させています。 ※ビットマップデータでは無いので、柔軟性があります。 constexpr を積極利用する事で、配置の問題はかなり柔軟に対応出来ます。 デザインに関しては、初期の段階で標準的なデザインを持った Widget（ボタン、スライダー、チェックボックスなど）を用意してありますので、当面は困らないと思います。 もし、異なったデザインが必要なら、ビットマップ画像を利用する事も出来るし、既存のクラスをコピーして自分の気に入るデザインの部品を作る事も可能です。 GUI のデザインツールや配置ツールは、かなり複雑な場合は必要かもしれませんが、携帯機器のように限られたサイズの液晶向けアプリケーションでは、あまり必要性を感じないと思います。 又、そのようなツールを使う場合、そのツールが出力する中間ファイルなどの扱いが微妙で、ソースコードと隔離されてしまい、将来的に保守をする場合に、問題が発生する事になりますし、ソースコードの保守を難しくします。 ## widget の基本的な使い方 RX65N/RX72N Envision Kit についての解説ですが、他のハードウェアーでも同じように利用できるように工夫した構造と構成になっています。 画像表示機能が無いマイコンで利用する場合には、メインメモリをフレームバッファとしてアロケートし、それを LCD に転送するような方法が必要です。 RX マイコンの場合、DMAC があるので、それらを利用する事で、同じような構成にする事が出来ると思います。 --- ### RX65N/RX72N 描画ハードウェアー定義と設定 RX65N/RX72N では、LCD に表示を行うハードウェアー（GLCDC）を内蔵しており、その設定を行う事で簡単に表示環境を構築出来ます。 基本的に、ドットクロック、画素データ、水平同期信号、垂直同期信号を生成します。 以下の例は、RX65N/RX72N Envision Kit に搭載された LCD の表示設定を行うものです。 ``` // LCD 定義 static const int16_t LCD_X = 480; static const int16_t LCD_Y = 272; static const auto PIX = graphics::pixel::TYPE::RGB565; #if defined(SIG_RX65N) // GLCDC 関係定義 typedef device::PORT<device::PORT6, device::bitpos::B3> LCD_DISP; typedef device::PORT<device::PORT6, device::bitpos::B6> LCD_LIGHT; static const uint32_t LCD_ORG = 0x0000'0100; #elif defined(SIG_RX72N) // GLCDC 関係定義 typedef device::PORT<device::PORTB, device::bitpos::B3> LCD_DISP; typedef device::PORT<device::PORT6, device::bitpos::B7> LCD_LIGHT; static const uint32_t LCD_ORG = 0x0080'0000; #endif // GLCDC 関係リソース typedef device::glcdc_mgr<device::GLCDC, LCD_X, LCD_Y, PIX> GLCDC; GLCDC glcdc_(nullptr, reinterpret_cast<void*>(LCD_ORG)); ... { // GLCDC の初期化 LCD_DISP::DIR = 1; LCD_LIGHT::DIR = 1; LCD_DISP::P = 0; // DISP Disable LCD_LIGHT::P = 0; // BackLight Disable (No PWM) if(glcdc_.start()) { utils::format("Start GLCDC\n"); LCD_DISP::P = 1; // DISP Enable LCD_LIGHT::P = 1; // BackLight Enable (No PWM) if(!glcdc_.control(GLCDC::CONTROL_CMD::START_DISPLAY)) { utils::format("GLCDC ctrl fail...\n"); } } else { utils::format("GLCDC Fail\n"); } } ``` - LCD_DISP は、LCD 表示を「有効／無効」にする制御ポートです。 - LCD_LIGHT は、バックライトの「ON、OFF」です。 - glcdc_mgr クラスは、内部で、480x272 サイズの液晶用パラメータをハードコードしており、他のサイズ液晶を定義する場合、パラメータを修正する必要があります。 - この構造は良くありませんので、将来的には改善する予定です。 ``` // // Definition of LCD for 480x272 LCD by 60Hz // // Horizontal cycle (whole control screen) 529 // Vertical cycle (whole control screen) 315 // Horizontal Synchronization Signal Assertion Position cfg.output.htiming.front_porch = 8; // Vertical Synchronization Assertion Position cfg.output.vtiming.front_porch = 10; // Horizontal Active Pixel Start Position (min. 6 pixels) cfg.output.htiming.back_porch = 39; cfg.output.vtiming.back_porch = 32; // Horizontal Active Pixel Width cfg.output.htiming.display_cyc = XSIZE; // Vertical Active Display Width cfg.output.vtiming.display_cyc = YSIZE; // Vertical Active Display Start Position (min. 3 lines) cfg.output.htiming.sync_width = 2; cfg.output.vtiming.sync_width = 1; ``` --- ### 描画リソースの定義と設定 描画を行うリソースとして、ビットマップフォントを設定する必要があります。 ``` // フォントの定義 typedef graphics::font8x16 AFONT; // for cash into SD card /kfont16.bin // typedef graphics::kfont<16, 16, 64> KFONT; typedef graphics::kfont<16, 16> KFONT; typedef graphics::font<AFONT, KFONT> FONT; AFONT afont_;