Προσαρμογή κεφαλίδων στήλης στο πλέγμα πρόβλεψης

Μπορείτε να προσαρμόσετε κεφαλίδες στηλών στο πλέγμα πρόβλεψης χρησιμοποιώντας στοιχεία κώδικα του Power Apps. Για παράδειγμα, μπορείτε να μεταφράσετε το όνομα της στήλης ή να προσθέσετε μια συμβουλή εργαλείου για πρόσθετο περιβάλλον.

Πώς να προσαρμόσετε την κεφαλίδα

Ας κατανοήσουμε τις προσαρμογές με ένα παράδειγμα. Θα προσθέσουμε τη γαλλική μετάφραση για τα ονόματα στηλών Πρόβλεψη και Νικήθηκε στο πλέγμα πρόβλεψης.

  1. Δημιουργία στοιχείου κώδικαμε το όνομα ColumnHeader
  2. Δημιουργία αρχείου πόρων και προσθήκη μεταφράσεων
  3. Υλοποίηση της διακήρυξης
  4. Υλοποίηση της λογικής του στοιχείου
  5. Δημιουργία και συσκευασία του στοιχείου

Δημιουργία αρχείου πόρων και προσθήκη μεταφράσεων

Αφού δημιουργήσετε το στοιχείο κώδικα, ο φάκελος ColumnHeader δημιουργείται στη διαδρομή που έχετε καθορίσει. Δημιουργήστε ένα αρχείο πόρων και προσθέστε τις γαλλικές μεταφράσεις στο αρχείο πόρων.

  1. Δημιουργήστε έναν φάκελο που ονομάζεται strings κάτω από τον φάκελο ColumnHeader.

  2. Αντιγράψτε τον ακόλουθο κώδικα σε ένα νέο αρχείο, ColumnHeader.1036.resx

    Σημείωμα

    Ο αριθμός 1036 στο όνομα αρχείου είναι ο κωδικός γλώσσας για τα Γαλλικά. Για μια λίστα με τους κωδικούς γλώσσας, ανατρέξτε στο αυτό το άρθρο.

    <?xml version="1.0" encoding="utf-8"?>
<root>

  <xsd:schema id="root" xmlns="" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
    <xsd:import namespace="http://www.w3.org/XML/1998/namespace" />
    <xsd:element name="root" msdata:IsDataSet="true">
      <xsd:complexType>
        <xsd:choice maxOccurs="unbounded">
          <xsd:element name="metadata">
            <xsd:complexType>
              <xsd:sequence>
                <xsd:element name="value" type="xsd:string" minOccurs="0" />
              </xsd:sequence>
              <xsd:attribute name="name" use="required" type="xsd:string" />
              <xsd:attribute name="type" type="xsd:string" />
              <xsd:attribute name="mimetype" type="xsd:string" />
              <xsd:attribute ref="xml:space" />
            </xsd:complexType>
          </xsd:element>
          <xsd:element name="assembly">
            <xsd:complexType>
              <xsd:attribute name="alias" type="xsd:string" />
              <xsd:attribute name="name" type="xsd:string" />
            </xsd:complexType>
          </xsd:element>
          <xsd:element name="data">
            <xsd:complexType>
              <xsd:sequence>
                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
                <xsd:element name="comment" type="xsd:string" minOccurs="0" msdata:Ordinal="2" />
              </xsd:sequence>
              <xsd:attribute name="name" type="xsd:string" use="required" msdata:Ordinal="1" />
              <xsd:attribute name="type" type="xsd:string" msdata:Ordinal="3" />
              <xsd:attribute name="mimetype" type="xsd:string" msdata:Ordinal="4" />
              <xsd:attribute ref="xml:space" />
            </xsd:complexType>
          </xsd:element>
          <xsd:element name="resheader">
            <xsd:complexType>
              <xsd:sequence>
                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
              </xsd:sequence>
              <xsd:attribute name="name" type="xsd:string" use="required" />
            </xsd:complexType>
          </xsd:element>
        </xsd:choice>
      </xsd:complexType>
    </xsd:element>
  </xsd:schema>
  <resheader name="resmimetype">
    <value>text/microsoft-resx</value>
  </resheader>
  <resheader name="version">
    <value>2.0</value>
  </resheader>
  <resheader name="reader">
    <value>System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
  </resheader>
  <resheader name="writer">
    <value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
  </resheader>
  <data name="Forecast" xml:space="preserve">
    <value>Prévision</value>
  </data>
  <data name="Won" xml:space="preserve">
    <value>Gagné</value>
  </data>
</root>

    Στο παραπάνω δείγμα κώδικα, τα ονόματα στηλών για Πρόβλεψη και Κερδήθηκε παρακάμπτονται με τις γαλλικές μεταφράσεις Prévision και Gagné, αντίστοιχα, στον κόμβο <data>.

    Σημείωμα

    Στην παράμετρο name , καθορίστε το ακριβές όνομα στήλης που έχετε ρυθμίσει στο βήμα Διάταξη της πρόβλεψης.

    Ένα στιγμιότυπο οθόνης των ονομάτων στήλης στο βήμα **Διάταξη** της ρύθμισης παραμέτρων πρόβλεψης

    Αν θέλετε να μεταφράσετε το όνομα στήλης σε πρόσθετες γλώσσες, δημιουργήστε ένα αρχείο πόρων για κάθε γλώσσα στην οποία θέλετε να μεταφράσετε. Βεβαιωθείτε ότι το όνομα αρχείου πόρου χρησιμοποιεί την παρακάτω σύμβαση ονομασίας:

    filename.languagecode.resx  
**Example file name for German:** ColumnHeader.1031.resx

Υλοποίηση της διακήρυξης

Στη συνέχεια, θα τροποποιήσουμε το αρχείο διακήρυξης για να καθορίσουμε την ιδιότητα που παρακάμπτουμε. Στο δικό μας παράδειγμα, παρακάμπτουμε την ιδιότητα ColumnName. Θα καθορίσουμε επίσης τη διαδρομή στο αρχείο πόρων που περιέχει το μεταφρασμένο κείμενο.

  1. Ανοίξτε το αρχείο ControlManifest.Input.XML.

  2. Αναζητήστε τον κόμβο property και αντικαταστήστε τον με τον ακόλουθο κωδικό as-is:

    <property name="columnName" display-name-key="Property_Display_Key" description-key="Property_Desc_Key" of-type="SingleLine.Text" usage="bound" required="true" />

  3. Ενημερώστε τον κόμβο <resources> για να καθορίσετε τη διαδρομή προς το αρχείο πόρων που περιλαμβάνει τις γαλλικές μεταφράσεις:

    <resources>
  <code path="index.ts" order="1"/>
  <!-- UNCOMMENT TO ADD MORE RESOURCES
  <css path="css/ColumnHeader.css" order="1" />
  -->
  <resx path="strings/ColumnHeader.1036.resx" version="1.0.0" />
</resources>

    Ο κόμβος <resx path> περιέχει τη διαδρομή αρχείου πόρου. Στο προηγούμενο δείγμα κωδικού, προσθέσαμε το αρχείο πόρου για τα Γαλλικά. Εάν έχετε μεταφράσεις για άλλες γλώσσες, προσθέστε και τη διαδρομή αρχείου πόρων για αυτές τις γλώσσες.

Υλοποίηση της λογικής του στοιχείου

Προσθέστε τον κωδικό για την υλοποίηση της λογικής του στοιχείου στο αρχείο index.ts.

  1. Ανοίξτε το αρχείο index.ts.

  2. Προσθέστε τις παρακάτω γραμμές στη μέθοδο updateView:

    public updateView(context: ComponentFramework.Context<IInputs>): void
    {
        // Add code to update control view
        const colName = (context.parameters.columnName && context.parameters.columnName.raw) || "";
        this._container.innerHTML = context.resources.getString(colName);
    }

Επόμενα βήματα

  • Τελευταία ενημέρωση στις