Fixing TIA Portal V11 Faceplate Z-Order on TP1200 HMI

Problem Overview

When designing HMI screens in TIA Portal V11 with WinCC Comfort or WinCC Advanced, engineers frequently need to overlay static text fields (such as a motor tag name) on top of a reusable faceplate instance. The editor preview shows the expected layout — text rendered above the faceplate — but as soon as the project is either compiled to the RT simulation or downloaded to a real TP1200 Comfort Panel, the faceplate always renders in front, occluding the text regardless of layer configuration.

This Z-order inversion between the engineering environment and the runtime is a known behavior of the faceplate container. It is not a bug in the sense of a defect, but a consequence of how faceplates are instantiated as self-contained visual objects with their own drawing plane that is composited after standard screen elements.

Affected Components and Versions

Root Cause: Faceplate Drawing Plane

In WinCC Comfort/Advanced, every faceplate instance is treated as a single composite graphic object whose internal elements (buttons, indicators, labels, IO fields, status icons) are not individually selectable on the parent screen. The faceplate occupies one entry in the screen's Z-stack, regardless of how many nested objects it contains.

The faceplate object is registered as a child of the screen canvas with a fixed draw priority that is lower than (i.e., rendered on top of) any sibling layer that has not been explicitly ordered. When you place a text field on the screen and then place a faceplate instance, the editor sometimes shows the text on top because the most recently placed object gets focus and appears above. However, the runtime composer honors the faceplate container's registered draw order and always paints the faceplate after all standard screen elements.

Layer configurations in the screen editor's "Layers" pane (visible under View > Layers) only reorder objects within the standard plane. Faceplates are not standard screen objects — they are reusable instances with their own internal layering system, and they are drawn in a separate pass.

Solution 1: Use Edit > Order > Bring to Front

The most direct workaround is to use the explicit z-order command from the editor menu. This raises the selected standard object (text field, rectangle, IO field) above the faceplate container's draw priority.

1. Select the text field (or any other standard object) that you want to display above the faceplate instance on the screen.
2. Right-click the selected object to open the context menu.
3. Navigate to Edit > Order > Bring to Front (or use the equivalent menu path from the top menu bar).
4. The object is now repositioned in the screen's draw order above the faceplate instance.
5. Compile the project, start RT simulation, and confirm the text renders above the faceplate.
6. Download the project to the TP1200 and verify on the physical panel.

The keyboard shortcut in TIA Portal V11 for Bring to Front is Ctrl + Shift + F. The opposite operation, Send to Back, is Ctrl + Shift + B. Use the Bring Forward One Level / Send Backward One Level commands (Ctrl+] and Ctrl+[ respectively) for incremental repositioning when you need fine control.

Why the Runtime Initially Disagrees with the Editor

The editor preview in WinCC Comfort/Advanced uses a lightweight WPF-based rendering engine that does not strictly enforce the same draw order as the panel's CE-based runtime. The runtime engine treats faceplates as interlocked composites with a documented z-priority of 0x0100, while standard objects placed on the screen canvas default to priority 0x0001. Until Bring to Front is applied, the standard object's priority remains 0x0001, and the faceplate will always be drawn after it. The Bring to Front command sets the standard object's priority to 0x0FFF, ensuring the runtime paints it last.

Solution 2: Pass the Device Name via the Faceplate Interface

For motor, valve, pump, and other equipment faceplates, the recommended long-term solution is to expose the equipment tag name as a configurable property of the faceplate itself. This eliminates the need for an overlay text field entirely and keeps the faceplate self-contained.

Step 1: Open the Faceplate Editor

1. In the project tree, expand HMI Tags > Faceplates and double-click the faceplate you want to modify (for example, Motor_Faceplate).
2. The faceplate opens in the Faceplate editor. The interface properties are listed in the properties pane on the right.

Step 2: Add an Interface Property

1. Right-click in the empty area of the properties pane under Interface and select Add new property.
2. Set the name to EquipmentName.
3. Set the data type to WString (or String if your naming convention is ASCII-only).
4. Click OK to add the property.

Step 3: Bind the Property to a Text Field Inside the Faceplate

1. Inside the faceplate canvas, place a text field at the top center.
2. Select the text field. In the properties pane, navigate to Text > Dynamic.
3. Click the small arrow next to the text field and select Interface tag > EquipmentName.
4. The text field now displays the dynamic value passed by the faceplate instance configuration.

Step 4: Configure Each Instance

1. On the parent screen, place the faceplate instance.
2. Select the instance, open the properties pane, and locate the new EquipmentName property.
3. Enter the motor or equipment tag identifier, e.g. M_101_A, M_202_B, Pump_Condensate_03.
4. The text inside the faceplate updates immediately in the editor and at runtime.

TP1200 Comfort Panel Specifics

The TP1200 Comfort is a 12.1-inch widescreen panel (resolution 1280 × 800) running the WinCC RT Comfort runtime on Windows Embedded Compact 7. It supports up to 500 faceplate instances per screen (the same limit as the larger TP1500/TP1900/TP2200 models) and has 24 MB of usable screen memory.

When working on the TP1200, the runtime draw cycle for the entire screen must complete within the configured refresh time, typically 100 ms by default. Adding numerous overlay text fields via Bring to Front increases the per-frame draw call count. If you observe sluggishness on a screen with more than 30 faceplates and several overlay texts, switch to the interface-property approach (Solution 2), which adds no extra draw calls because the text is rendered inside the faceplate container.

Layer System Reference

The WinCC Comfort/Advanced layer system supports up to 32 layers per screen, numbered 0 through 31, with layer 0 being the base (back) layer and layer 31 being the top (front) layer. The layer order can be inspected via View > Layers.

Moving a faceplate to a higher layer than the text field layer does not raise the text above the faceplate, because the layer system governs the z-order of objects placed on that layer, but faceplates draw in their own internal composite pass that sits outside the layer system. This is why placing the text on layer 4 and the faceplate on layer 3 appears correct in the editor (text drawn after faceplate in z-stack) but the runtime composites the faceplate after the text regardless.

Comparison: Three Approaches

Common Mistakes and Field Pitfalls

1. Trusting the editor preview. The TIA Portal editor uses a different rendering engine than the runtime. Always verify the final layout on the physical TP1200 or in the RT Advanced simulation with the target resolution (1280 × 800).
2. Using layer order instead of Bring to Front. Moving an object to a higher layer in the Layers pane does not raise it above a faceplate container. The Bring to Front command is the only standard-screen-level operation that overrides the faceplate's composite priority.
3. Modifying the faceplate text field directly. Text fields inside a faceplate are not individually selectable from the parent screen. Editing the faceplate template is the only way to modify internal text.
4. Forgetting to propagate the new interface property to existing instances. When you add a new interface property such as EquipmentName to an existing faceplate and then drop a new instance, the new instance must have the property configured. Existing instances already on screens may show an empty default until configured.
5. Using WString for legacy panels. Older Comfort panels (firmware before V13.0.1) may not display Unicode characters correctly with WString. If the project must support legacy panels, use String instead and restrict names to ASCII.
6. Caching and partial downloads. After changing z-order, perform a full project recompile and a complete download to the panel. Partial downloads can leave the old faceplate container in memory.

Verification Checklist

1. Compile the project: Project > Compile > Software (rebuild all). Watch for warnings about z-order or faceplate collisions.
2. Start RT simulation: Online > Simulation > Start. Verify the text appears above the faceplate at 1280 × 800 resolution.
3. Download to TP1200: Online > Extended download to device. Select the panel's IP, perform a full download (not delta), and confirm the panel restarts with the new layout.
4. Touch-test on the panel: confirm the text field is visible and does not interfere with the faceplate's touch-sensitive areas.
5. Cycle power on the TP1200 and re-verify the layout persists after a cold start.
6. If using interface tags, set the EquipmentName property on every faceplate instance and verify the dynamic text updates when the property is changed at runtime via the property panel.

Frequently Asked Questions