diff --git a/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/DefaultMobileStyleDefinePane.java b/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/DefaultMobileStyleDefinePane.java
index 7ffd0abe2..10fc42e8f 100644
--- a/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/DefaultMobileStyleDefinePane.java
+++ b/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/DefaultMobileStyleDefinePane.java
@@ -95,9 +95,9 @@ public class DefaultMobileStyleDefinePane extends MobileTemplateStyleDefinePane
             int ascentHeight = fm.getAscent();
             for (int i = 0; i < cardTagLayout.getWidgetCount(); i++) {
                 CardSwitchButton cardSwitchButton = cardTagLayout.getSwitchButton(i);
-                String widgetName = cardSwitchButton.getText();
-                int width = fm.stringWidth(widgetName);
-                g2d.drawString(widgetName, (eachWidth - width) / 2, (panelHeight - fontHeight) / 2 + ascentHeight);
+                String displayName = calculateDisplayName(cardSwitchButton.getText(), fm, eachWidth);
+                int width = fm.stringWidth(displayName);
+                g2d.drawString(displayName, (eachWidth - width) / 2, (panelHeight - fontHeight) / 2 + ascentHeight);
                 if (i == 0) {
                     g2d.setStroke(new BasicStroke(2.0f));
                     g2d.drawLine(0, panelHeight - 1, eachWidth, panelHeight - 1);
diff --git a/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/DownMenuStyleDefinePane.java b/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/DownMenuStyleDefinePane.java
index 70499f302..ff76e5fed 100644
--- a/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/DownMenuStyleDefinePane.java
+++ b/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/DownMenuStyleDefinePane.java
@@ -163,8 +163,8 @@ public class DownMenuStyleDefinePane extends StyleDefinePaneWithSelectConf {
             for (int i = 0; i < cardTagLayout.getWidgetCount(); i++) {
                 g2d.setColor(i == 0 ? selectFontColor : frFont.getForeground());
                 CardSwitchButton cardSwitchButton = cardTagLayout.getSwitchButton(i);
-                String widgetName = cardSwitchButton.getText();
-                int width = fm.stringWidth(widgetName);
+                String displayName = calculateDisplayName(cardSwitchButton.getText(), fm, eachWidth);
+                int width = fm.stringWidth(displayName);
                 if(i == 0){
                     Color oldColor = g2d.getColor();
                     g2d.setColor(this.getSelectColor());
@@ -173,7 +173,7 @@ public class DownMenuStyleDefinePane extends StyleDefinePaneWithSelectConf {
                 }
                 Icon icon = new Icon(PAINT_ICON, ICON_PATH);
                 g2d.drawImage(IconManager.getIconManager().getDefaultIconImage(icon), (eachWidth - ICON_OFFSET) / 2, (panelHeight - ICON_OFFSET - GAP - fontHeight) / 2, null);
-                g2d.drawString(widgetName, (eachWidth - width) / 2, (panelHeight + ICON_OFFSET + GAP - fontHeight) / 2  + ascent);
+                g2d.drawString(displayName, (eachWidth - width) / 2, (panelHeight + ICON_OFFSET + GAP - fontHeight) / 2  + ascent);
                 Stroke oldStroke = g2d.getStroke();
                 if (splitLine.getLineStyle() != 0) {
                     g2d.setColor(splitLine.getColor());
diff --git a/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/UpMenuStyleDefinePane.java b/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/UpMenuStyleDefinePane.java
index ddd4c202d..be8ff823a 100644
--- a/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/UpMenuStyleDefinePane.java
+++ b/designer-base/src/main/java/com/fr/design/mainframe/mobile/ui/UpMenuStyleDefinePane.java
@@ -188,15 +188,15 @@ public class UpMenuStyleDefinePane extends StyleDefinePaneWithSelectConf {
             for (int i = 0; i < cardTagLayout.getWidgetCount(); i++) {
                 g2d.setColor(i == 0 ? selectFontColor : frFont.getForeground());
                 CardSwitchButton cardSwitchButton = cardTagLayout.getSwitchButton(i);
-                String widgetName = cardSwitchButton.getText();
-                int width = fm.stringWidth(widgetName);
+                String displayName = calculateDisplayName(cardSwitchButton.getText(), fm, eachWidth);
+                int width = fm.stringWidth(displayName);
                 if(i == 0){
                     Color oldColor = g2d.getColor();
                     g2d.setColor(this.getSelectColor());
                     g2d.fillRect(0, 0 ,eachWidth, panelHeight - 2);
                     g2d.setColor(oldColor);
                 }
-                g2d.drawString(widgetName, (eachWidth - width) / 2, (panelHeight - fontHeight) / 2 + ascentHeight);
+                g2d.drawString(displayName, (eachWidth - width) / 2, (panelHeight - fontHeight) / 2 + ascentHeight);
                 Stroke oldStroke = g2d.getStroke();
                 if (i == 0) {
                     g2d.setColor(this.underLine.getColor());
diff --git a/designer-base/src/main/java/com/fr/design/mainframe/widget/preview/MobileTemplatePreviewPane.java b/designer-base/src/main/java/com/fr/design/mainframe/widget/preview/MobileTemplatePreviewPane.java
index d5ddbb6b9..73f09f04e 100644
--- a/designer-base/src/main/java/com/fr/design/mainframe/widget/preview/MobileTemplatePreviewPane.java
+++ b/designer-base/src/main/java/com/fr/design/mainframe/widget/preview/MobileTemplatePreviewPane.java
@@ -5,6 +5,7 @@ import com.fr.general.cardtag.mobile.TabFontConfig;
 
 import javax.swing.JPanel;
 import java.awt.Color;
+import java.awt.FontMetrics;
 
 public abstract class MobileTemplatePreviewPane extends JPanel {
     private Color initialColor;
@@ -35,18 +36,32 @@ public abstract class MobileTemplatePreviewPane extends JPanel {
         this.tabFontConfig = tabFontConfig;
     }
 
-    public MobileTemplatePreviewPane(){
+    public MobileTemplatePreviewPane() {
 
     }
 
-    public void populateConfig(MobileTemplateStyle templateStyle){
+    public void populateConfig(MobileTemplateStyle templateStyle) {
         this.setInitialColor(templateStyle.getInitialColor());
         this.setBackground(templateStyle.getInitialColor());
         this.setSelectColor(templateStyle.getSelectColor());
         this.setTabFontConfig(templateStyle.getTabFontConfig());
     }
 
-    public void repaint (){
+    protected String calculateDisplayName(String widgetName, FontMetrics fm, int eachWidth) {
+        StringBuffer buffer = new StringBuffer();
+        String result;
+        for (int i = 0; i < widgetName.length(); i++) {
+            result = buffer.toString();
+            buffer.append(widgetName.charAt(i));
+            if (fm.stringWidth(buffer.toString()) > eachWidth) {
+                return result;
+            }
+        }
+        return buffer.toString();
+
+    }
+
+    public void repaint() {
         super.repaint();
     }