The following article will tell you how to make a timeline control step by step in S60.
The keywords of artile: window, custom control, time, periodic.
Frist, you need reffer to tow articles
I.Symbian OS: Creating Custom Controls
you can download here>>
II.Periodic timer active object.
Developer Library >> API Reference >> C++ API reference >> Timers and Timing Services >> CPeriodic
1. Class Declaration:
Code:
class CMyTimerContainer : public CCoeControl
{
public:
void ConstructL(TInt aSecond ,TPoint aPoint, TSize aSize); // Initialize Seconds, Position, Size Of Timeline Control
~CMyTimerContainer();
void Draw(const TRect& aRect) const;
static TInt Start__(TAny* aObject);
void Start_();
private: //data
CPeriodic* iPeriodic;
TInt iLeft; //Left times
TInt iTotal;//Total times
TPoint iPoint; //control position,
TSize iSize; //Control size
}
{
public:
void ConstructL(TInt aSecond ,TPoint aPoint, TSize aSize); // Initialize Seconds, Position, Size Of Timeline Control
~CMyTimerContainer();
void Draw(const TRect& aRect) const;
static TInt Start__(TAny* aObject);
void Start_();
private: //data
CPeriodic* iPeriodic;
TInt iLeft; //Left times
TInt iTotal;//Total times
TPoint iPoint; //control position,
TSize iSize; //Control size
}
2. Periodic Functions:
Code:
TInt CMyTimerContainer::Start__(TAny* aObject)
{
((CMyTimerContainer*)aObject)->Start_(); // cast, and call non-static function
return 1;
}
void CMyTimerContainer::Start_()
{
iLeft--;
if(iLeft==0)
{
DrawNow();
iPeriodic->Cancel();
return;
}
DrawNow();
}
{
((CMyTimerContainer*)aObject)->Start_(); // cast, and call non-static function
return 1;
}
void CMyTimerContainer::Start_()
{
iLeft--;
if(iLeft==0)
{
DrawNow();
iPeriodic->Cancel();
return;
}
DrawNow();
}
3. Draw Funciton
Code:
Code:
void CMyTimerContainer::Draw(const TRect& aRect) const
{
CWindowGc& gc = SystemGc();
/*Draw BackGround*************************/
gc.SetBrushColor( KRgbBlack );
gc.SetBrushStyle( CGraphicsContext::ESolidBrush );
gc.DrawRect(aRect);
/*Drar Timeline*************************/
gc.SetBrushStyle( CGraphicsContext::ESolidBrush );
gc.SetBrushColor( KRgbRed );
gc.SetPenStyle( CGraphicsContext::ENullPen );
gc.DrawRect( TRect(TSize(iLeft*Size().iWidth/iTotal,iSize.iHeight)) );
}
{
CWindowGc& gc = SystemGc();
/*Draw BackGround*************************/
gc.SetBrushColor( KRgbBlack );
gc.SetBrushStyle( CGraphicsContext::ESolidBrush );
gc.DrawRect(aRect);
/*Drar Timeline*************************/
gc.SetBrushStyle( CGraphicsContext::ESolidBrush );
gc.SetBrushColor( KRgbRed );
gc.SetPenStyle( CGraphicsContext::ENullPen );
gc.DrawRect( TRect(TSize(iLeft*Size().iWidth/iTotal,iSize.iHeight)) );
}
4. Construct Function
Code:
void CMyTimerContainer::ConstructL(TInt aSecond ,TPoint aPoint, TSize aSize)
{
CreateWindowL();
iTotal = aSecond;
iLeft = iTotal;
iPoint = aPoint;
iSize = aSize;
iPeriodic = CPeriodic::NewL(CActive::EPriorityIdle);
iPeriodic->Start(0/*8000000*/, 1000000/*35714*/, TCallBack(Start__, this));
SetExtent(aPoint,aSize);
ActivateL();
}
{
CreateWindowL();
iTotal = aSecond;
iLeft = iTotal;
iPoint = aPoint;
iSize = aSize;
iPeriodic = CPeriodic::NewL(CActive::EPriorityIdle);
iPeriodic->Start(0/*8000000*/, 1000000/*35714*/, TCallBack(Start__, this));
SetExtent(aPoint,aSize);
ActivateL();
}
5. How To Use The Timeline Custom Control
Code:
a.Add Custom Control in XXXContainer.h
private: //data
CMyTimerContainer* iTimer;
b,Initialize Seconds, Position, Size Of Timeline Control
void CXXXXContainer::ConstructL(const TRect& aRect)
{
CreateWindowL();
iTimer = new (ELeave) CMyTimerContainer;
iTimer->ConstructL( 60/*init seconds*/,TPoint(0,100),TSize(176,15),this);
SetRect(aRect);
ActivateL();
}
private: //data
CMyTimerContainer* iTimer;
b,Initialize Seconds, Position, Size Of Timeline Control
void CXXXXContainer::ConstructL(const TRect& aRect)
{
CreateWindowL();
iTimer = new (ELeave) CMyTimerContainer;
iTimer->ConstructL( 60/*init seconds*/,TPoint(0,100),TSize(176,15),this);
SetRect(aRect);
ActivateL();
}
You can reffer to the codes of article to modify your codes. Welcome to comment here.
Download Source Codes>>
Download Source Codes>>
English Version: http://www.symbianer.com/post/custom-control-timeline-en.html
Chinese Version: http://www.symbianer.com/post/custom-control-timeline.html
Mail: N-office@163.com
Website: http://www.symbianer.com
If you like this post then please consider subscribing to my full feed RSS. You can also subscribe by Email and have new posts sent directly to your inbox.
