第11章 BMP图片显示

第一步：先用位图软件直接打开PNG格式的图标，打开后的效果如下：
    对于带透明色的PNG图片，用位图转换器打开后是这种效果的，转换成C文件后显示出来是不正确的，得用软件IconWorkshop进行转换。

第二步：用软件IconWorkshop打开这个图标，打开后的效果如下：
然后将其另存为BMP格式的图片

第三步：再次用位图转换器打开上面转换好的BMP图片，打开后效果如下：
    打开是这种效果，转换后的C文件才能正常的显示。

第四步：将上面的图片另存为C文件方法如下：

点击另存为C文件后会出现如下的界面：
    这里我们就选择第一个True color alpha chanel进行保存。点击OK后会生成C文件。生成的C文件保存在了这个图片所在的文件夹里面（注意是大家加载的这个BMP图片文件夹，不是位图软件文件夹）。

下面我们在emWin5.24模拟器上面显示一下我们刚才转换好的图标。
    实际运行代码如下（图片数据就不贴出来了，看本期教程配套的例子）
复制代码
GUI_CONST_STORAGE GUI_BITMAP bm20140406102510816_easyicon_net_96 = {
  96, // xSize
  96, // ySize
  384, // BytesPerLine
  32, // BitsPerPixel
  (unsigned char *)_ac20140406102510816_easyicon_net_96,  // Pointer to picture data
  NULL,  // Pointer to palette
  GUI_DRAW_BMP8888
};
void MainTask(void)
{  
    GUI_Init();
    GUI_DrawBitmap(&bm20140406102510816_easyicon_net_96, 30, 30);
    while(1)
    {
        GUI_Delay(100);
    }
}

实际显示效果如下：

11.1.2      BMP格式图标转换
    下面我们讲解一下BMP格式的位图转换。
l  第一步：比如我们要转如下所示的BMP图片。

第二步：这里我们做一次图片的格式转换，转换格式如下：

第三步：转换后，另存为C文件的格式如下：
     转换后生成的C文件和图片在同一个文件夹里面。下面我们在emWin5.24模拟器上面显示下这个图片

下面是模拟器上面实际运行的代码（图片数据没有贴，全部运行代码请看本期教程配套的例子）
复制代码
GUI_CONST_STORAGE GUI_BITMAP bm1 = {
  480, // xSize
  272, // ySize
  960, // BytesPerLine
  16, // BitsPerPixel
  (unsigned char *)_ac1,  // Pointer to picture data
  NULL,  // Pointer to palette
  GUI_DRAW_BMP444_12
};
void MainTask(void)
{  
    GUI_Init();
    GUI_DrawBitmap(&bm1, 30, 30);
    while(1)
    {
        GUI_Delay(100);
    }
}

下面是实际显示效果：
    讲完这两个例子以后，大家应该对位图转换器的使用有所了解了。下面开始讲直接的显示BMP格式的图片。STemWin支持的API函数如下：

11.2  绘制已经加载到存储器的BMP图片
    将图片加载到存储器后进行显示比较的耗内存，所以这里就使用开发板外置的2MB SRAM做STemWin的动态内存空间，并通过相应的API函数申请动态内存来加载SD卡等外部存储器中的BMP图片。申请和释放STemWin动态内存的方法如下：
[url=]复制代码[/url]

• /* 申请一块内存空间 并且将其清零 */
• hMem = GUI_ALLOC_AllocZero(100000);
• /* 将申请到内存的句柄转换成指针类型 */
• _acBuffer2 = GUI_ALLOC_h2p(hMem);
• /* 释放申请的动态内存  */
• GUI_ALLOC_Free(hMem);
  

    比如我们要显示下面的BMP格式的图片：
    就可以把这个图片放到SD卡中，然后通过程序把这个图片数据全部的加载到SRAM中，最后在屏上进行显示。这个工程的实现主要分为如下三个部分：
Ø  SRAM和SD卡及其文件系统的初始化
Ø  图片的加载以及显示函数
Ø  主函数

本帖最后由 lee_st 于 2016-10-13 08:10 编辑

11.2  绘制已经加载到存储器的BMP图片
    将图片加载到存储器后进行显示比较的耗内存，所以这里就使用开发板外置的2MB SRAM做STemWin的动态内存空间，并通过相应的API函数申请动态内存来加载SD卡等外部存储器中的BMP图片。申请和释放STemWin动态内存的方法如下：
复制代码
/* 申请一块内存空间 并且将其清零 */
hMem = GUI_ALLOC_AllocZero(100000);
/* 将申请到内存的句柄转换成指针类型 */
_acBuffer2 = GUI_ALLOC_h2p(hMem);
/* 释放申请的动态内存  */
GUI_ALLOC_Free(hMem);

        比如我们要显示下面的BMP格式的图片：
    就可以把这个图片放到SD卡中，然后通过程序把这个图片数据全部的加载到SRAM中，最后在屏上进行显示。这个工程的实现主要分为如下三个部分：
Ø  SRAM和SD卡及其文件系统的初始化
Ø  图片的加载以及显示函数
Ø  主函数

1.     初始化SRAM，主要是FSMC的配置
2.     初始化文件系统FatFS，用于外接SD卡的读写操作。
l  图片的加载以及显示函数
复制代码
/*
*********************************************************************************************************
*    函 数 名: _ShowBMP
*    功能说明: 显示BMP图片
*    形    参：sFilename 要显示的图片名字
*    返 回 值: 无
*********************************************************************************************************
*/
static void _ShowBMP(const char * sFilename)
{
     int XSize, YSize;
     GUI_HMEM hMem;
     char *_acBuffer2;
     int i;
     /* 申请一块内存空间 并且将其清零 */
    hMem = GUI_ALLOC_AllocZero(1024*1024);（1）
     /* 将申请到内存的句柄转换成指针类型 */
     _acBuffer2 = GUI_ALLOC_h2p(hMem);
   
     /* 打开文件 */        
     result = f_open(&file, sFilename, FA_OPEN_EXISTING | FA_READ | FA_OPEN_ALWAYS);（2）
     if (result != FR_OK)
     {
         return;
     }
   
     result = f_read(&file, _acBuffer2, file.fsize, &bw);（3）
     if (result != FR_OK)
     {
         return;
     }
     XSize = GUI_BMP_GetXSize(_acBuffer2);（4）
     YSize = GUI_BMP_GetYSize(_acBuffer2);
     while(1)
     {
         for(i = 100; i < 600; i += 10)
         {
              GUI_BMP_DrawScaled(_acBuffer2, （5）
                                    (LCD_GetXSize() - XSize*i/100)/2,
                                    (LCD_GetYSize() - YSize*i/100)/2,
                                    i,
                                    100);
              GUI_Delay(100);  
         }
         GUI_Clear();         
     }
//   GUI_ALLOC_Free(hMem);（6）
//   f_close(&file);
}

1.     申请1MB的动态内存。并将申请到内存的句柄转换为指针类型。
2.     打开相应的BMP文件。
3.     读取BMP文件数据，并将数据全部存储到申请的动态内存里面。
4.     函数GUI_BMP_GetXSize()和GUI_BMP_GetYSize()用于返回BMP图片的大小。
5.     函数GUI_BMP_DrawScaled主要用于实现图片的放缩操作。这里是将图片显示到屏的正中。
6.     释放申请的动态内存，申请的动态内存一定要记得释放。
l  主函数
复制代码
/*
*********************************************************************************************************
*    函 数 名: MainTask
*    功能说明: GUI主函数
*    形    参：无
*    返 回 值: 无
*********************************************************************************************************
*/
void MainTask(void)
{  
     GUI_Init();
     /* 设置皮肤函数 */                                                                               （1）
     PROGBAR_SetDefaultSkin(PROGBAR_SKIN_FLEX);
     FRAMEWIN_SetDefaultSkin(FRAMEWIN_SKIN_FLEX);
     PROGBAR_SetDefaultSkin(PROGBAR_SKIN_FLEX);
     BUTTON_SetDefaultSkin(BUTTON_SKIN_FLEX);
     CHECKBOX_SetDefaultSkin(CHECKBOX_SKIN_FLEX);
     DROPDOWN_SetDefaultSkin(DROPDOWN_SKIN_FLEX);
     SCROLLBAR_SetDefaultSkin(SCROLLBAR_SKIN_FLEX);
     SLIDER_SetDefaultSkin(SLIDER_SKIN_FLEX);
     HEADER_SetDefaultSkin(HEADER_SKIN_FLEX);
     RADIO_SetDefaultSkin(RADIO_SKIN_FLEX);
     while(1) （2）
     {               
         _ShowBMP("1.bmp");
     }
}

这个好像还没有完全分享呀  期待当中

是的，，，，，，，，，，，，

1.     这里是开启皮肤色。
2.     在主程序中调用图片显示即可。
    实际显示效果如下：
    第一幅是原始图片：