Übersicht über die Implementierung

Erstellen Sie eine Skin:
  1. Öffnen Sie das ManageAssets-Projekt und navigieren Sie zum Paket „com.adobe.solutions.cmg.manage.skins“ (CorrespondenceManagementSolutionTemplate\ManageAssets\src\com\adobe\solutions\cmg\manage\skins).

  2. Erstellen Sie für die Hostkomponente com.adobe.solutions.acm.authoring.presentation.TextEditor eine MXML-Skin (z. B. CustomTextEditorSkin.mxml), indem Sie eine vorhandene Skin wie com.adobe.solutions.acm.authoring.skins.TextEditorSkin kopieren.

  3. Nehmen Sie in der MXML-Skin die gewünschten Änderungen vor. So können Sie beispielsweise die Höhe der Beschreibungseingabe vergrößern, indem Sie mehrere Zeilen zulassen. Ändern Sie descrptionDesplay in TextArea und ändern Sie die folgende Höhe wie folgt:
    <s:TextInput id="descriptionDisplay"  enabled="true" enabled.View="false" width="205" height="24" />
    In:
    <s:TextArea id="descriptionDisplay"  enabled="true" enabled.View="false" width="205" height="54" />
    Auf ähnliche Weise ändern Sie die Farbe der Fußzeile eines Dialogfelds. Ändern Sie hierzu den folgenden Code wie folgt:
    <!-- footer background --> 
        <s:Rect bottom="1" left="1" right="1" height="{footerBar.height}" > 
             <s:fill > 
                 <s:LinearGradient rotation="90" > 
                     <s:GradientEntry color="0xe6e6e6"  /> 
                     <s:GradientEntry color="0xe0e0e0"  /> 
                 </s:LinearGradient> 
             </s:fill> 
        </s:Rect> 
        <s:Rect bottom="{footerBar.height-1}" left="1" right="1" height="1" > 
             <s:fill> 
                 <s:SolidColor color="0xd1d1d1"  /> 
             </s:fill> 
    </s:Rect>
    In:
    <!-- footer background --> 
        <s:Rect bottom="1" left="1" right="1" height="{footerBar.height}" > 
            <s:fill > 
                <s:LinearGradient rotation="90" > 
                    <s:GradientEntry color="0x3BB9FF"  /> 
                    <s:GradientEntry color="0xe0e0e0"  /> 
                </s:LinearGradient> 
            </s:fill> 
        </s:Rect> 
        <s:Rect bottom="{footerBar.height-1}" left="1" right="1" height="1" > 
            <s:fill> 
                <s:SolidColor color="0x3BB9FF"  /> 
            </s:fill> 
    </s:Rect>
  4. Erstellen Sie eine CSS-Datei, um die obige Skinklasse zu verwenden, und fügen Sie die CSS der Hauptdatei „index.mxml“ des Projekts hinzu. Beispiel:

    /* CSS file */ 
    @namespace s "library://ns.adobe.com/flex/spark"; 
    @namespace mx "library://ns.adobe.com/flex/mx"; 
    @namespace presentation "com.adobe.solutions.acm.authoring.presentation.*"; 
    @namespace custom "com.adobe.customizations"; 
    @namespace customizations "com.adobe.customizations.*"; 
    @namespace presentation1 "com.adobe.solutions.cmg.manage.presentation.*"; 
     
    presentation1|AssetEditorsStack 
    { 
        backgroundGradientStartColor: #FFFFFF; 
        backgroundGradientEndColor: #FFFFFF; 
        outerBorderColor: #000000; 
        outerBorderAlpha: .33; 
        skinClass: ClassReference("com.adobe.solutions.cmg.manage.skins.CustomTextEditorSkin"); 
        cornerRadius: 2; 
    }
  5. Fügen Sie diese bearbeitete CSS-Datei in die Datei „index.mxml“ ein (nach allen anderen CSS-Dateien):
    <fx:Style source="/CSS/custom_styles.css"/>
  6. Lösungsvorlage neu erstellen und erneut bereitstellen Informationen zum erneuten Erstellen und Bereitstellen finden Sie unter Lösungsvorlage erstellen und bereitstellen.