Part6_位图按钮控件演示
<p>[TOC]</p>
<h1>功能描述</h1>
<p>本例程将演示位图按钮控件的使用</p>
<h4>接线方法</h4>
<p>将彩屏和Arduino控制器进行连接，RX-TX,GND-GND（用到了RX和TX串口）</p>
<h4>实现功能</h4>
<p>本例将在part5示例的资源文件基础上进行修改，实现位图按钮触摸控制Arduino系统板上LED灯亮灭状态，所需资源已在下方资源链接中准备好。
将图片导入后，点击位图按钮，框选大概位置后进入配置，配置详述可查看相应模块的技术详解文档进行了解，按需配置完成后可再进行位置的调整。本例设置了三个位图按钮进行控制，调整好后即可编程使用测试。</p>
<h4>操作示例</h4>
<p>1.新建资源文件，本例仍使用ATF043模块做演示，配置如图：
<img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=4b7ce16062ce3360b5126e0f0a00818e&amp;file=file.png" alt="" />
2.切换资源列表，使用图片导入按钮导入所需图片。
注意不同格式的图片有不同的添加按钮，具体可查看<strong>常规应用教程part5</strong>。
3.新建界面，双击进入界面编辑，添加背景图片以及背光设置指令。
4.进入界面控制页，点击<strong>位图按钮控件</strong>添加，框选大概位置后出现位图按钮配置，其中有多种属性可配置，并可实现多种显示、触摸响应效果；该控件支持控件消息配置，用户可根据需求进行配置，本例设置了三个按钮，id分别为100，101，102。其中100和101按钮类型设置为响应释放消息，102为乒乓开关
具体设置如图：按键100
<img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=e7dcda0b0e5d22513d80bdcf7c6e1bd0&amp;file=file.png" alt="" />
按键101：
<img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=c62235f8c7457cba64e8e8e00fd3dc23&amp;file=file.png" alt="" />
按键102：
<img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=a27f8c6fd2a5b944abfb13de648f4847&amp;file=file.png" alt="" /></p>
<h1>使用代码</h1>
<pre><code class="language-c">void setup() {
// put your setup code here, to run once:
Serial.begin(9600);
Serial.setTimeout(20);
pinMode(LED_BUILTIN, OUTPUT);
digitalWrite(LED_BUILTIN, LOW);
}
unsigned char m_ReciverHeader; //ATF Message Header char = @/#/$
unsigned short m_ReciverBodyID; //ATF Message BodyID 0:GUI Swtich 100~65535:Body Msg
int m_ReciverVarInt; //ATF Message int Val(Header=@)
float m_ReciverVarFloat; //ATF Message float Val(Header=#)
String m_ReciverVarString; //ATF Message String Val(Header=$)
void loop() {
// put your main code here, to run repeatedly:
if(ATFMessageService(2))
{
if(m_ReciverBodyID==100)
{
digitalWrite(LED_BUILTIN, HIGH);
}
if(m_ReciverBodyID==101)
{
digitalWrite(LED_BUILTIN, LOW);
}
if(m_ReciverBodyID==102)
{
if(m_ReciverVarInt==1)
digitalWrite(LED_BUILTIN, HIGH);
else
digitalWrite(LED_BUILTIN, LOW);
}
}
}
unsigned char ATFMessageService(unsigned char delaytimer)
{
char n_TempChar;
n_TempChar = Serial.available();
if(n_TempChar)
{
delay(delaytimer);
n_TempChar = Serial.read();
while(n_TempChar!='@'&amp;&amp;n_TempChar!='#'&amp;&amp;n_TempChar!='$'&amp;&amp;n_TempChar&gt;=0)
{
n_TempChar = Serial.read();
}
m_ReciverHeader = n_TempChar;
m_ReciverBodyID = Serial.parseInt();
if(n_TempChar=='@')
{
m_ReciverVarInt = Serial.parseInt();
}
else if(n_TempChar=='#')
{
m_ReciverVarFloat = Serial.parseFloat();
}
else if(n_TempChar=='$')
{
Serial.read();
m_ReciverVarString = Serial.readStringUntil('\r');
}
else return 0;
return 1;
}
return 0;
}</code></pre>
<h1>资源文件</h1>
<p><a href="https://pan.baidu.com/e/1UwEk62gqqAaehDQx91z3HQ?pwd=ATFC">高级篇part6_资源文件</a></p>
<h1>视频教程</h1>
<p><a href="https://www.bilibili.com/video/BV1VF41137Cw/?spm_id_from=333.999.0.0&amp;vd_source=8adc070117854dc6967b17bf3379321b">【高级篇】Part6_位图按钮控件演示</a></p>