在BREW中打造自己的GUI(7)-动态效果的实现

今天讨论关于GUI的另一个话题:如何在两个界面切换中表现出比较炫一点的效果,比如渐变、缩放等等。同样我们还是用组件的方式来做。IGSlider,负责管理两个IControl切换的动态效果,它的使用比较简单:
static   void  loadMenu(DisplayFavt  *  pMe,uint16 wParam)
{
    TItemData    
*pData;
    IControl 
* p1,*p2;
    uint16 style;

    pData
=NULL;

       
//加载第一个IControl,即起始界面
    if(pMe->pCurrentTabOpt && pMe->pCurrentTabOpt->pMenu)
    
{
        ICONTROL_SetActive(pMe
->pCurrentTabOpt->pMenu,FALSE);
        p1
=pMe->pCurrentTabOpt->pMenu;
    }


    
//得到第二个IControl,即结束界面
    pMe->currentTab=IGTABPANECTL_GetSel(pMe->pApp->pMenuTab);
    MainItemQueue_FindById(pMe
->pApp->pTabList,pMe->currentTab,&pData);
    
if(pData==NULL)
        
return;

    IGTABPANECTL_GetItemData(pMe
->pApp->pMenuTab,pMe->currentTab,(uint32*)&pMe->pCurrentTabOpt);

    p2
=pMe->pCurrentTabOpt->pMenu;

        
//设置切换效果的风格
    
//style =(wParam==0)?0:((wParam==AVK_LEFT)?SLIDER_STYLE_RTOL:SLIDER_STYLE_LTOR);
    style=(wParam==0)?0:SLIDER_STYLE_DTOB;

    
if(p1 && p2 && style!=0)
    
{
        AEERect rec;
        SET_CTL_RECT(
&rec);
                
//两个界面应该同样大小
        IGSLIDER_SetRect(pMe->pApp->pSlider,&rec);
                
//将两个界面IControl加入IGSlider
        if(IGSLIDER_AddControls(pMe->pApp->pSlider,p1,p2))
        
{
                        
//初始化,设置回调、风格、动态效果显示时长
            IGSLIDER_Init(pMe->pApp->pSlider,style,3,(PFNNOTIFY)loadMenuDone,(void*)pMe);
                        
//启动
            IGSLIDER_Start(pMe->pApp->pSlider);
            
return;
        }

    }


    
{
        ICONTROL_SetActive((IControl
*)pMe->pCurrentTabOpt->pMenu,TRUE);
        ICONTROL_Redraw(pMe
->pCurrentTabOpt->pMenu);
        pMe
->pApp->state=STATE_COMMAND;
    }


}

原理比较简单:
1、我们要将两个 IControl绘入两个IBitmap中,然后才能进行各种图像操作(渐变、淡化、缩放等)。
2、用一个定时器来控制这个切换时的效果显示。
3、需要一个回调函数,在完成切换时需要调一下它,来处理善后事项。

先看看这个组件包含的成员,如上所述,除了两个ICotrol和两个IBitmap以外,还要那个回调m_cbDone、风格m_style、时间控制m_delay等等。
struct  _IGSlider  {
    
    
const AEEVTBL(IGSlider) * pvt;

    uint32          m_nRefs;    
    IShell            
*m_pIShell;
    IDisplay        
*m_pIDisplay;
    IModule            
*m_pIModule;

    IControl        
*m_pFirst;
    IControl        
*m_pSecond;

    
int                m_delay;
    
int                m_style;

    boolean            m_isActive;

    PFNNOTIFY        m_cbDone;
    
void           *m_pNotifyData;
    AEERect            m_Rect;

    IBitmap            
*pFirst;
    IBitmap            
*pSecond;
    
int                tick;
    uint8            flag;

    IBitmap            
*pTemp;

}
;

然后需要声明的接口函数包括以下几个:
AEEINTERFACE(IGSlider)
{
    DECLARE_IBASE(IGSlider)    

    boolean     (
*Redraw)       (IGSlider * po);
    
void        (*SetRect)      (IGSlider * po, const AEERect *);

    boolean        (
*AddControls)  (IGSlider * po, IControl * p1,IControl * p2);
    boolean        (
*AddControlsD) (IGSlider * po, IControl * p1,IControl * p2);
    boolean        (
*AddControlFrom)    (IGSlider * po,IControl * p1);
    boolean        (
*AddControlTo)        (IGSlider * po,IControl * p2);
    boolean        (
*AddControlFromBitmap)    (IGSlider * po,IBitmap * p1);
    boolean        (
*AddControlToBitmap)        (IGSlider * po,IBitmap * p2);

    IBitmap
*        (*GetBitmapFirst)        (IGSlider * po);
    IBitmap
*        (*GetBitmapSecond)        (IGSlider * po);
    
    boolean        (
*IsActive)        (IGSlider * po);
    
void        (*Init)            (IGSlider * po, uint16 style,uint32 delay,PFNNOTIFY cbDone,void * pUser);
    
void        (*Start)        (IGSlider * po);
    
void        (*Stop)            (IGSlider * po);
    
}
;

实现方面主要是这个addControls函数,在加入两个ICotrol同时,将它绘制到IBitmap上去。
static  boolean IGSlider_AddControls(IGSlider  *  pMe,IControl  *  p1,IControl  *  p2)
{

    AEERect        r;

    
if(SUCCESS!=IDISPLAY_SetDestination(pMe->m_pIDisplay,pMe->pFirst))
        
return FALSE;

    SETAEERECT(
&r,0,0,pMe->m_Rect.dx,pMe->m_Rect.dy);
    ICONTROL_SetRect(p1,
&r);
    ICONTROL_Redraw(p1);
    IDISPLAY_Update(pMe
->m_pIDisplay);
    ICONTROL_SetRect(p1,
&pMe->m_Rect);

    
if(SUCCESS!=IDISPLAY_SetDestination(pMe->m_pIDisplay,pMe->pSecond))
        
return FALSE;
    
    SETAEERECT(
&r,0,0,pMe->m_Rect.dx,pMe->m_Rect.dy);
    ICONTROL_SetRect(p2,
&r);
    ICONTROL_Redraw(p2);
    IDISPLAY_Update(pMe
->m_pIDisplay);
    ICONTROL_SetRect(p2,
&pMe->m_Rect);

    IDISPLAY_SetDestination(pMe
->m_pIDisplay,NULL);
    
    
return TRUE;
}

启动效果切换的工作是根据当前设置的风格调用不同的图像处理函数,还要提供一个停止函数来随时中止效果变化(其实就是Cancel掉定时器罢了)。
static   void  IGSlider_Start(IGSlider  *  pMe)
{
    pMe
->tick = 0;
    pMe
->flag=0;
    pMe
->m_isActive=TRUE;    
    
    
if(pMe->m_style==SLIDER_STYLE_RTOL)
        drawRTOL(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_LTOR)
        drawLTOR(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_DARK)
        drawDARK(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_BRIT)
        drawBRIT(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_SIZE)
        drawSize(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_GRID)
        drawGRID(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_SIZE2)
        drawSize2(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_LTORD)
        drawLTORD(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_RTOLD)
        drawRTOLD(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_BTOT)
        drawBTOT(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_TTOB)
        drawTTOB(pMe);
    
else if(pMe->m_style==SLIDER_STYLE_DTOB)
        drawDTOB(pMe);

}

static   void  IGSlider_Stop(IGSlider  *  pMe)
{
    pMe
->m_isActive=FALSE;
    ISHELL_CancelTimer(pMe
->m_pIShell,NULL,(void*)pMe);

}

各种效果的实现并不复杂,去google一下就能得到很多图像处理方法了。下面给出两个典型的处理,一是由暗变亮的实现,即第一个界面由亮变暗而第二个界面由暗变亮。
static   void  drawDTOB(IGSlider  *  pMe)
{
    ITransform    
*pTransform;
    AEEBitmapInfo inf;
    IBitmap 
*bmp;
    AEETransformMatrix matrix;
    
int x,y;

    pMe
->tick++;

    IBITMAP_SetTransparencyColor(pMe
->pFirst,MAKE_RGB(0,0,0));
    
if(pMe->flag==0)
    
{
        IBITMAP_GetInfo(pMe
->pFirst,&inf,sizeof(AEEBitmapInfo));
        
for(x=0;x<inf.cx;x++)
            
for(y=0;y<inf.cy;y++)
            
{
                NativeColor tc;
                RGBVAL ocolor,ncolor;

                IBITMAP_GetPixel(pMe
->pFirst,x,y,&tc);
                ocolor
=IBITMAP_NativeToRGB(pMe->pFirst,tc);
                ncolor 
= __transColor(pMe,ocolor,-50);
                tc
= IBITMAP_RGBToNative(pMe->pFirst,ncolor);
                IBITMAP_DrawPixel(pMe
->pFirst,x,y,tc,AEE_RO_COPY);
            }

        IDISPLAY_BitBlt(pMe
->m_pIDisplay,pMe->m_Rect.x,pMe->m_Rect.y,pMe->m_Rect.dx,pMe->m_Rect.dy,pMe->pFirst,0,0,AEE_RO_TRANSPARENT);
        IDISPLAY_Update(pMe
->m_pIDisplay);

        
if(pMe->tick<pMe->m_delay)
            ISHELL_SetTimer(pMe
->m_pIShell,5,(PFNNOTIFY)drawDTOB,(void*)pMe);
        
else
        
{
            pMe
->flag=1;
            pMe
->tick=1;            
        }

        
    }

    
    
if(pMe->flag==1)
    
{
        IBITMAP_GetInfo(pMe
->pSecond,&inf,sizeof(AEEBitmapInfo));

        
if(pMe->pTemp)
            IBITMAP_Release(pMe
->pTemp);
        IBITMAP_CreateCompatibleBitmap(pMe
->pSecond,&pMe->pTemp,inf.cx,inf.cy);

        
for(x=0;x<inf.cx;x++)
            
for(y=0;y<inf.cy;y++)
            
{
                NativeColor tc;
                RGBVAL ocolor,ncolor;

                IBITMAP_GetPixel(pMe
->pSecond,x,y,&tc);
                ocolor
=IBITMAP_NativeToRGB(pMe->pSecond,tc);
                ncolor 
= __transColor(pMe,ocolor,-50*(pMe->m_delay-pMe->tick));
                tc
= IBITMAP_RGBToNative(pMe->pSecond,ncolor);
                IBITMAP_DrawPixel(pMe
->pTemp,x,y,tc,AEE_RO_COPY);
            }

        IDISPLAY_BitBlt(pMe
->m_pIDisplay,pMe->m_Rect.x,pMe->m_Rect.y,pMe->m_Rect.dx,pMe->m_Rect.dy,pMe->pTemp,0,0,AEE_RO_TRANSPARENT);
        IDISPLAY_Update(pMe
->m_pIDisplay);

        
if(pMe->tick<pMe->m_delay)
            ISHELL_SetTimer(pMe
->m_pIShell,5,(PFNNOTIFY)drawDTOB,(void*)pMe);
        
else
        
{
            pMe
->m_isActive=FALSE;
        
            
if(pMe->m_cbDone)
                pMe
->m_cbDone(pMe->m_pNotifyData);        
        }

    }

}

还有一个上下滑动效果的实现,即第两个界面由上向下将第一个界面推出屏幕:
static   void  drawBTOT(IGSlider  *  pMe)
{
    pMe
->tick+=pMe->m_Rect.dy/pMe->m_delay;

    
if(pMe->tick<pMe->m_Rect.dy)
    
{
        IDISPLAY_BitBlt(pMe
->m_pIDisplay,pMe->m_Rect.x,pMe->m_Rect.y,pMe->m_Rect.dx,(pMe->m_Rect.dy-pMe->tick),pMe->pFirst,0,pMe->tick,AEE_RO_COPY);
        IDISPLAY_BitBlt(pMe
->m_pIDisplay,pMe->m_Rect.x,pMe->m_Rect.y+(pMe->m_Rect.dy-pMe->tick),pMe->m_Rect.dx,pMe->tick,pMe->pSecond,0,0,AEE_RO_COPY);

        IDISPLAY_Update(pMe
->m_pIDisplay);
        
if(pMe->tick<pMe->m_Rect.dy*1/3)
            ISHELL_SetTimer(pMe
->m_pIShell,10,(PFNNOTIFY)drawBTOT,(void*)pMe);
        
else if(pMe->tick<pMe->m_Rect.dy*2/3)
            ISHELL_SetTimer(pMe
->m_pIShell,50,(PFNNOTIFY)drawBTOT,(void*)pMe);
        
else
            ISHELL_SetTimer(pMe
->m_pIShell,10,(PFNNOTIFY)drawBTOT,(void*)pMe);
    }

    
else
    
{
        pMe
->m_isActive=FALSE;
        
if(pMe->m_cbDone)
            pMe
->m_cbDone(pMe->m_pNotifyData);
    }


}


评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值