Part5_图片显示指令操作
<h1>功能描述</h1>
<p>使用指令让ATF进行图片显示。</p>
<h4>接线方法</h4>
<p>将彩屏和Arduino控制器进行连接，RX-TX,GND-GND（用到了RX和TX串口）</p>
<h4>实现功能</h4>
<p>ATF系列模块（不含ATFLet系列）支持BMP位图及JPG图片显示。
在资源列表中加载所需图片，不同格式的图片资源有相应的添加按键，记住图片索引号后，用户可通过指令或模块的图形系统调用图片进行显示。</p>
<h4>操作示例</h4>
<p>为方便演示,本例将在part4中文字符串显示范例的基础上进行修改演示。
打开所需资源文件，将左侧标签页切换到资源列表，点击工具栏上对应图片格式的图片加载按钮，B为加载BMP位图资源，J为加载JPEG图像资源文件，P为加载PNG图像资源文件。选择所需图片加载。
如图为三种图片格式的加载按钮以及加载后效果：<img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=725ae31df41bc129d4c2ed9cba3b87b7&amp;file=file.png" alt="" />
为方便更好地确认按钮作用，我们可以将鼠标移动到按钮上稍等片刻，会出现提示文字，如图：
<img src="https://www.showdoc.com.cn/server/api/attachment/visitFile?sign=21cb0157c1b6ccbc2d42202f47776040&amp;file=file.png" alt="" />
温馨提示：
1.记住所加载的资源索引号。
2.注意所加载图片的尺寸，应小于或等于模块的像素点尺寸。</p>
<h1>使用代码</h1>
<h4>CnStringDefine.c</h4>
<pre><code class="language-c">const char m_CnString1[] = &quot;当前状态：&quot;;
const char m_CnString2[] = &quot;运行&quot;;
const char m_CnString3[] = &quot;停止&quot;;</code></pre>
<h4>CnStringDisplay.c</h4>
<pre><code class="language-c">#include &quot;CnStringDefine.c&quot;
void setup() {
// put your setup code here, to run once:
Serial.begin(9600);
delay(3000);
}
unsigned char m_RunFlag=0;
unsigned char m_DisplayFlag=0;
void loop() {
// put your main code here, to run repeatedly:
if(m_RunFlag==0)
{
m_RunFlag = 1;
Serial.println(&quot;@PRINTM 0&quot;);
Serial.println(&quot;@FONT 0,Red&quot;);
Serial.println(&quot;@FMODE 1,Blue&quot;);
Serial.print(&quot;@STR 50,100,&quot;);
Serial.println(m_CnString1);
Serial.println(&quot;@FONT 50,Yellow&quot;);
}
Serial.print(&quot;@STR 140,95,&quot;);
if(m_DisplayFlag==0)
{
Serial.println(m_CnString2);
Serial.println(&quot;@BMP 210,55,51&quot;);
m_DisplayFlag = 1;
}
else
{
Serial.println(m_CnString3);
Serial.println(&quot;@BMP 210,55,52&quot;);
m_DisplayFlag = 0;
}
delay(2000);
}</code></pre>
<h1>资源文件</h1>
<p>[常规篇part5资源文件](<a href="https://pan.baidu.com/e/1VMxO3uivnhO9nDOycveLFw?pwd=ATFC">https://pan.baidu.com/e/1VMxO3uivnhO9nDOycveLFw?pwd=ATFC</a> "常规篇part5资源文件")</p>
<h1>视频教程</h1>
<p><a href="https://www.bilibili.com/video/BV14Y4y1q7KE/?spm_id_from=333.999.0.0&amp;vd_source=8adc070117854dc6967b17bf3379321b">【中级篇】Part5_图片显示指令操作</a></p>