4D View Pro : Personnalisez le style de vos tableaux

Les tableaux font partie intégrante des documents 4D View Pro, c’est pourquoi nous avons fourni de nombreuses fonctionnalités liées aux tableaux au fil des versions de 4D. 4D v19 R8 en ajoute une nouvelle liée aux styles afin que le tableau s’intègre parfaitement au reste de votre document.

Désormais, VP Set table theme offre un moyen d’appliquer par programmation l’un des styles de tableau prédéfinis. Si aucun de ces styles ne répond à votre besoin, vous pouvez définir votre propre thème et l’appliquer à votre tableau.

HDI VP table style

SpreadJS dispose de plus de 60 thèmes prédéfinis :

• « dark1 » à « dark11 »
• « light1 » à « light21 »
• « medium1 » à moyen28
• « professionnel1 » à « medium28 ».

Pour créer un tableau avec l’un de ces thèmes, vous pouvez l’indiquer dans la commande VP CREATE TABLE:

$paramètre:=Nouvel objet
$paramètre.thème:="dark10"
VP CREATE TABLE(VP Cells("ViewProArea" ; 2 ; 1 ; 3 ; 1) ; "myTable" ; "people" ; $paramètre)

De la même manière, vous pouvez modifier le thème d’une table existante avec VP SET TABLE THEME:

$parameter:=cs.ViewPro.TableThemeOptions
$parameter.theme:="medium2"
VP SET TABLE THEME("ViewProArea" ; "myTable" ; $parameter)

Vous pouvez récupérer et tester les thèmes dark, light et medium à l’aide du ruban :

Créer un thème personnalisé

Si aucun des thèmes définis ne répond à vos besoins, vous pouvez créer votre propre thème. Vous pouvez définir un style pour vos colonnes, vos lignes, votre en-tête et votre pied de page.

Par exemple, si vous souhaitez avoir ce rendu de colonnes en bandes :

Vous devez :

• Activer le rendu de colonne en bande :

$param:=cs.ViewPro.TableThemeOptions
$param.bandColumns:=True
$param.bandRows:=False

• Créez votre style d’en-tête :

$styleHeader:=cs.ViewPro.TableStyle.new()
$styleHeader.backColor:="rgb(255,228,92)"
$styleHeader.foreColor:="rgb(3,4,94)"
$param.theme:=cs.ViewPro.TableTheme.new()
$param.theme.headerRowStyle:=$styleHeader

• Créez votre style de colonnes alternées :

$styleColumn1:=cs.ViewPro.TableStyle.new()
$styleColumn1.backColor:="#0077B6"
$styleColumn1.foreColor:="#03045E"
$param.theme.firstColumnStripStyle:=$styleColumn1

$styleColumn2:=cs.ViewPro.TableStyle.new()
$styleColumn2.backColor:="#CAF0F8"
$styleColumn2.foreColor:="#03045E"
$param.theme.secondColumnStripStyle:=$styleColumn2

Appliquez votre nouveau thème grâce à l’adresse VP SET TABLE NAME:

VP SET TABLE THEME("ViewProArea" ; "myTable" ; $param)

Et voilà, c’est fait !

Découvrez cette fonctionnalité avec le HDI ci-dessus et la documentation pour plus de détails !