Scrollen durch Datenrasterkomponenten

When you create a Data Grid with more than 12 Text Field components inside of it, the Data Grid becomes too tight to display the content. This tutorial demonstrates how to scroll through the Data Grid.

Tutorial

So blättern Sie durch eine Datenrasterkomponente :

1. Create a CSS file containing two classes for scrolling through the Data Grid and for making the Text Field components wider. The overflow-x: scroll property allows you to scroll through the Data Grid. The min-width: 300px property makes the Text Fields larger, to display the content inside of them.

   Kopieren Sie den folgenden Code und fügen Sie ihn in Ihre CSS-Datei ein:

   .my-data-grid
   {
      overflow-x: scroll;
   }
    
    
   .my-data-grid input 
   {
      min-width: 300px;
   }
   

2. Go to the LocalCSSFilePath property in the Create Form activity and input the path to the CSS file created (for example, "/file://C:/User/theCssFile.css").

   Sie können auch den Pfad zur lokalen CSS-Datei als Variable speichern und den Variablennamen in das Feld LokalerCSSDateiPfad eingeben.

3. Gehen Sie zur Registerkarte Anzeige der Komponente Datenraster . 4. Schreiben Sie in das Feld Benutzerdefinierte CSS-Klasse den Namen der in der Datei konfigurierten benutzerdefinierten CSS-Klasse wie folgt: my-data-grid. Dadurch werden die Daten in der CSS-Datei an Ihr Formular gebunden.

   

4. Speichern Sie die Komponente und das Formular.

Beispielworkflow

Laden Sie das XAML-Beispielherunter, um den vollständigen Workflow zu überprüfen oder später darauf zurückgreifen zu können