图片透明原理

半透明原理：

假设LCD是256色的。颜色格式为332（RGB）

显存中的每一个字节的数据对应一个象素点。

在数据写入显存之前，读取相应相素点值，然后与新的数据按一定的规则混合之后，再写入相应像素点的显存。

这样主要问题关键是混合算法。

混合算法目前在游戏上常用到的算法是AlphaBlend。计算公式如下

假设一幅图象是A，另一幅透明的图象是B，那么透过B去看A，看上去的图象C就是B和A的混合图象，设B图象的透明度为alpha(取值为0-1，1为完全透明，0为完全不透明)，Alpha混合公式如下：

R(C)=(1-alpha)*R(B)+alpha*R(A)

G(C)=(1-alpha)*G(B)+alpha*G(A)

B(C)=(1-alpha)*B(B)+alpha*B(A)

R(x)、G(x)、B(x)分别指颜色x的RGB分量原色值。从上面的公式可以知道，Alpha其实是一个决定混合透明度的数值。应用Alpha混合技术，可以实现游戏中的许多特效，比如火光、烟雾、阴影、动态光源等半透明效果。

uC/GUI系统分为好几个层面。简单地可以归结为：

1、硬件驱动层

2、基本2D图形库

3、窗体

层次越高，涉及的内容越多，修改的工作量就越大。 如果想修改最少的代码实现半透明功能，最好在硬件驱动层找切入口。

在硬件驱动层中有个宏定义 LCD_WRITE_MEM(Off,data)

*((U8*)(DC+(((U32)(Off)))))=（data），从文档可以看到该宏定义的功能就是向显存写入像素点的值。

流程如下：

a、读取相应象素点值

b、与新的象素点值按照混合算法转换。

c、将转换结果写入显存对应位置。

/设置透明度为0，完全不透明，先执行清屏。

GUI_SetBkColor(GUI_WHITE);

GUI_SetColor(GUI_WHITE);

GUI_Clear();

/填充一个方框

GUI_SetColor(GUI_RED);

GUI_FillRect(0,0,80,30);

*****这里设置透明度为80透明之后再执行

GUI_SetColor(GUI_GREEN);

GUI_FillRect(50,5,200,30);

GUI_CONTEXT

typedef struct {

/* Variables in LCD module */

LCD_COLORINDEX_UNION LCD;

LCD_RECT ClipRect;

U8 DrawMode;

U8 SelLayer;

U8 TextStyle;

U8 TransPara;

/* Variables in GL module */

GUI_RECT* pClipRect_HL; /* High level clip rectangle ... Speed optimization so drawing routines can optimize */

U8 PenSize;

U8 PenShape;

U8 LineStyle;

U8 FillStyle;

/* Variables in GUICHAR module */

const GUI_FONT GUI_UNI_PTR * pAFont;

const GUI_UC_ENC_APILIST * pUC_API; /* Unicode encoding API */

I16P LBorder;

I16P DispPosX, DispPosY;

I16P DrawPosX, DrawPosY;

I16P TextMode, TextAlign;

GUI_COLOR Color, BkColor; /* Required only when changing devices and for speed opt (caching) */

/* Variables in WM module */

#if GUI_WINSUPPORT

const GUI_RECT* WM__pUserClipRect;

GUI_HWIN hAWin;

int xOff, yOff;

#endif

/* Variables in MEMDEV module (with memory devices only) */

#if GUI_SUPPORT_DEVICES

const tLCDDEV_APIList* pDeviceAPI; /* function pointers only */

GUI_HMEM hDevData;

GUI_RECT ClipRectPrev;

#endif

/* Variables in Anitaliasing module */

#if GUI_SUPPORT_AA

const tLCD_HL_APIList* pLCD_HL; /* Required to reroute drawing (HLine & Pixel) to the AA module */

U8 AA_Factor;

U8 AA_HiResEnable;

#endif

} GUI_CONTEXT; 包含了整个系统作图的最基本信息。而且这个结构体所声明的变量GUI_Context也是硬件作图层(硬件驱动层)所唯一依赖的变量。

在结构体中发现，需要增加透明度信息。

于是在结构体中增加一条：U8 BlendPara;/混合算法参数Alpha;

现在来一个情景分析。

1、在画图前设置该变量值。0---100之间。

2、在LCD_WRITE_MEM时使用它。这样半透明和透明效果就都实现了。

用2D图形库作图测试确实能实现半透明效果。

再测试窗体时你会发现一个问题。在基于WM_Window的所有控件上使作半透明效果会出现问题：

在反复刷新（即反复产生WM_PAINT）消息时，该窗体的颜色一直在变量，而且由浅及深或由深及浅反复变化

实现AlphaBlend混合的代码.

主要的算法是:

r = (BYTE)((((rForeground - rBackground)*delta) >> ALPHA) + rBackground);

g = (BYTE)((((gForeground - gBackground)*delta) >> ALPHA) + gBackground);

b = (BYTE)((((bForeground - bBackground)*delta) >> ALPHA) + bBackground);

下面是具体实现。(代码可成功运行)

// 一共2^8 + 1个等级，0为透明，256为不透明，中间的值为半透明

#define ALPHA 8

#define FRAMEPENWIDTH 2 // 文本框的宽度

#define FRAMECOLOR RGB(192,192,192) // 文本框的颜色

#define SHADOWWIDTH 1 // 阴影的宽度（为了有立体感）

#define SHADOWCOLOR RGB(0,0,0) // 阴影的颜色

#define TEXTCOLOR RGB(0,0,192) // 文本的颜色

// 文本框的宽度缺省100像素，宽度、高度可以动态调整

#define DEFAULTOUTPUTWIDTH 100

VOID ShowTransparentText(

HWND hDstWnd, // 在那个窗口透明显示

DWORD Alpha, // Alpha通道值(0 < Alpha < 256)

COLORREF crForeground, // 文本框底色

LPCTSTR lpszTxt, // 文本

DWORD dwDelayTime // 显示多长时间

)

{

COLORREF crBackground;

BYTE r, g, b;

BYTE rBackground, gBackground, bBackground;

BYTE rForeground, gForeground, bForeground;

INT x, y;

INT nDstPosX, nDstPosY;

INT nWidth, nHeight;

HDC hWorkDC, hSaveDC, hDstDC;

HANDLE hBitmap, hBitmap2;

HFONT hf, hfSave;

LOGFONT lf;

RECT rect;

DWORD delta;

//创建文本框字体

lf.lfHeight = 14;

lf.lfWidth = 0;

lf.lfEscapement = 0;

lf.lfOrientation = 0;

lf.lfWeight = FW_NORMAL; //FW_BOLD

lf.lfItalic = FALSE;

lf.lfUnderline = FALSE;

lf.lfStrikeOut = 0;

lf.lfCharSet = ANSI_CHARSET;

lf.lfOutPrecision = OUT_DEFAULT_PRECIS;

lf.lfClipPrecision = CLIP_DEFAULT_PRECIS;

lf.lfQuality = DEFAULT_QUALITY;

lf.lfPitchAndFamily = DEFAULT_PITCH | FF_SWISS;

_tcscpy(lf.lfFaceName, TEXT(\"Tahoma\"));

VERIFY(hf = CreateFontIndirect(&lf));

hDstDC = GetDC(hDstWnd);

hWorkDC = CreateCompatibleDC(hDstDC);

hfSave = (HFONT)SelectObject(hWorkDC, hf);

nWidth = DEFAULTOUTPUTWIDTH;

nHeight = DEFAULTOUTPUTWIDTH;

SetRect(&rect, 0,0,nWidth,nHeight);

DrawText(hWorkDC, lpszTxt, lstrlen(lpszTxt), &rect,

DT_CALCRECT|DT_LEFT|DT_WORDBREAK);

// 自画立体边框

nWidth = rect.right - rect.left + (FRAMEPENWIDTH + SHADOWWIDTH) * 2;

nHeight = rect.bottom - rect.top + (FRAMEPENWIDTH + SHADOWWIDTH) * 2;

hBitmap = CreateCompatibleBitmap(hDstDC, nWidth, nHeight);

SelectObject(hWorkDC, hBitmap);

hSaveDC = CreateCompatibleDC(hDstDC);

hBitmap2 = CreateCompatibleBitmap(hDstDC, nWidth, nHeight);

SelectObject(hSaveDC, hBitmap2);

GetClientRect(hDstWnd, &rect);

nDstPosX = rect.left + (rect.right - rect.left - nWidth)/2;

nDstPosY = rect.top + (rect.bottom - rect.top - nHeight)/2;

BitBlt(hWorkDC, 0, 0, nWidth, nHeight, hDstDC, nDstPosX, nDstPosY, SRCCOPY);

BitBlt(hSaveDC, 0, 0, nWidth, nHeight, hDstDC, nDstPosX, nDstPosY, SRCCOPY);

delta = Alpha%(1<// 因为0 ， 256 对256取模都为0， 但是0为透明，256为不透明

if((0 == delta) && (Alpha == (1<{

delta = Alpha;

}

rForeground = GetRValue(crForeground);

gForeground = GetGValue(crForeground);

bForeground = GetBValue(crForeground);

for(y = SHADOWWIDTH + SHADOWWIDTH; y< (nHeight - (SHADOWWIDTH + SHADOWWIDTH)); y++)

{

for(x = SHADOWWIDTH + SHADOWWIDTH; x < (nWidth - (SHADOWWIDTH + SHADOWWIDTH)); x++)

{

crBackground = GetPixel(hWorkDC, x, y);

rBackground = GetRValue(crBackground);

gBackground = GetGValue(crBackground);

bBackground = GetBValue(crBackground);

r = (BYTE)((((rForeground - rBackground)*delta) >> ALPHA) + rBackground);

g = (BYTE)((((gForeground - gBackground)*delta) >> ALPHA) + gBackground);

b = (BYTE)((((bForeground - bBackground)*delta) >> ALPHA) + bBackground);

SetPixel(hWorkDC, x, y, RGB(r,g,b));

}

}

// 由于Smartphone不提供FrameRect函数，所以自行实现该功能。

// 画出外框

for(y = 0; y< FRAMEPENWIDTH; y++)

{

for(x = 0; x < nWidth; x++)

{

SetPixel(hWorkDC, x, y, FRAMECOLOR);

SetPixel(hWorkDC, x, nHeight - y - 1, FRAMECOLOR);

}

}

for(x = 0; x< FRAMEPENWIDTH; x++)

{

for(y = 0; y < nHeight; y++)

{

SetPixel(hWorkDC, x, y, FRAMECOLOR);

SetPixel(hWorkDC, nWidth - x -1, y, FRAMECOLOR);

}

}

// 画出阴影框

for(y = FRAMEPENWIDTH; y< (FRAMEPENWIDTH+SHADOWWIDTH); y++)

{

for(x = FRAMEPENWIDTH; x < (nWidth - FRAMEPENWIDTH); x++)

{

SetPixel(hWorkDC, x, y, SHADOWCOLOR);

SetPixel(hWorkDC, x, nHeight - y - 1, SHADOWCOLOR);

}

}

for(x = FRAMEPENWIDTH; x< (FRAMEPENWIDTH+SHADOWWIDTH); x++)

{

for(y = FRAMEPENWIDTH; y < (nHeight - FRAMEPENWIDTH); y++)

{

SetPixel(hWorkDC, x, y, SHADOWCOLOR);

SetPixel(hWorkDC, nWidth - x -1, y, SHADOWCOLOR);

}

}

// 输出透明字

SetRect(&rect,

(FRAMEPENWIDTH+SHADOWWIDTH), (FRAMEPENWIDTH+SHADOWWIDTH), (FRAMEPENWIDTH+SHADOWWIDTH));

(FRAMEPENWIDTH+SHADOWWIDTH),

nWidth nHeight

- -

SetBkMode(hWorkDC, TRANSPARENT);

SetTextColor(hWorkDC, TEXTCOLOR);

DrawText(hWorkDC, lpszTxt, lstrlen(lpszTxt), &rect, DT_LEFT|DT_WORDBREAK);

BitBlt(hDstDC, nDstPosX, nDstPosY, nWidth, nHeight, hWorkDC, 0, 0, SRCCOPY);

DeleteObject(SelectObject(hWorkDC, hfSave));

DeleteObject(hBitmap);

DeleteDC(hWorkDC);

// 延迟制定时间，最好用WaitForSingleObject, 这样用户既可以终止等待，SetEvent即可

// 或者超时，即相当于Sleep功能

Sleep(dwDelayTime);

// 恢复原来的背景

BitBlt(hDstDC, nDstPosX, nDstPosY, nWidth, nHeight, hSaveDC, 0, 0, SRCCOPY);

DeleteObject(hBitmap2);

DeleteDC(hSaveDC);

ReleaseDC(hDstWnd, hDstDC);

}

//wince半透明效果的实现

使用windows ce（5.0以上的版本）的一个api AlphaBlend，用法和BitBlt差不多：

BLENDFUNCTION bf;

bf.AlphaFormat=0;

bf.BlendFlags=0;

bf.BlendOp=AC_SRC_OVER;

bf.SourceConstantAlpha=100;//透明度0-255

AlphaBlend(hBackDC,0,70,73,20,hMaskDC,0,0,73,20,bf);

可以在WindowsCE里用

#include

//还要在Project -- setting -- link 里连接上msimg32.lib

////VC用AlphaBlend实现半透明位图

Requirements:

Windows NT/2000/XP: Included in Windows 2000 and later.

Windows 95/98/Me: Included in Windows 98 and later.

Header: Declared in Wingdi.h; include Windows.h.

Library: Included as a resource in Msimg32.dll.

示例:

1. void CTestDlg::SaveBitmap(CDC* pDC,CRect rect,CString filename)

2. {

3. CDC* memDC=new CDC;

4. memDC->CreateCompatibleDC(pDC);

5. CBitmap* bmp=new CBitmap;

6. bmp->CreateCompatibleBitmap(pDC,rect.Width(),rect.Height());

7. CBitmap* oldbitmap=memDC->SelectObject(bmp);

8. //此时的bmp就相当于一张桌布，在memDC中画线etc都是画在这张桌布上

9. if(!memDC->BitBlt(0,0,rect.Width(),rect.Height(),pDC,0,0,SRCCOPY))

10. {

11. AfxMessageBox(\"BitBlt Error!\");

12. return;

13. }

14. memDC->Ellipse(0,0,100,100);

15. memDC->SelectObject(oldbitmap);

16. BITMAPINFO bi;

17. bi.bmiHeader.biSize=sizeof(bi.bmiHeader);

18. bi.bmiHeader.biWidth=rect.Width();

19. 20. 21. 22. 23. 24. 25. 26. 27. 28. 29. 30. ORS);

31.

bi.bmiHeader.biHeight=rect.Height();

bi.bmiHeader.biPlanes=1;

bi.bmiHeader.biBitCount=16;

bi.bmiHeader.biCompression=BI_RGB;

bi.bmiHeader.biSizeImage=0;

bi.bmiHeader.biXPelsPerMeter=0;

bi.bmiHeader.biYPelsPerMeter=0;

bi.bmiHeader.biClrUsed=0;

bi.bmiHeader.biClrImportant=0;

int bitsize=rect.Width()*rect.Height()*2;

BYTE* bits=new BYTE[bitsize];

::GetDIBits(memDC->m_hDC,*bmp,0,rect.Height(),bits,&bi,DIB_RGB_COLBITMAPFILEHEADER bf;

32. bf.bfType=(int)'M'*256+'B';

33. bf.bfSize=bitsize;//sizeof(bf);

34. bf.bfOffBits=sizeof(bi.bmiHeader)+sizeof(bf);

35. bf.bfReserved1=0;

36. bf.bfReserved2=0;

37. CFile f(filename,CFile::modeCreate|CFile::modeWrite);

38. f.Write(&bf,sizeof(bf));//注意是先写bf,再写bi

39. f.Write(&bi,sizeof(bi));

40. f.Write(bits,bitsize);

41. f.Close();

42. delete[] bits;

43. delete bmp;

44. delete memDC;

45. }

将memDC上的位图半透明覆盖到pDC上

1. BLENDFUNCTION bm;

2. bm.BlendOp=AC_SRC_OVER;

3. bm.BlendFlags=0;

4. bm.SourceConstantAlpha=100;

5. bm.AlphaFormat=0;

6. AlphaBlend(pDC->m_hDC,0,0,rect.Width(),rect.Height(),memDC->m_hDC,0,0,rect.Width(),rect.Height(),bm);