Pull request #4911: REPORT-53175【10.0.18】组件背景分离为标题/背景/边框 & REPORT-55090 & REPORT-55071 & REPORT-55089

Merge in DESIGN/design from ~STARRYI/design:feature/10.0 to feature/10.0

* commit '43efd3c46f5b152362ffdb70f5b68abb704054fa':
  REPORT-53175【10.0.18】组件背景分离为标题/背景/边框
  REPORT-55090【组件背景分离】组件复用-标题图案的图片预览图，和交互文档里定的悬浮时出现删除按钮和不透明遮罩预期效果不同
  REPORT-55071 【组件背景分离】组件复用-标题填充选择渐变色时，设置面板出现纵向滚动条，遮挡住了渐变色右侧颜色选择按钮
  REPORT-55089 组件背景分离】组件复用-现在锁按钮在宽高值之间，锁定时，拖拽调整组件大小时，宽度值会变化成一个很长的小数

designer-base/src/main/java/com/fr/design/gui/style/BackgroundSpecialPane.java

@@ -39,7 +39,7 @@ public class BackgroundSpecialPane extends BackgroundPane{
                 fireStateChanged();
             }
         });
-        GradientBackgroundQuickPane gradientPane = new GradientBackgroundQuickPane();
+        GradientBackgroundQuickPane gradientPane = createGradientBackgroundQuickPane();
         gradientPane.registerChangeListener(new UIObserverListener() {
             @Override
             public void doChange() {
@@ -68,4 +68,9 @@ public class BackgroundSpecialPane extends BackgroundPane{
 
         return kinds.toArray(new BackgroundQuickPane[kinds.size()]);
     }
+
+    protected GradientBackgroundQuickPane createGradientBackgroundQuickPane() {
+        // 使用默认的150宽度构建渐变条
+        return new GradientBackgroundQuickPane();
+    }
 }

designer-form/src/main/java/com/fr/design/designer/creator/XWAbsoluteLayout.java

@@ -203,6 +203,10 @@ public class XWAbsoluteLayout extends XLayoutContainer {
             double percentH = ((double) backupBound.height / (double) currentBound.height);
             for (int index = 0, n = this.getComponentCount(); index < n; index++) {
                 XCreator creator = (XCreator) this.getComponent(index);
+                if (creator.toData().isAspectRatioLocked()) {
+                    double percent = Math.min(percentW, percentH);
+                    percentW = percentH = percent;
+                }
                 BoundsWidget wgt = (BoundsWidget) layout.getBoundsWidget(creator.toData());
                 // 用当前的显示大小计算后调正具体位置
                 Rectangle wgtBound = creator.getBounds();

designer-form/src/main/java/com/fr/design/gui/xpane/BorderLineAndImagePane.java

@@ -62,7 +62,7 @@ import java.net.URISyntaxException;
  * 可配置图片类型边框的样式设置面板
  */
 public class BorderLineAndImagePane extends JPanel implements UIObserver {
-    private final int SETTING_LABEL_WIDTH = 60;
+    private final int SETTING_LABEL_WIDTH = LayoutStylePane.SETTING_LABEL_WIDTH;
     private final Style DEFAULT_IMAGE_LAYOUT_STYLE = Style.DEFAULT_STYLE.deriveImageLayout(Constants.IMAGE_DEFAULT);
     private final String TWEAK_NINE_POINT_HELP_URL = "";
 

designer-form/src/main/java/com/fr/design/gui/xpane/LayoutStylePane.java

@@ -24,6 +24,7 @@ import com.fr.design.layout.TableLayout;
 import com.fr.design.layout.TableLayoutHelper;
 import com.fr.design.mainframe.JForm;
 import com.fr.design.mainframe.JTemplate;
+import com.fr.design.mainframe.backgroundpane.GradientBackgroundQuickPane;
 import com.fr.form.ui.LayoutBorderStyle;
 import com.fr.form.ui.WidgetTitle;
 import com.fr.general.Background;
@@ -51,7 +52,7 @@ public class LayoutStylePane extends BasicBeanPane<LayoutBorderStyle> {
             com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Form_Widget_Style_Shadow")
     };
     private static final Dimension BUTTON_SIZE = new Dimension(20, 20);
-    private static final int SETTING_LABEL_WIDTH = 60;
+    public static final int SETTING_LABEL_WIDTH = 60;
 
     protected LayoutBorderStyle style = new LayoutBorderStyle();
 
@@ -124,7 +125,7 @@ public class LayoutStylePane extends BasicBeanPane<LayoutBorderStyle> {
         borderStyleCombo = new UIComboBox(BORDER_STYLE);
         borderLineAndImagePane = new BorderLineAndImagePane();
         cornerSpinner = new UISpinner(0,1000,1,0);
-        backgroundPane = new BackgroundSpecialPane();
+        backgroundPane = new LayoutBackgroundSpecialPane();
         backgroundOpacityPane = new UIPercentDragPane();
     }
 
@@ -229,7 +230,7 @@ public class LayoutStylePane extends BasicBeanPane<LayoutBorderStyle> {
                         com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Form_StyleAlignment_Right")
                 });
 
-        titleBackgroundPane = new BackgroundSpecialPane();
+        titleBackgroundPane = new LayoutBackgroundSpecialPane();
 
         titleBackgroundOpacityPane = new UIPercentDragPane();
     }
@@ -499,4 +500,11 @@ public class LayoutStylePane extends BasicBeanPane<LayoutBorderStyle> {
             g2d.setColor(oldColor);
         }
     }
+
+    protected static class LayoutBackgroundSpecialPane extends BackgroundSpecialPane {
+        @Override
+        protected GradientBackgroundQuickPane createGradientBackgroundQuickPane() {
+            return new GradientBackgroundQuickPane(140);
+        }
+    }
 }

designer-form/src/main/java/com/fr/design/gui/xpane/TitleInsetImagePane.java

@@ -33,6 +33,10 @@ import javax.swing.plaf.basic.BasicButtonUI;
 import java.awt.*;
 import java.awt.event.ActionEvent;
 import java.awt.event.ActionListener;
+import java.awt.event.MouseAdapter;
+import java.awt.event.MouseEvent;
+import java.awt.event.MouseListener;
+import java.awt.geom.RoundRectangle2D;
 
 /**
  * @author Starryi
@@ -40,7 +44,7 @@ import java.awt.event.ActionListener;
  * Created by Starryi on 2021/7/3
  */
 public class TitleInsetImagePane extends JPanel implements UIObserver {
-    private final int SETTING_LABEL_WIDTH = 60;
+    private final int SETTING_LABEL_WIDTH = LayoutStylePane.SETTING_LABEL_WIDTH;
     private final int DELETE_BUTTON_SIZE = 24;
     private final int IMAGE_PREVIEW_SIZE = 145;
     private final Style DEFAULT_IMAGE_LAYOUT_STYLE = Style.DEFAULT_STYLE.deriveImageLayout(Constants.IMAGE_DEFAULT);
@@ -89,6 +93,28 @@ public class TitleInsetImagePane extends JPanel implements UIObserver {
         deletableImagePreviewPane.add(imageDeleteButton, 0);
         deletableImagePreviewPane.add(imagePreviewPane, 1);
 
+        imageDeleteButton.setVisible(false);
+        imageDeleteButton.setEnabled(false);
+        deletableImagePreviewPane.addMouseListener(new MouseAdapter() {
+            @Override
+            public void mouseEntered(MouseEvent e) {
+                super.mouseEntered(e);
+                imageDeleteButton.setVisible(true);
+                imageDeleteButton.setEnabled(true);
+            }
+
+            @Override
+            public void mouseExited(MouseEvent e) {
+                super.mouseExited(e);
+                int x = e.getX();
+                int y = e.getY();
+                if (x <= 0 || getWidth() <= x || y <= 0 || y >= getHeight()) {
+                    imageDeleteButton.setVisible(false);
+                    imageDeleteButton.setEnabled(false);
+                }
+            }
+        });
+
         return TableLayoutHelper.createCommonTableLayoutPane(
                 new JComponent[][]{
                         {null, deletableImagePreviewPane},
@@ -110,15 +136,11 @@ public class TitleInsetImagePane extends JPanel implements UIObserver {
     private void initComponents() {
         imageChooseButton = new UIButton(IOUtils.readIcon("/com/fr/design/images/buttonicon/icon_choose_inset.png"));
 
-        imageDeleteButton = new UIButton(IOUtils.readIcon("/com/fr/design/images/buttonicon/icon_delete_inset.png"));
-        imageDeleteButton.setUI(new BasicButtonUI());
-        imageDeleteButton.setOpaque(true);
-        imageDeleteButton.setBorderPainted(false);
-        imageDeleteButton.setBorder(null);
-        imageDeleteButton.setFocusPainted(false);
-        imageDeleteButton.setContentAreaFilled(true);
+        imageDeleteButton = new OpaqueColorButton(
+                IOUtils.readIcon("/com/fr/design/images/buttonicon/icon_delete_inset.png"),
+                new Color(51, 51, 52, 178),
+                2);
         imageDeleteButton.setPreferredSize(new Dimension(DELETE_BUTTON_SIZE, DELETE_BUTTON_SIZE));
-        imageDeleteButton.setBackground(new Color(51, 51, 51));
 
         imagePreviewPane = new ImagePreviewPane();
         imagePreviewPane.setImageStyle(DEFAULT_IMAGE_LAYOUT_STYLE);
@@ -255,4 +277,35 @@ public class TitleInsetImagePane extends JPanel implements UIObserver {
     public boolean shouldResponseChangeListener() {
         return true;
     }
+
+    private static class OpaqueColorButton extends UIButton {
+        private final Color color;
+        private final int radius;
+
+        public OpaqueColorButton(Icon icon, Color color, int radius) {
+            super(icon);
+            setUI(new BasicButtonUI());
+            setOpaque(true);
+            setBorderPainted(false);
+            setBorder(null);
+            setFocusPainted(false);
+            setContentAreaFilled(false);
+            this.color = color;
+            this.radius = radius;
+        }
+
+        @Override
+        public void paint(Graphics g) {
+            Graphics2D g2d = (Graphics2D) g;
+            Color oldColor = g2d.getColor();
+
+            Shape shape = new RoundRectangle2D.Double(0, 0, getWidth(), getHeight(), radius, radius);
+            g2d.clip(shape);
+            g2d.setColor(color);
+            g2d.fillRect(0, 0, getWidth(), getHeight());
+
+            g2d.setColor(oldColor);
+            super.paint(g);
+        }
+    }
 }

designer-form/src/main/java/com/fr/design/widget/ui/designer/component/WidgetBoundPane.java

@@ -104,6 +104,10 @@ public class WidgetBoundPane extends BasicPane {
 
     public void populate() {
         Rectangle bounds = new Rectangle(creator.getBounds());
+        if (ratioLockedButton != null) {
+            // 临时禁止尺寸比例锁定，关掉widthSpinner/heightSpinner之间的数值关联，以更新其高度和宽度值
+            ratioLockedButton.setLocked(false);
+        }
         width.setValue(bounds.width);
         height.setValue(bounds.height);
         if (ratioLockedButton != null) {