You Are Here:

Community: Blogs

Li Yongfei's Forum Nokia Blog

Making TimeLine Control

cool_li | 20 July, 2006 10:44

The timelnie in puzzle games, lifetime in fighting games, that is a very normol element.
The following article will tell you how to make a timeline control step by step in S60.

Author Website: http://www.symbianer.com

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
}
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();
}
3. Draw Funciton
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)) );
    }

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();
    }

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();
    }
You can reffer to the codes of article to modify your codes. Welcome to comment  here.
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

RSSComments

You must login to post comments. Login
 

Rate This

 
 
Bookmark this page: DeliciousDiggFacebookGoogleYahooStumbleUponRedditDiigoTechnocratiTwitter  Share this page Share this page Print this Page Print this page Invite a friend Invite a friend
京ICP备05048969号    Email Newsletters Press Terms & Conditions Privacy Policy Sitemap Contact Us © 2009 Nokia 
RDF Facets: qdcZidentifierQSxhttpE3aE2fE2fblogsE2eforumE2enokiaE2ecomhttpE3aE2fE2fblogsE2eforumE2enokiaE2ecomE2findeE78E2ephpE3fopE3dViewArticleE26blogIdE3d10294E26articleIdE3d133X qdcZtypeQUqfnZE45E78cludedFromGeneralE4cistingsQ qdcZtypeQUqfntypeZBlogContentQ qdcZtypeQUqfntypeZBlogE45ntryQ qdcZtypeQUqfntypeZCommunityContentQ qdcZtypeQUqfntypeZE52esourceQ qdcZtypeQUqfntypeZWebpageQ qdcZtypeQUqmarsZManagedE52esourceQ qdcZtypeQUqwebZInformationE52esourceQ qdcZtypeQUqwebZPageQ qdcZtypeQUqwebZE52esourceQ qdcZtypeQUqrdfsZE52esourceQ qfnZtopicQUqfnTopicZcppQ qfnZtopicQUqfnTopicZentertainmentQ qfnZtopicQUqfnTopicZgamesQ qfnZtopicQUqfnTopicZseriesE5f60Q qfnZtypeQUqfntypeZBlogContentQ qfnZtypeQUqfntypeZBlogE45ntryQ qfnZtypeQUqfntypeZCommunityContentQ qfnZtypeQUqfntypeZE52esourceQ qfnZtypeQUqfntypeZWebpageQ qfnZuserE5ftagQSxs60X qfnZuserE5ftagQSxsymbianE2dcE2bE2bX qmarsZlanguageQUxhttpE3aE2fE2fswE2enokiaE2ecomE2flanguageE2d1E2fenX qrdfZtypeQUqfnZE45E78cludedFromGeneralE4cistingsQ qrdfZtypeQUqfntypeZBlogContentQ qrdfZtypeQUqfntypeZBlogE45ntryQ qrdfZtypeQUqfntypeZCommunityContentQ qrdfZtypeQUqfntypeZE52esourceQ qrdfZtypeQUqfntypeZWebpageQ qrdfZtypeQUqmarsZManagedE52esourceQ qrdfZtypeQUqwebZInformationE52esourceQ qrdfZtypeQUqwebZPageQ qrdfZtypeQUqwebZE52esourceQ qrdfZtypeQUqrdfsZE52esourceQ