無線ブログ集
| メイン | 簡易ヘッドライン |
jl7gmnのblog
(2024/3/11 19:35:35)
ESP32DevKitCでのカラーグラフィックSメータその６
(2023/8/6 13:35:39)
Sメータの画像表示で使用したLovyanGFXライブラリでの画像データを直接TFT液晶に書き込み表示するやり方とスプライト画面に書き込んでから表示する方法をまとめてみました。
■オフラインスプライトcanvasに書き込む方法
■直接lcdに画像データを書き込む方法
lcd.setRotation(1); //角度設定１
直接lcdに書き込む方法とオフラインバッファ画面に書き込んでから表示するのと同じ動作ですが、指針表示時間調整のディレータイムの値設定にもよると思いますが、若干ですが、lcd直接書き込みのほうがチラつきが少ないように思えます。これは、実際に動作させてみて、良いほうを使うのが常道のようです。必ずしも、オフラインで画像書き込みしたのを表示するスプライト処理がチラつきがないとは言えないこともあるようです。（書き込みの画像データ量も関係あるかと思います。）
いずれにしても、スプライト処理は画像のみならず、文字でも同様に処理できますので、覚えておいてよい表示方法かと思います。
つづく？
■オフラインスプライトcanvasに書き込む方法
//#define LGFX_AUTODETECT //no
need this one
#include <LovyanGFX.hpp>
#include "LGFX_ESP32_ST7735S.hpp" // add needing
#include "smeter.h"
#include "needle.h"
static LGFX lcd;
static LGFX_Sprite canvas(&lcd); // off screen
draw buffer
static LGFX_Sprite smeter(&canvas);// myBitmap (128x160)
static LGFX_Sprite needle(&canvas);// hari (5x100)
const uint16_t imgWidth = 128;
const uint16_t imgHeight = 160;
uint16_t signalLevel; //角度に変換するのA/D値（０から４０９５）
uint16_t avtimes = 16 ; //16 analoginput avaraging times
#define SW_TX 32 // A/D port 32 original sketch
D0
void setup() {
pinMode(SW_TX,INPUT);
lcd.init();
lcd.setColorDepth(16);
lcd.setSwapBytes(true);
smeter.setColorDepth(16);
needle.setColorDepth(16);
canvas.fillScreen(TFT_WHITE);
canvas.setPivot(lcd.width() >>1,lcd.height() >>1);
canvas.setColorDepth(16);
canvas.setSwapBytes(true);
canvas.setRotation(1);
canvas.setBuffer((void*)myBitmap,128,160,16);
canvas.createSprite(lcd.width(),lcd.height());
canvas.pushImage(0,0,128,168,myBitmap);
canvas.pushSprite(0,0);
needle.createSprite(5,100);
needle.setPivot((imgWidth/2),(imgHeight/3));
needle.setBuffer((void*)hari,5,100,16);
}
void loop() {
long d = 0 ;
//*********************************************************
// averaging settingtimes avtimes
now setting 16
for(int i=0;i<avtimes;i++){
d += analogRead(32);
}
signalLevel = d/avtimes;
Serial.println(signalLevel);
//********************************************************
//********************************************************
// mapping to degree
value
signalLevel = map(signalLevel, 0, 4095, -64 , 80);
//********************************************************
//****************************************************************************************
//エイリアス処理なし
//エイリアス処理なし
//needle.pushRotateZoom(&lcd,(imgWidth/1.55),(imgHeight/1),signalLevel,1.0,2.8);
//エイリアス処理あり
//エイリアス処理あり
needle.pushRotateZoomWithAA(&lcd,(imgWidth/1.55),(imgHeight/1),signalLevel,1.0,2.8);
// needleスプライト表示
needle.pushSprite(imgWidth/1.55,imgHeight/1);
//****************************************************************************************
delay(200); //needle 表示時間調整用
//スプライト書き込みしたcanvasを表示
canvas.pushSprite(0,0);
delay(1);
}
■直接lcdに画像データを書き込む方法
//#define LGFX_AUTODETECT //no need this one
#include
<LovyanGFX.hpp>
#include "LGFX_ESP32_ST7735S.hpp" // add needing
#include "smeter.h"
#include "needle.h"
static LGFX lcd;
static LGFX_Sprite smeter(&lcd);// myBitmap (113x160) (128x160)
static LGFX_Sprite needle(&lcd);// hari (5x100)
const uint16_t imgWidth = 128;
const
uint16_t imgHeight = 160;
uint16_t signalLevel; //角度に変換するのA/D値（０から４０９５）
uint16_t
avtimes = 16 ; //16 analoginput avaraging times
#define SW_TX 32 // A/D port 32 original sketch
D0
void setup() {
pinMode(SW_TX,INPUT);
lcd.init();
lcd.setColorDepth(16);
lcd.setSwapBytes(true);
smeter.setColorDepth(16);
needle.setColorDepth(16);
lcd.setRotation(1);
//角度設定１
lcd.pushImage(0,0,128,160,myBitmap); //指針表示
lcd.setRotation(0); //角度設定０に戻す 指針の位置設定に合わせる
lcd.pushImage((imgWidth/1.6),(imgHeight/7),5,100,hari);
needle.createSprite(5,100);
needle.setPivot((imgWidth/2),(imgHeight/3));
needle.setBuffer((void*)hari,5,100,16);
}
void loop() {
long d = 0 ;
//**************************************************
// averaging 100times
for(int i=0;i<avtimes;i++){
d += analogRead(32);
}
signalLevel = d/avtimes;
Serial.println(signalLevel);
//*********************************************************
// mapping to
degree value
signalLevel = map(signalLevel, 0, 4095, -64 , 80);
//*********************************************************
//******************************************************************************************************
//エイリアス処理なし
//needle.pushRotateZoom(&lcd,(imgWidth/1.55),(imgHeight/1),signalLevel,1.0,2.8);
//needle.pushRotateZoom(&lcd,(imgWidth/1.55),(imgHeight/1),signalLevel,1.0,2.8);
//エイリアス処理あり
needle.pushRotateZoomWithAA(&lcd,(imgWidth/1.55),(imgHeight/1),signalLevel,1.0,2.8);
needle.pushRotateZoomWithAA(&lcd,(imgWidth/1.55),(imgHeight/1),signalLevel,1.0,2.8);
needle.pushSprite(imgWidth/1.55,imgHeight/1); //指針スプライト表示
//******************************************************************************************************
delay(200);//needle 表示時間調整用
lcd.setRotation(1); //角度設定１
lcd.pushImage(0,0,128,160,myBitmap);
// Sメータ画像表示
lcd.setRotation(0);
//角度設定0に戻す。指針の位置表示に合わせる
delay(1);
}
直接lcdに書き込む方法とオフラインバッファ画面に書き込んでから表示するのと同じ動作ですが、指針表示時間調整のディレータイムの値設定にもよると思いますが、若干ですが、lcd直接書き込みのほうがチラつきが少ないように思えます。これは、実際に動作させてみて、良いほうを使うのが常道のようです。必ずしも、オフラインで画像書き込みしたのを表示するスプライト処理がチラつきがないとは言えないこともあるようです。（書き込みの画像データ量も関係あるかと思います。）
いずれにしても、スプライト処理は画像のみならず、文字でも同様に処理できますので、覚えておいてよい表示方法かと思います。
つづく？
execution time : 0.024 sec