×
Namespaces

Variants
Actions

Tab operations

From Nokia Developer Wiki
Jump to: navigation, search
Article Metadata
Article
Created: rathodavinash (29 Jun 2007)
Last edited: hamishwillee (03 Feb 2012)

Contents

Introduction

Tabs.JPG

The following article shows what operations can be done on tabs. Tabs are UI components which facilitate easier navigation just by pressing the joystick left or right. Tabs are shown in the navigation pane and navigation pane itself is a part of the status pane.

Individual tab units can be either long or short. They can have simple labels or icons on them.


Files and library

Following are the header files required: eikspane.h, aknnavide.h, akntabgrp.h

Link against: avkon.lib , eikcore.lib

Construction

Tabs can be constructed in the AppUi or the container of a particular view. The resources for the status pane and the tab group are as follows:

RESOURCE STATUS_PANE_APP_MODEL r_myview_status_pane
{
panes=
{
SPANE_PANE
{
id = EEikStatusPaneUidNavi;
type = EAknCtNaviPane;
resource = r_myview_navi_decorator;
}
};
}
 
RESOURCE NAVI_DECORATOR r_myview_navi_decorator
{
type = ENaviDecoratorControlTabGroup;
control = TAB_GROUP
{
tab_width = EAknTabWidthWithTwoTabs; // two tabs
active = 0;
tabs = {
TAB
{
id = EMyViewView1Tab; // from application hrh
txt = qtn_view1_tab;
},
TAB
{
id = EMyViewView2Tab;
txt = qtn_view2_tab;
}
};
};
}
if ( !iNaviPane )
{
CEikStatusPane *sp =
( ( CAknAppUi* )iEikonEnv->EikAppUi() )->StatusPane();
 
iNaviPane = ( CAknNavigationControlContainer * )
sp->ControlL( TUid::Uid( EEikStatusPaneUidNavi ) );
}
 
iNaviDecorator = iNaviPane->CreateTabGroupL();
 
CAknTabGroup * tabGroup = (CAknTabGroup*) iNaviDecorator->DecoratedControl();
 
iNaviPane->PushL(*iNaviDecorator);


Operations

The following operations can be performed:

  • Add new tab
void CMyContainer::AddNewTabL(TInt aTabid)
{
// get a pointer to the tab group
CAknTabGroup* tabGroup = (CAknTabGroup*) iNaviDecorator->DecoratedControl();
 
// format the string of text to appear in the new tab
TBuf<10> temp;
temp.Format(_L("%d"), aTabid + 1);
 
// add the new tab to the end, and make it active
tabGroup->AddTabL(aTabid, temp);
tabGroup->SetActiveTabById(aTabid);
SetTitle(aTabid,2);
}
  • Moving to a particular tab (activating it)
TBool CMyContainer::SetActiveTab(TUid aTab)
{
// get a pointer to the tab group
CAknTabGroup* tabGroup = (CAknTabGroup*) iNaviDecorator->DecoratedControl();
TInt iTabInt = aTab.iUid;
tabGroup->SetActiveTabById(iTabInt);
SetTitle(iTabInt,2);
return ETrue;
}
  • Hide tabgroup
void CMyContainer::HideTabs()
{
iNaviPane->Pop();
}
  • Show tabgroup
void CMyContainer::ShowTabs()
{
iNaviPane->PushL(*iNaviDecorator);
}
  • Set title of a particular tab
void CMyContainer::SetTitle(TInt aTabid, TInt aView)
{
CEikStatusPane* sp = iEikonEnv->AppUiFactory()->StatusPane();
iTitlePane = ( CAknTitlePane*)
sp->ControlL(TUid::Uid(EEikStatusPaneUidTitle ));
 
TBuf<10> temp;
 
if( aView == 2)
temp.Format(_L("Buddy %d"),aTabid+1);
else
temp.Copy(_L("MyView"));
 
iTitlePane->SetTextL(temp);
}
  • Which is the currently active tab
TInt CMyContainer::ActiveTab()
{
CAknTabGroup* iTabGroup =
(CAknTabGroup*) iNaviDecorator->DecoratedControl();
 
return iTabGroup->ActiveTabId();
}
  • Moving between tabs
TKeyResponse CMyContainer::OfferKeyEventL(const TKeyEvent& aKeyEvent, TEventCode aType)
{
if (aType != EEventKey)
{
return EKeyWasNotConsumed;
}
 
CAknTabGroup* iTabGroup = (CAknTabGroup*) iNaviDecorator->DecoratedControl();
if ( iTabGroup == NULL )
{
return EKeyWasNotConsumed;
}
 
TInt active = iTabGroup->ActiveTabIndex();
TInt count = iTabGroup->TabCount();
 
switch ( aKeyEvent.iCode )
{
case EKeyLeftArrow:
if ( active > 0 )
{
active--;
iTabGroup->SetActiveTabByIndex( active );
}
break;
case EKeyRightArrow:
if( (active + 1) < count )
{
active++;
iTabGroup->SetActiveTabByIndex( active );
}
break;
default:
return EKeyWasNotConsumed;
break;
}
 
return EKeyWasConsumed;
}

Tips

It may be a requirement that the tabs should not be shown when in a particular view. In such case in the views DoDeactivateL do the following

void CMyView::DoDeactivate()
{
iContainer->HideTabs();
iContainer->SetTitle(1,1);
}


Document and View Architecture based Tabbed application

In this case one important thing is to be considered that , with every tab ususally one view will be associated and the decorator and navipan objects references they reside in AppUi class instead of container rest of the things are same

1) When a particular tab is activated corresponding view should be brought in front else you will see the different tab but view will remain same 2) When a view which is not part of tabbed group and related views, is to be brought to front then one needs to take care of hiding the tabs else you will see the view but the tabs they will still be displayed in naviPan and user will think that this view is also part of tabbed views.

Inshort above all the methods will reside in the AppUI class

This page was last modified on 3 February 2012, at 05:22.
52 page views in the last 30 days.
×