CodePPC - Programmez votre Pocket PC

Le contrôle TabStrip permet de placer sur votre feuille eVB des onglets. Grâce à ce système vous pouvez organiser vos fenêtres par thèmes et avec des écran aussi petits que ceux de nos Pocket PC c'est bien pratique !

Par programme il est aussi possible d'ajouter, de modifier ou d'enlever une ou plusieurs pages. Comme le TabStrip est créé avec un Tab d'origine il ne faut pas oublier de le modifier avant d'en ajouter d'autres. Dans l'exemple suivant, nous allons modifer le 1er Tab pour qu'il ait la clé "$T1" et le caption "Tab 1", puis ajouter "Tab 2" qui aura "$T2" comme clé.

Rem Modification du Tab d'origine, pas de problème, il a comme index 1
TabStrip1.Tabs(1).Key = "$T1"
TabStrip1.Tabs(1).Caption = "Tab 1"

Rem Ajout de l'autre objet Tab
Call TabStrip1.Tabs.Add(, "$T2", "Tab 2")

En regardant de plus près ce code on se rend compte que le TabStrip gère une collection d'objets de type Tab et que tout naturellement, nous utilisons une méthode Add pour ajouter un tab. Avec cette méthode, on peut indiquer l'index (facultatif), la clé (facultative mais recommandée), le titre, et l'image. Nous verrons un peu plus tard ce qu'est ce paramètre Image.

Lorsque l'utilisateur clique sur le titre d'une page pour la rendre active, le contrôle TabStrip reçoit un événement "Click". Il est très simple de savoir quel Tab vient d'être activé en travaillant avec la propriété "SelectedItem" qui pointe sur l'objet Tab actif. Dans l'exemple de code suivant, nous allons placer dans le caption de la fenêtre la clé du Tab que l'on sélectionne :

Il est donc très simple, depuis l'événement Click de déterminer la page qu'il faut afficher. Et oui, c'est à vous de gérer ça !

Comme c'est à vous de gérer la page à afficher, vous devez placer les contrôles de chaque page dans un conteneur. Le conteneur qui se prête le mieux à cette opération est le contrôle Frame (voir aussi son utilisation sans cet article). Le principe est de créer autant de Frame qu'il y aura de pages dans votre TabStrip. Pour que l'opération soit plus confortable en conception, vous pouvez agrandir la feuille sous eVB et y placer cote à cote tous les contrôles que vous allez utiliser. Prenez soin de donner à chaque Frame le nom tiré de la clé qui sera utilisée pour la Tab :

Pour le Tab "$T1", donnez à son Frame le nom FRM_T1, ainsi, il sera très simple, par une simple opération sur les chaines de trouver le nom du Frame correspondant à un Tab :

Chaque Frame doit avoir le caption à vide, pas de bord (border=0) et sa propriété Visible à False. Pour mieux montrer le fonctionnement, j'ai volontairement placé des couleurs (à la place du blanc classique) en fond des Frames.

Vous remarquerez que même si la fenêtre est plus grande en mode conception, eVB donne toujours à une fenêtre un Top et un Left à zéro, et un Width à 240 et un Height à un peu moins de 320 pixels.

Le but du jeu (si si) est d'afficher le bon Frame au bon endroit lorsque l'utilisateur sélectionne un Tab. Pour cela nous allons utiliser plusieurs techniques de sioux :

Tout d'abord, il faut déterminer sur quel frame nous allons travailler. Pour cela, nous allons tout simplement pointer sur lui en recréant son nom à partir de la clé du Tab qui vient d'être sélectionné :

Private Sub TabStrip1_Click()

 Dim wFrame As Frame
 Dim wFrameName As String
 
 Rem On initialise notre variable correctement (maudits variants !)        
 Set wFrame = Nothing
 
 Rem On calcule le nom du frame à partir de la clé du Tab sélectionné
 wFrameName = "FRM_" & Mid(TabStrip1.SelectedItem.Key, 2)
 
 Rem On pointe sur le Frame
 On Error Resume Next
  Set wFrame = Controls(wFrameName)
 On Error GoTo 0

 Rem Si le pointeur vers le Frame n'est pas Nothing
 Rem C'est que le Frame demandé est bien pointé
 If Not (wFrame Is Nothing) Then
  Rem Placer ici le code pour placer au bon endroit le frame
  Rem et ensuite le faire apparaitre
 End If

End Sub

Petit rappel, La collection "Controls" est une propriété cachée de l'objet Form. Chaque feuille eVB possède cette collection qui liste les contrôles présents sur la feuille. Donc si nous avons sur notre feuille un contrôle dont le nom est "MonControl", vous pouvez y accéder en utilisant le nom (cas classique, ex MonControl.Visible = False) ou en passant par la collection "Controls" (ex Controls("MonControl").Visible = False). Donc, pour pointer sur le Frame à partir de son nom, on utilise cette collection.

Nous devons maintenant placer correctement notre Frame dans le TabStrip. Pour cela, TabStrip met à notre disposition toute une série de propriétés qui nous machent le travail (il est sympa ce Tabstrip, c'est un bon gars) :

ClientTop :	Le Top de la zone cliente du TabStrip
ClientLeft :	Le Left de la zone cliente
ClientWidth :	Le Width de la zone cliente
ClientHeight :	Le Height de la zone cliente

Private Sub TabStrip1_Click()

 Dim wFrame As Frame
 Dim wFrameName As String
 
 Rem On initialise notre variable correctement (maudits variants !)        
 Set wFrame = Nothing
 
 Rem On calcule le nom du frame à partir de la clé du Tab sélectionné
 wFrameName = "FRM_" & Mid(TabStrip1.SelectedItem.Key, 2)
 
 Rem On pointe sur le Frame
 On Error Resume Next
  Set wFrame = Controls(wFrameName)
 On Error GoTo 0

 Rem Si le pointeur vers le Frame n'est pas Nothing
 Rem C'est que le Frame demandé est bien pointé
 If Not (wFrame Is Nothing) Then
 
  wFrame.Left = TabStrip1.ClientLeft
  wFrame.Top = TabStrip1.ClientTop
  wFrame.Width = TabStrip1.ClientWidth
  wFrame.Height = TabStrip1.ClientHeight
  wFrame.Visible = True
  Call wFrame.ZOrder(0)
 
 End If

End Sub

Il faut utiliser la méthode ZOrder avec comme paramètre zéro car autrement le Frame serait derrière le TabStrip, donc invisible.

Si l'on teste le programme on obtient ceci :

Il nous reste un dernier problème. Lorsque l'on démarre le programme, le premier Tab est automatiquement sélectionné mais comme aucun événement n'est lancé, il faut manipuler le TabStrip pour que les choses entre dans l'ordre.

Pour éviter ce problème, nous allons créer une procédure chargée de placer et de faire apparaitre le bon Frame en prenant comme paramètre la clé du Tab correspondant :

Private Sub PlacerFrame(ByVal wTabKey As String)
 Dim wFrame As Frame
 Dim wFrameName As String
           
 Set wFrame = Nothing
 wFrameName = "FRM_" & Mid(wTabKey, 2)
 On Error Resume Next
  Set wFrame = Controls(wFrameName)
 On Error GoTo 0
           
 If Not (wFrame Is Nothing) Then 
  wFrame.Left = TabStrip1.ClientLeft
  wFrame.Top = TabStrip1.ClientTop
  wFrame.Width = TabStrip1.ClientWidth
  wFrame.Height = TabStrip1.ClientHeight
  wFrame.Visible = True
  Call wFrame.ZOrder(0)
 End If
End Sub

Il ne nous reste plus qu'à utiliser cette procédure dans l'événement Click du TabStrip (fonctionnement normal) :

Private Sub TabStrip1_Click()
 Call PlacerFrame(TabStrip1.SelectedItem.Key)
End Sub

Et de placer dans l'événement Load de la feuille un appel à cette procédure avec comme paramètre la clé du premier Tab, c'est à dire "$T1" :

Private Sub Form_Load()

 TabStrip1.Tabs(1).Key = "$T1"
 TabStrip1.Tabs(1).Caption = "Tab 1"
           
 Call TabStrip1.Tabs.Add(, "$T2", "Tab 2")
           
 Call PlacerFrame("$T1")

End Sub

Conclusion de cette première partie

Le contrôle TabStrip est très pratique pour afficher des feuilles complexes avec beaucoup de contrôles. Dans la seconde partie nous optimiserons l'affichage de nos Frames afin d'éviter le cadre gris autour du TabStrip et nous regarderont de près cette histoire d'images...

N'oubliez pas que les forums

sont à votre disposition si vous rencontrez des problèmes avec cet article.