Pull request #4862: REPORT-53175【10.0.18】组件背景分离为标题/背景/边框

Merge in DESIGN/design from ~STARRYI/design:feature/10.0 to feature/10.0 * commit '56b32280f38684e44d1fb6a7345c5582799ec4b9': REPORT-53175【10.0.18】组件背景分离为标题/背景/边框 REPORT-53175【10.0.18】组件背景分离为标题/背景/边框 REPORT-53175【10.0.18】组件背景分离为标题/背景/边框 CHART-19720 控件顺序反了
3 years ago · 602a2df0f9
14 changed files with 274 additions and 49 deletions
--- a/designer-base/src/main/java/com/fr/design/border/UIRoundedBorder.java
+++ b/designer-base/src/main/java/com/fr/design/border/UIRoundedBorder.java
@ -1,32 +1,33 @@
 package com.fr.design.border;

 import com.fr.base.GraphHelper;
+import com.fr.stable.GraphDrawHelper;

 import javax.swing.border.LineBorder;
-import java.awt.Color;
-import java.awt.Component;
-import java.awt.Graphics;
-import java.awt.Graphics2D;
-import java.awt.RenderingHints;
+import java.awt.*;
 import java.awt.geom.RoundRectangle2D;

 public class UIRoundedBorder extends LineBorder {

 	private static final long serialVersionUID = 1L;

+	private BasicStroke stroke4Thickness;
 	private int roundedCorner;
 	private int lineStyle;

 	public UIRoundedBorder(Color color) {
 		super(color);
+		this.stroke4Thickness = new BasicStroke(thickness, BasicStroke.CAP_BUTT, BasicStroke.JOIN_MITER);
 	}

 	public UIRoundedBorder(Color color, int thickness){
 		super(color, thickness);
+		this.stroke4Thickness = new BasicStroke(thickness, BasicStroke.CAP_BUTT, BasicStroke.JOIN_MITER);
 	}

 	public UIRoundedBorder(Color color, int thickness, int roundedCorners){
 		super(color, thickness, true);
+		this.stroke4Thickness = new BasicStroke(thickness, BasicStroke.CAP_BUTT, BasicStroke.JOIN_MITER);
 		this.roundedCorner = roundedCorners;
 	}

@ -51,7 +52,19 @@ public class UIRoundedBorder extends LineBorder {
        Graphics2D g2d = (Graphics2D)g;
        g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
        g2d.setColor(lineColor);
-		GraphHelper.draw(g2d, new RoundRectangle2D.Double(x, y, width - 1.0D, height - 1.0D, roundedCorner, roundedCorner), lineStyle);
+
+        Shape shape = new RoundRectangle2D.Double(x, y, width - 1.0D, height - 1.0D, roundedCorner, roundedCorner);
+
+        if (stroke4Thickness != null) {
+			Stroke oldStroke = g2d.getStroke();
+			g2d.setStroke(stroke4Thickness);
+			g2d.draw(shape);
+
+			g2d.setStroke(oldStroke);
+		} else {
+			GraphHelper.draw(g2d, shape, lineStyle);
+		}
+
        g2d.setColor(oldColor);
        g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_OFF);
 	}
--- a/designer-form/src/main/java/com/fr/design/designer/beans/location/AccessDirection.java
+++ b/designer-form/src/main/java/com/fr/design/designer/beans/location/AccessDirection.java
@ -195,8 +195,11 @@ public abstract class AccessDirection implements Direction {
 		if (type != formEditor.getCursor().getType()) {
 			// 设置当前形状
 			formEditor.setCursor(Cursor.getPredefinedCursor(type));
+
+			FormSelection selection = formEditor.getSelectionModel().getSelection();
+            boolean canLockAspectRatioOnlyByShift = !selection.isCreatorAspectRatioLockedInAbsLayout(formEditor) && selection.isCreatorInAbsLayout(formEditor);
            ServerPreferenceConfig config = ServerPreferenceConfig.getInstance();
-            if (!config.isHasShownLockedAspectRatioResizingToolTip()) {
+            if (canLockAspectRatioOnlyByShift && !config.isHasShownLockedAspectRatioResizingToolTip()) {
                formEditor.setToolTipText(getTooltip());
                config.setHasShownLockedAspectRatioResizingToolTip(true);
            }
--- a/designer-form/src/main/java/com/fr/design/designer/beans/models/StateModel.java
+++ b/designer-form/src/main/java/com/fr/design/designer/beans/models/StateModel.java
@ -15,6 +15,7 @@ import com.fr.design.designer.creator.XLayoutContainer;
 import com.fr.design.designer.creator.XWAbsoluteBodyLayout;
 import com.fr.design.designer.creator.XWAbsoluteLayout;
 import com.fr.design.mainframe.FormDesigner;
+import com.fr.design.mainframe.FormSelection;
 import com.fr.design.mainframe.FormSelectionUtils;
 import com.fr.design.utils.ComponentUtils;

@ -486,12 +487,14 @@ public class StateModel {
    public void dragging(MouseEvent e) {
        //进入dragging状态时备份组件大小和位置
        if (!dragging) {
-            this.aspectRatioLocked = this.selectionModel.getSelection().isCreatorAspectRatioLockedInAbsLayout(designer);
            selectedPositionBackup = selectionModel.getSelection().getRelativeBounds();
        }
        checkAddable(e);
        setDependLinePainter(e);
-        this.aspectRatioLocked = this.aspectRatioLocked || e.isShiftDown();
+
+        FormSelection selection = this.selectionModel.getSelection();
+        this.aspectRatioLocked = selection.isCreatorAspectRatioLockedInAbsLayout(designer)  ||
+                (this.selectionModel.getSelection().isCreatorInAbsLayout(designer) && e.isShiftDown());
        driection.drag(getMouseXY(e).x - currentX, getMouseXY(e).y - currentY, designer);
        this.dragging = true;
    }
--- a/designer-form/src/main/java/com/fr/design/designer/creator/XBorderStyleWidgetCreator.java
+++ b/designer-form/src/main/java/com/fr/design/designer/creator/XBorderStyleWidgetCreator.java
@ -11,6 +11,7 @@ import com.fr.form.ui.Widget;
 import com.fr.form.ui.WidgetTitle;
 import com.fr.form.ui.WidgetValue;
 import com.fr.form.ui.container.WTitleLayout;
+import com.fr.general.Background;
 import com.fr.general.ComparatorUtils;
 import com.fr.general.act.BorderPacker;
 import com.fr.general.act.TitlePacker;
@ -18,7 +19,11 @@ import com.fr.stable.Constants;
 import com.fr.stable.StringUtils;

 import javax.swing.*;
+import javax.swing.border.Border;
+import javax.swing.border.LineBorder;
 import java.awt.*;
+import java.awt.geom.Rectangle2D;
+import java.awt.geom.RoundRectangle2D;

 /**
 * Created with IntelliJ IDEA.
@ -29,6 +34,7 @@ import java.awt.*;

 public class XBorderStyleWidgetCreator extends XWidgetCreator{
 	protected static final Dimension BORDER_PREFERRED_SIZE = new Dimension(250, 150);
+	protected Background background4Painting;	// 设计器预览界面中绘制组件背景图

    public XBorderStyleWidgetCreator(Widget widget, Dimension initSize) {
        super(widget, initSize);
@ -38,8 +44,17 @@ public class XBorderStyleWidgetCreator extends XWidgetCreator{
 			this.setShareId(sharableAttrMark.getShareId());
 		}
    }
-    
-    /**
+
+	public Background getBackground4Painting() {
+		return this.background4Painting;
+	}
+
+	public void setBackground4Painting(Background background4Painting) {
+		this.background4Painting = background4Painting;
+		this.repaint();
+	}
+
+	/**
 	 * 返回容器对应的widget
 	 * @return 同上
 	 */
@ -58,22 +73,37 @@ public class XBorderStyleWidgetCreator extends XWidgetCreator{

 	protected void initStyle() {
    	BorderPacker style = toData().getBorderStyle();
-     	initBorderStyle();
+     	initBorderAndBackgroundStyle();
        if (ComparatorUtils.equals(style.getType(), LayoutBorderStyle.TITLE)) {
          	initTitleStyle(style);
        } else {
        	clearTitleWidget();
         }
+
+        // 编辑右侧栏组件样式面板后，重新调整组件/标题/边框的显示效果
+		reshuffleBorderAndBackgroundPaintingEffectIfTitleExists();
     }

-  // 边框默认值设为NONE,不然像scalelayout这种只用默认边框的会不显示边框
-    protected void initBorderStyle() {
+    protected void initBorderAndBackgroundStyle() {
    	BorderPacker style = toData().getBorderStyle();
-        if (style != null && style.getBorder() != Constants.LINE_NONE) {
-            this.setBorder(new UIRoundedBorder(style.getBorder(), style.getColor(), style.getBorderRadius()));
-        } else {
-            this.setBorder(DEFALUTBORDER);
+		LineBorder DEFAULT_LINE_BORDER = (LineBorder) DEFALUTBORDER;
+
+		// 边框默认值设为NONE,不然像scalelayout这种只用默认边框的会不显示边框
+		Border border = DEFAULT_LINE_BORDER;
+        if (style != null) {
+        	int radius = style.getBorderRadius();	// 不管有无边框线, 圆角裁剪总是生效
+        	if (style.getBorder() != Constants.LINE_NONE) {
+        		// 设置了边框线
+        		border = new UIRoundedBorder(style.getBorder(), style.getColor(), radius);
+			} else {
+        		// 为设置边框线
+				border = new UIRoundedBorder(DEFAULT_LINE_BORDER.getLineColor(), DEFAULT_LINE_BORDER.getThickness(), radius);
+			}
        }
+
+		this.setBorder(border);
+
+		this.setBackground4Painting(style != null ? style.getBackground() : null);
    }
    
    private void clearTitleWidget() {
@ -143,6 +173,75 @@ public class XBorderStyleWidgetCreator extends XWidgetCreator{
    	return new WidgetValue(value);
    }

+    // 如果存在标题栏，则需要重新弄调整边框和背景的显示效果，使得边框和背景的视觉效果出现在包含组件和标题的整体区域上，
+	// 而不是组件和标题各自出现独立的边框和背景，同时如存在标题栏，则标题栏下方还应有底部边框，作为标题和内容的分界线
+    protected void reshuffleBorderAndBackgroundPaintingEffectIfTitleExists() {
+    	Container parent = this.getParent();
+    	if (parent instanceof XWTitleLayout) {
+			XWTitleLayout titleParent = (XWTitleLayout) parent;
+			if (parent.getComponentCount() > 1) {
+				XCreator titleCreator = titleParent.getTitleCreator();
+				XCreator bodyXCreator = titleParent.getBodyCreator();
+
+				Border border = bodyXCreator.getBorder();
+
+				titleParent.setBorder(border);								// 容器绘制完整边框
+				bodyXCreator.setBorder(BorderFactory.createEmptyBorder());	// body不绘制边框
+				titleCreator.setBorder(BorderFactory.createEmptyBorder());	// title绘制底部边框
+				if (border instanceof LineBorder) {
+					Color color = ((LineBorder) border).getLineColor();
+					int thickness = ((LineBorder) border).getThickness();
+					titleCreator.setBorder(new BottomLineBorder(color, thickness));
+				}
+
+				if (bodyXCreator instanceof XBorderStyleWidgetCreator) {
+					XBorderStyleWidgetCreator styledBodyXCreator = (XBorderStyleWidgetCreator) bodyXCreator;
+					Background background4Painting = styledBodyXCreator.getBackground4Painting();
+
+					styledBodyXCreator.setBackground4Painting(null);			// body不绘制背景
+					titleParent.setBackground4Painting(background4Painting);	// 容器绘制完整背景
+				}
+			}
+		}
+	}
+
+
+	// 根据当前组件边框裁剪内容，如果当前组件存在圆角，则应当按圆角裁剪内容
+	private void clipByRoundedBorder(Graphics2D g2d) {
+		Border currentBorder = getBorder();
+		if (currentBorder instanceof UIRoundedBorder) {
+			int thickness = ((UIRoundedBorder) currentBorder).getThickness();
+			int radius = ((UIRoundedBorder) currentBorder).getRoundedCorner();
+			int currentClipX = 0;
+			int currentClipY = 0;
+			int currentClipWidth = getWidth();
+			int currentClipHeight = getHeight();
+			int currentClipRadius = Math.max(radius - thickness, 0);	// 应沿着边框外围进行裁剪
+			g2d.clip(new RoundRectangle2D.Double(currentClipX, currentClipY, currentClipWidth, currentClipHeight, currentClipRadius, currentClipRadius));
+		}
+	}
+
+	// 设计器预览界面中绘制组件背景效果
+	private void paintBackground(Graphics2D g2d) {
+    	Background background4Painting = getBackground4Painting();
+		if (background4Painting != null) {
+			background4Painting.paint(g2d, new Rectangle2D.Double(0, 0, getWidth(), getHeight()));
+		}
+	}
+
+	@Override
+	protected void paintComponent(Graphics g) {
+		this.paintBackground((Graphics2D) g);
+		super.paintComponent(g);
+	}
+
+	@Override
+	public void paint(Graphics g) {
+    	this.clipByRoundedBorder((Graphics2D) g);
+		super.paint(g);
+    	paintBorder(g);
+	}
+
    @Override
    protected String getIconName() {
        return StringUtils.EMPTY;
@ -169,8 +268,33 @@ public class XBorderStyleWidgetCreator extends XWidgetCreator{
 	 * data属性改变触发其他操作
 	 *
 	 */
-	public void firePropertyChange(){
+	public void firePropertyChange() {

 	}
-    
+
+	// 适用于标题栏的底部边框
+	public static class BottomLineBorder extends LineBorder {
+
+		private BottomLineBorder(Color color, int thickness) {
+			super(color, thickness);
+		}
+
+		@Override
+		public void paintBorder(Component c, Graphics g, int x, int y, int width, int height) {
+			Graphics2D g2d = (Graphics2D)g;
+
+			Color oldColor = g2d.getColor();
+			Stroke oldStroke = g2d.getStroke();
+
+			g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
+
+			g2d.setColor(getLineColor());
+			g2d.setStroke(new BasicStroke(getThickness()));
+			g2d.drawLine(0, height, width, height);
+
+			g2d.setStroke(oldStroke);
+			g2d.setColor(oldColor);
+			g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_OFF);
+		}
+	}
 }
--- a/designer-form/src/main/java/com/fr/design/designer/creator/XChartEditor.java
+++ b/designer-form/src/main/java/com/fr/design/designer/creator/XChartEditor.java
@ -165,7 +165,7 @@ public class XChartEditor extends XBorderStyleWidgetCreator {
    @Override
    protected void initXCreatorProperties() {
        super.initXCreatorProperties();
-        initBorderStyle();
+        initBorderAndBackgroundStyle();
        BaseChartCollection collection = ((BaseChartEditor) data).getChartCollection();
        isRefreshing = true;
        ((MiddleChartComponent) designerEditor.getEditorTarget()).populate(collection);
--- a/designer-form/src/main/java/com/fr/design/designer/creator/XElementCase.java
+++ b/designer-form/src/main/java/com/fr/design/designer/creator/XElementCase.java
@ -57,7 +57,7 @@ public class XElementCase extends XBorderStyleWidgetCreator implements FormEleme
        super.initXCreatorProperties();

        // 报表块初始化时要加载对应的borderStyle
-        initBorderStyle();
+        initBorderAndBackgroundStyle();
    }

    /**
--- a/designer-form/src/main/java/com/fr/design/designer/creator/XLayoutContainer.java
+++ b/designer-form/src/main/java/com/fr/design/designer/creator/XLayoutContainer.java
@ -118,7 +118,7 @@ public abstract class XLayoutContainer extends XBorderStyleWidgetCreator impleme
    @Override
    protected void initXCreatorProperties() {
        super.initXCreatorProperties();
-        initBorderStyle();
+        initBorderAndBackgroundStyle();
        this.initLayoutManager();
        this.convert();
    }
--- a/designer-form/src/main/java/com/fr/design/designer/creator/XWAbsoluteBodyLayout.java
+++ b/designer-form/src/main/java/com/fr/design/designer/creator/XWAbsoluteBodyLayout.java
@ -106,7 +106,7 @@ public class XWAbsoluteBodyLayout extends XWAbsoluteLayout {

    @Override
    protected void initStyle() {
-        initBorderStyle();
+        initBorderAndBackgroundStyle();
    }

    /**
--- a/designer-form/src/main/java/com/fr/design/designer/creator/XWTitleLayout.java
+++ b/designer-form/src/main/java/com/fr/design/designer/creator/XWTitleLayout.java
@ -10,10 +10,9 @@ import com.fr.design.fun.WidgetPropertyUIProvider;
 import com.fr.form.ui.Label;
 import com.fr.form.ui.Widget;
 import com.fr.form.ui.WidgetTitle;
+import com.fr.form.ui.container.WAbsoluteLayout.BoundsWidget;
 import com.fr.form.ui.container.WTitleLayout;
 import com.fr.general.ComparatorUtils;
-import com.fr.form.ui.container.WAbsoluteLayout.BoundsWidget;
-import com.fr.stable.StringUtils;

 import java.awt.*;
 import java.awt.event.ContainerEvent;
@ -46,6 +45,17 @@ public class XWTitleLayout extends DedicateLayoutContainer {
 		super(widget, initSize);
 	}

+	@Override
+	protected void initXCreatorProperties() {
+		super.initXCreatorProperties();
+
+		// 初始化后（如打开旧模版)，需要重新调整组件/标题/边框的显示效果
+		XCreator xCreator = getBodyCreator();
+		if (xCreator instanceof XBorderStyleWidgetCreator) {
+			((XBorderStyleWidgetCreator) xCreator).reshuffleBorderAndBackgroundPaintingEffectIfTitleExists();
+		}
+	}
+
 	/**
 	 * 初始化容器对应的布局 由于是只装一个需要保持原样高度的控件，布局设为absolute
 	 */
--- a/designer-form/src/main/java/com/fr/design/designer/creator/cardlayout/XWCardLayout.java
+++ b/designer-form/src/main/java/com/fr/design/designer/creator/cardlayout/XWCardLayout.java
@ -400,7 +400,7 @@ public class XWCardLayout extends XLayoutContainer {
    protected void initStyle() {
        BorderPacker style = toData().getBorderStyle();
        initBorderTitleStyle(style);
-        initBorderStyle();
+        initBorderAndBackgroundStyle();
        clearOrShowTitleLayout(ComparatorUtils.equals(style.getType(), LayoutBorderStyle.TITLE));
    }

--- a/designer-form/src/main/java/com/fr/design/gui/xpane/BorderLineAndImagePane.java
+++ b/designer-form/src/main/java/com/fr/design/gui/xpane/BorderLineAndImagePane.java
@ -5,6 +5,7 @@ import com.fr.base.Style;
 import com.fr.base.Utils;
 import com.fr.base.background.ImageBackground;
 import com.fr.base.background.ImageFileBackground;
+import com.fr.config.ServerPreferenceConfig;
 import com.fr.design.border.UIRoundedBorder;
 import com.fr.design.constants.UIConstants;
 import com.fr.design.designer.IntervalConstants;
@ -20,7 +21,6 @@ import com.fr.design.gui.ibutton.UIButtonUI;
 import com.fr.design.gui.ibutton.UIColorButton;
 import com.fr.design.gui.icombobox.LineComboBox;
 import com.fr.design.gui.ilable.UILabel;
-import com.fr.design.gui.itooltip.UIToolTip;
 import com.fr.design.layout.FRGUIPaneFactory;
 import com.fr.design.layout.TableLayout;
 import com.fr.design.layout.TableLayoutHelper;
@ -32,7 +32,10 @@ import com.fr.general.Background;
 import com.fr.general.IOUtils;
 import com.fr.stable.Constants;
 import com.fr.stable.GraphDrawHelper;
+import com.fr.stable.ProjectLibrary;
+import com.fr.stable.StableUtils;
 import com.fr.stable.StringUtils;
+import com.fr.stable.project.ProjectConstants;

 import javax.swing.*;
 import javax.swing.event.ChangeEvent;
@ -46,6 +49,7 @@ import java.awt.event.MouseListener;
 import java.awt.event.MouseMotionListener;
 import java.awt.geom.RoundRectangle2D;
 import java.awt.image.BufferedImage;
+import java.io.File;
 import java.io.IOException;
 import java.net.URI;
 import java.net.URISyntaxException;
@ -174,6 +178,20 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
        }
    }

+    private void initImageFileChooserDirectory() {
+        ServerPreferenceConfig config = ServerPreferenceConfig.getInstance();
+        String lastUsedBorderImagesDirPath = config.getLastUsedBorderImagesDir();
+        File lastUsedBorderImagesDir = StringUtils.isNotEmpty(lastUsedBorderImagesDirPath) ? new File(lastUsedBorderImagesDirPath) : null;
+
+        File inbuiltBorderImagesDir = new File(StableUtils.pathJoin(ProjectLibrary.getInstance().getLibHome(), ProjectConstants.ASSETS_NAME, "border_images"));
+
+        if (lastUsedBorderImagesDir!= null && lastUsedBorderImagesDir.exists()) {
+            imageFileChooser.setCurrentDirectory(lastUsedBorderImagesDir);
+        } else if (inbuiltBorderImagesDir.exists()) {
+            imageFileChooser.setCurrentDirectory(inbuiltBorderImagesDir);
+        }
+    }
+
    protected void initNinePointTweakPaneIfNotExist() {
        if (tweakPane == null) {
            tweakPane = new NinePointImageTweakDialogPane();
@ -210,8 +228,15 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
            @Override
            public void actionPerformed(ActionEvent e) {
                initImageFileChooserIfNotExist();
-
+                initImageFileChooserDirectory();
                int returnVal = imageFileChooser.showOpenDialog(DesignerContext.getDesignerFrame());
+
+                if (returnVal == JFileChooser.APPROVE_OPTION) {
+                    ServerPreferenceConfig config = ServerPreferenceConfig.getInstance();
+                    File selectedDirectory = imageFileChooser.getSelectedFile().getParentFile();
+                    config.setLastUsedBorderImagesDir(selectedDirectory.getPath());
+                }
+
                ImgChooseWrapper.getInstance(imagePreviewPane, imageFileChooser, DEFAULT_IMAGE_LAYOUT_STYLE, new ChangeListener() {
                    @Override
                    public void stateChanged(ChangeEvent e) {
--- a/designer-form/src/main/java/com/fr/design/mainframe/FormSelection.java
+++ b/designer-form/src/main/java/com/fr/design/mainframe/FormSelection.java
@ -303,6 +303,16 @@ public class FormSelection {
        return false;
    }

+    public boolean isCreatorInAbsLayout(FormDesigner designer) {
+        for (XCreator creator : selection) {
+            LayoutAdapter layoutAdapter = AdapterBus.searchLayoutAdapter(designer, creator);
+            if (layoutAdapter instanceof FRAbsoluteLayoutAdapter) {
+                return true;
+            }
+        }
+        return false;
+    }
+
    /**
     * @Description 重置报表块缩略图
     * @param: creator
--- a/designer-form/src/main/java/com/fr/design/widget/ui/designer/component/WidgetAbsoluteBoundPane.java
+++ b/designer-form/src/main/java/com/fr/design/widget/ui/designer/component/WidgetAbsoluteBoundPane.java
@ -29,11 +29,12 @@ public class WidgetAbsoluteBoundPane extends WidgetBoundPane {
        y = new UIBoundSpinner(0, Integer.MAX_VALUE, 1, 0d);
        width = new UIBoundSpinner(0, Integer.MAX_VALUE, 1, 0d);
        height = new UIBoundSpinner(0, Integer.MAX_VALUE, 1, 0d);
-        ratioLockedButton = new AspectRatioLockedButton(width, height, creator);
+        ratioLockedButton = new AspectRatioLockedButton(width, height);
        x.setGlobalName(com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Form_Coords_And_Size"));
        y.setGlobalName(com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Form_Coords_And_Size"));
        width.setGlobalName(com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Form_Coords_And_Size"));
        height.setGlobalName(com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Form_Coords_And_Size"));
+        ratioLockedButton.setGlobalName(com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Form_Coords_And_Size"));
        this.add(WidgetBoundsPaneFactory.createAbsoluteBoundsPane(x, y, width, height, ratioLockedButton, WidgetBoundsPaneFactory.NameAttribute.WIDGET));
    }

--- a/designer-form/src/main/java/com/fr/design/widget/ui/designer/component/WidgetBoundPane.java
+++ b/designer-form/src/main/java/com/fr/design/widget/ui/designer/component/WidgetBoundPane.java
@ -11,8 +11,11 @@ import com.fr.design.designer.creator.cardlayout.XWCardLayout;
 import com.fr.design.designer.creator.cardlayout.XWCardTagLayout;
 import com.fr.design.dialog.BasicPane;
 import com.fr.design.dialog.FineJOptionPane;
+import com.fr.design.event.GlobalNameListener;
+import com.fr.design.event.GlobalNameObserver;
+import com.fr.design.event.UIObserver;
+import com.fr.design.event.UIObserverListener;
 import com.fr.design.file.HistoryTemplateListCache;
-import com.fr.design.gui.ibutton.UIButton;
 import com.fr.design.gui.ispinner.UISpinner;
 import com.fr.design.layout.FRGUIPaneFactory;
 import com.fr.design.mainframe.FormDesigner;
@ -81,7 +84,8 @@ public class WidgetBoundPane extends BasicPane {

        JTemplate jTemplate = HistoryTemplateListCache.getInstance().getCurrentEditingTemplate();
        if (jTemplate.isJWorkBook() || !((JForm)jTemplate).isSelectRootPane()) {
-            ratioLockedButton = new AspectRatioLockedButton(width, height, creator);
+            ratioLockedButton = new AspectRatioLockedButton(width, height);
+            ratioLockedButton.setGlobalName(i18nText("Fine-Design_Form_Coords_And_Size"));
            ratioLockedButton.setLockEnabled(false);
        }

@ -121,7 +125,7 @@ public class WidgetBoundPane extends BasicPane {
            limitHeight(wabs, h, bounds, rec);
        }
        if (ratioLockedButton != null) {
-            ratioLockedButton.setLocked(creator.toData().isAspectRatioLocked());
+            ratioLockedButton.update(creator);
        }
    }

@ -191,21 +195,24 @@ public class WidgetBoundPane extends BasicPane {

    }

-    protected static class AspectRatioLockedButton extends UIButton {
+    protected static class AspectRatioLockedButton extends JButton implements UIObserver, GlobalNameObserver {

        private final Icon enabledLocked = IOUtils.readIcon("/com/fr/design/images/buttonicon/icon_lock_enabled.png");
        private final Icon disabledLocked = IOUtils.readIcon("/com/fr/design/images/buttonicon/icon_lock_disabled.png");
        private final Icon enabledUnLocked = IOUtils.readIcon("/com/fr/design/images/buttonicon/icon_unlock_enabled.png");
        private final Icon disabledUnLocked = IOUtils.readIcon("/com/fr/design/images/buttonicon/icon_unlock_disabled.png");

-        private UISpinner mWidthSpinner;
-        private UISpinner mHeightSpinner;
-        private XCreator mCreator;
+        private UIObserverListener uiObserverListener;
+        private GlobalNameListener globalNameListener;
+        private String globalName = null;
+
+        private final UISpinner mWidthSpinner;
+        private final UISpinner mHeightSpinner;

        protected double width4Backup = 0;
        protected double height4Backup = 0;

-        public AspectRatioLockedButton(UISpinner widthSpinner, UISpinner heightSpinner, XCreator creator) {
+        public AspectRatioLockedButton(UISpinner widthSpinner, UISpinner heightSpinner) {
            setUI(new BasicButtonUI());
            setBorderPainted(false);
            setBorder(null);
@ -214,25 +221,25 @@ public class WidgetBoundPane extends BasicPane {

            this.mWidthSpinner = widthSpinner;
            this.mHeightSpinner = heightSpinner;
-            this.mCreator = creator;

            addActionListener(new ActionListener() {
                @Override
                public void actionPerformed(ActionEvent e) {
-                    setSelected(!isSelected());
-                }
-            });
-            addChangeListener(new ChangeListener() {
-                @Override
-                public void stateChanged(ChangeEvent e) {
-                    mCreator.toData().setAspectRatioLocked(isLocked());
-
-                    setToolTipText(isLockEnabled() ? null : i18nText("Fine-Design_Form_Widget_Lock_Aspect_Ratio_Button_ToolTip"));
+                    // 改变图标icon
+                    setLocked(!isLocked());

                    if (isLocked() && isLockEnabled()) {
                        width4Backup = mWidthSpinner.getValue();
                        height4Backup = mHeightSpinner.getValue();
                    }
+
+                    if (globalNameListener != null) {
+                        globalNameListener.setGlobalName(globalName);
+                    }
+
+                    if (uiObserverListener != null) {
+                        uiObserverListener.doChange();
+                    }
                }
            });

@ -285,15 +292,44 @@ public class WidgetBoundPane extends BasicPane {

        public void setLockEnabled(boolean enabled) {
            this.setEnabled(enabled);
+            setToolTipText(isLockEnabled() ? null : i18nText("Fine-Design_Form_Widget_Lock_Aspect_Ratio_Button_ToolTip"));
        }

        public void populate(XCreator creator) {
            Rectangle bounds = new Rectangle(creator.getBounds());
-            mCreator = creator;
            width4Backup = bounds.width;
            height4Backup = bounds.height;
            Widget widget = creator.toData();
            setLocked(widget.isAspectRatioLocked());
        }
+
+        public void update(XCreator creator) {
+            creator.toData().setAspectRatioLocked(this.isLocked());
+        }
+
+        @Override
+        public void registerChangeListener(UIObserverListener listener) {
+            uiObserverListener = listener;
+        }
+
+        @Override
+        public boolean shouldResponseChangeListener() {
+            return true;
+        }
+
+        @Override
+        public void registerNameListener(GlobalNameListener listener) {
+            this.globalNameListener = listener;
+        }
+
+        @Override
+        public boolean shouldResponseNameListener() {
+            return true;
+        }
+
+        @Override
+        public void setGlobalName(String name) {
+            this.globalName = name;
+        }
    }
 }