×
Namespaces

Variants
Actions
(Difference between revisions)

Constructing a Symbian container control

From Nokia Developer Wiki
Jump to: navigation, search
tepaa (Talk | contribs)
lpvalente (Talk | contribs)
m (Lpvalente -)
(9 intermediate revisions by 5 users not shown)
Line 1: Line 1:
__NOTOC__
+
[[Category:Symbian C++]][[Category:UI]][[Category:Symbian]][[Category:Code Examples]][[Category:Code Snippet]][[Category:S60 3rd Edition FP1]]
__NOEDITSECTION__
+
{{ArticleMetaData <!-- v1.2 -->
{{KBCS}}
+
|sourcecode= [[Media:CustomControl.zip]]
{|style="background:#eceff2" width="660px" border="1" cellpadding="5" cellspacing="0"
+
|installfile= <!-- Link to installation file (e.g. [[Media:The Installation File.sis]]) -->
|-
+
|devices= Nokia N95
|'''ID''' || CS000861
+
|sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Nokia Qt SDK 1.1]) -->
|'''Creation date''' || March 25, 2008
+
|platform= S60 3rd Edition, FP1
|-
+
|devicecompatability= <!-- Compatible devices (e.g.: All* (must have GPS) ) -->
|'''Platform''' || S60 3rd Edition, FP1
+
|dependencies= <!-- Any other/external dependencies e.g.: Google Maps Api v1.0 -->
|'''Tested on devices''' || Nokia N95
+
|signing= <!-- Empty or one of Self-Signed, DevCert, Manufacturer -->
|-
+
|capabilities= <!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. -->
|'''Category''' || Symbian C++
+
|keywords= CCoeControl, TResourceReader, CCoeControlArray
|'''Subcategory''' || UI
+
|language= <!-- Language category code for non-English topics - e.g. Lang-Chinese -->
|-
+
|translated-by= <!-- [[User:XXXX]] -->
|}
+
|translated-from-title= <!-- Title only -->
 
+
|translated-from-id= <!-- Id of translated revision -->
 
+
|review-by= <!-- After re-review: [[User:username]] -->
{|style="background:#eceff2" width="660px" border="1" cellpadding="5" cellspacing="0"
+
|review-timestamp= <!-- After re-review: YYYYMMDD -->
|-
+
|update-by= <!-- After significant update: [[User:username]]-->
|'''Keywords (APIs, classes, methods, functions):''' CCoeControl, TResourceReader, CCoeControlArray
+
|update-timestamp= <!-- After significant update: YYYYMMDD -->
|}
+
|creationdate= 20080307
 +
|author= [[User:Tepaa]]
 +
<!-- The following are not in current metadata -->
 +
|subcategory= UI
 +
|id= CS000861
 +
}}
  
 
==Overview==
 
==Overview==
  
This code snippet shows how to create a container control that
+
{{Abstract|This code snippet shows how to create a container control that owns custom controls. The example shows how to focus the first component with a rectangle and how to change focus.}}
owns custom controls. The example shows how to focus the first component
+
with a rectangle and how to change focus.
+
  
The example extends the existing code snippet [[CS000859 - Custom control]].
+
The example extends the existing code snippet [[How to create a custom control in Symbian C++]].
  
Container controls store their controls into <tt>CCoeControlArray</tt>.
+
Container controls store their controls into {{Icode|CCoeControlArray}}.
  
 
==Header==
 
==Header==
Line 166: Line 169:
  
 
==SizeChanged==
 
==SizeChanged==
When <tt>CMyContainerControl</tt>'s size changes (when, for example, SetRect() is called), components' positions have to be calculated again.
+
When {{Icode|CMyContainerControl}}'s size changes (when, for example, SetRect() is called), components' positions have to be calculated again.
  
 
<code cpp>
 
<code cpp>
Line 178: Line 181:
 
==Focusing component==
 
==Focusing component==
  
Make the following changes to the <tt>CMyControl</tt> component.
+
Make the following changes to the {{Icode|CMyControl}} component.
* <tt>CMyControl::Draw()</tt> must call <tt>DrawFocusFrame()</tt> for drawing the focus rectangle
+
* {{Icode|CMyControl::Draw()}} must call {{Icode|DrawFocusFrame()}} for drawing the focus rectangle
* <tt>CMyControl::DrawFocusFrame()</tt> is a new method where focus rectangle is drawn
+
* {{Icode|CMyControl::DrawFocusFrame()}} is a new method where focus rectangle is drawn
 
<code cpp>
 
<code cpp>
 
void CMyControl::Draw(const TRect& aRect) const
 
void CMyControl::Draw(const TRect& aRect) const
Line 210: Line 213:
  
 
==Postconditions==
 
==Postconditions==
<tt>CMyContainerControl</tt> container has some <tt>CMyControl</tt>custom  
+
{{Icode|CMyContainerControl}} container has some {{Icode|CMyControl}}custom  
 
controls in a list.
 
controls in a list.
  
 
==See also==
 
==See also==
 
Custom Control Series:
 
Custom Control Series:
* [[CS000859 - Custom_control]]  Defining a custom control  
+
* [[How to create a custom control in Symbian C++]]  Defining a custom control  
* [[CS000860 - Custom control: Construct from resource]] Creating a control from a resource
+
* [[Constructing a Symbian custom control from a resource]] Creating a control from a resource
* [[Custom control - focusing]] Handling key events and changing active custom control focus
+
* [[Changing the focus of a Symbian custom control]] Handling key events and changing active custom control focus
* [[Custom control - scrollbars]] Adding scroll bar to custom control
+
* [[Archived:Using scrollbars in Symbian container control]] Adding scroll bar to custom control
* [[Custom control - in dialog]] Adding a custom control into CAknDialog
+
* [[Using a Symbian custom control in a dialog]] Adding a custom control into CAknDialog
* [[Image:CustomControl.zip]] Example code patch
+
* [[File:CustomControl.zip]] Example code patch
 
+
[[Category:Symbian C++]][[Category:UI]][[Category:S60]][[Category:Code Examples]]
+

Revision as of 00:09, 4 August 2012

Article Metadata
Code ExampleTested with
Devices(s): Nokia N95
Compatibility
Platform(s): S60 3rd Edition, FP1
S60 3rd Edition FP1
Article
Keywords: CCoeControl, TResourceReader, CCoeControlArray
Created: tepaa (07 Mar 2008)
Last edited: lpvalente (04 Aug 2012)

Contents

Overview

This code snippet shows how to create a container control that owns custom controls. The example shows how to focus the first component with a rectangle and how to change focus.

The example extends the existing code snippet How to create a custom control in Symbian C++.

Container controls store their controls into CCoeControlArray.

Header

class CMyContainerControl : public CCoeControl
{
public:
static CMyContainerControl* NewL(const TRect& aRect);
static CMyContainerControl* NewLC(const TRect& aRect);
virtual ~CMyContainerControl();
 
private: // from CCoeControl
void Draw(const TRect& aRect) const;
void SizeChanged();
 
public: // own methods
// NOTE: Transfer ownership to CMyContainerControl
void AddControlL(CCoeControl* aControl,TInt aControlId);
void UpdateControls();
 
private: // own methods
CMyContainerControl();
void ConstructL(const TRect& aRect);
};


Source

CMyContainerControl* CMyContainerControl::NewL(const TRect& aRect)
{
CMyContainerControl* self = CMyContainerControl::NewLC(aRect);
CleanupStack::Pop(self);
return self;
}
 
CMyContainerControl* CMyContainerControl::NewLC(const TRect& aRect)
{
CMyContainerControl* self = new(ELeave) CMyContainerControl();
CleanupStack::PushL(self);
self->ConstructL(aRect);
return self;
}
 
CMyContainerControl::CMyContainerControl()
{
}
 
CMyContainerControl::~CMyContainerControl()
{
}
 
void CMyContainerControl::ConstructL(const TRect& aRect)
{
// No parent owner, so create an own window
CreateWindowL();
 
// Initialize component array
InitComponentArrayL();
 
SetRect(aRect);
 
ActivateL();
}
 
void CMyContainerControl::SizeChanged()
{
UpdateControls();
}
 
void CMyContainerControl::UpdateControls()
{
TPoint position;
 
// Goes through all components of this container control
CCoeControlArray::TCursor cursor = Components().Begin();
CCoeControl* ctrl = NULL;
while ((ctrl = cursor.Control<CCoeControl>()) != NULL)
{
// If control is not visible, do not set it's position
if (!ctrl->IsVisible())
{
cursor.Next();
continue;
}
 
// Set position
ctrl->SetPosition(position);
 
// Set size
TSize size = ctrl->MinimumSize();
size.SetSize(Rect().Width(),size.iHeight);
ctrl->SetSize(size);
 
// Calculate position
position.iY += size.iHeight;
 
// Does control fit to view?
if (position.iY >= Rect().iBr.iY)
{
ctrl->MakeVisible(EFalse);
}
else
{
ctrl->MakeVisible(ETrue);
}
 
cursor.Next();
}
}
 
void CMyContainerControl::Draw(const TRect& /*aRect*/) const
{
CWindowGc& gc = SystemGc();
gc.SetBrushColor(KRgbBlack);
gc.Clear(Rect());
}
 
void CMyContainerControl::AddControlL(CCoeControl* aControl,TInt aControlId)
{
// NOTE: Transfer ownership of CCoeControl to CMyContainerControl
// Add control into container control
Components().AppendLC(aControl,aControlId);
CleanupStack::Pop(aControl);
 
// Focus first component
if (Components().Count()==1)
{
aControl->SetFocus(ETrue);
}
 
// Update control's position
UpdateControls();
}

SizeChanged

When CMyContainerControl's size changes (when, for example, SetRect() is called), components' positions have to be calculated again.

void CMyContainerControl::SizeChanged()
{
// Sets new position of the components
UpdateControls();
}

Focusing component

Make the following changes to the CMyControl component.

  • CMyControl::Draw() must call DrawFocusFrame() for drawing the focus rectangle
  • CMyControl::DrawFocusFrame() is a new method where focus rectangle is drawn
void CMyControl::Draw(const TRect& aRect) const
{
CWindowGc& gc = SystemGc();
gc.SetBrushColor(KRgbBlue);
gc.Clear(Rect());
 
DrawFocusFrame(aRect);
}
 
void CMyControl::DrawFocusFrame(const TRect& aRect) const
{
// Nothing to draw if not focused
if ( IsFocused() == EFalse )
return;
 
// Prep for draw
CWindowGc& gc = SystemGc();
gc.SetPenStyle( CGraphicsContext::ESolidPen );
gc.SetPenSize( TSize(KFocusFrameWidth,KFocusFrameWidth) );
gc.SetBrushStyle( CGraphicsContext::ENullBrush );
gc.SetPenColor( KRgbDarkGray );
 
// Draw the rounded rectangle
gc.DrawRoundRect( aRect, TSize( KFrameRoundRadius, KFrameRoundRadius ) );
}

Postconditions

CMyContainerControl container has some CMyControlcustom controls in a list.

See also

Custom Control Series:

144 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×