Browse Source

REPORT-53175 【10.0.18】组件背景分离为标题/背景/边框

子功能:图片边框
【问题原因】
交互重新设计
【改动思路】
【review建议】
zheng-1641779399395
Starryi 3 years ago
parent
commit
04af5fc75a
  1. BIN
      designer-base/src/main/resources/com/fr/design/images/transparent_background.jpg
  2. 246
      designer-form/src/main/java/com/fr/design/gui/xpane/BorderLineAndImagePane.java

BIN
designer-base/src/main/resources/com/fr/design/images/transparent_background.jpg

Binary file not shown.

Before

Width:  |  Height:  |  Size: 24 KiB

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

@ -20,6 +20,7 @@ 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.itextfield.UIIntNumberField;
import com.fr.design.layout.FRGUIPaneFactory;
import com.fr.design.layout.TableLayout;
import com.fr.design.layout.TableLayoutHelper;
@ -44,11 +45,13 @@ import javax.swing.plaf.basic.BasicButtonUI;
import java.awt.*;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.event.FocusAdapter;
import java.awt.event.FocusEvent;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.event.MouseMotionListener;
import java.awt.geom.Line2D;
import java.awt.geom.RoundRectangle2D;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import java.net.URI;
@ -65,7 +68,7 @@ import java.util.Arrays;
public class BorderLineAndImagePane extends JPanel implements UIObserver {
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 = "";
private final String TWEAK_NINE_POINT_HELP_URL = "https://help.fanruan.com/finereport/doc-view-4135.html";
private UIObserverListener uiObserverListener;
@ -415,18 +418,11 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
private void initComponents() {
setLayout(new BorderLayout());
setBorder(BorderFactory.createTitledBorder(com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Form_Widget_Style_Border_Image_Config_Nine_Point_Fill_Preview")));
setBorder(BorderFactory.createEmptyBorder());
add(previewPane, BorderLayout.CENTER);
JPanel content = FRGUIPaneFactory.createBorderLayout_S_Pane();
content.setBorder(BorderFactory.createEmptyBorder(
IntervalConstants.INTERVAL_W1,
IntervalConstants.INTERVAL_W1,
IntervalConstants.INTERVAL_W1,
IntervalConstants.INTERVAL_W1));
content.add(previewPane);
previewPane.setPreferredSize(new Dimension(611, 457));
add(content, BorderLayout.CENTER);
previewPane.setPreferredSize(new Dimension(615, 462));
previewPane.setBorder(BorderFactory.createEmptyBorder());
}
@Override
@ -436,18 +432,23 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
}
private class NinePointLinePreviewPane extends JPanel implements MouseMotionListener, MouseListener {
private final BufferedImage transparentImage = IOUtils.readImage("/com/fr/design/images/transparent_background.jpg");
public final Color PATCH_COLOR = new Color(0, 0, 0, 38);
public final Color DIVIDER_COLOR = new Color(250, 250, 250);
public final Color TEXT_COLOR = Color.WHITE;
public final int PADDING = 15;
public final Color BACKGROUND_PANE_COLOR = Color.WHITE;
public final Color BACKGROUND_IMG_COLOR = Color.lightGray;
public final Color DIVIDER_BACKGROUND_COLOR = Color.WHITE;
public final Color DIVIDER_FOREGROUND_COLOR = Color.BLACK;
public final Color HINT_BACKGROUND_COLOR = new Color(255, 255, 255, 100);
public final Color HINT_FOREGROUND_COLOR = Color.RED;
public final Color HINT_LINE_BACKGROUND_COLOR = Color.WHITE;
public final Color HINT_LINE_FOREGROUND_COLOR = Color.RED;
public final int PADDING = 20;
private int ninePointLeft = -1;
private int ninePointTop = -1;
private int ninePointRight = -1;
private int ninePointBottom = -1;
private static final int MIN_NINE_POINT = 0;
private int imgWidth;
private int imgHeight;
private int scaleImgWidth;
@ -456,9 +457,52 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
private int scaleImgY;
private double scale = 1.0;
private final UIIntNumberField topField = createNumberField();
private final UIIntNumberField bottomField = createNumberField();
private final UIIntNumberField leftField = createNumberField();
private final UIIntNumberField rightField = createNumberField();
public NinePointLinePreviewPane() {
this.setLayout(null);
this.addMouseMotionListener(this);
this.addMouseListener(this);
this.setFocusable(true);
this.add(topField);
this.add(bottomField);
this.add(leftField);
this.add(rightField);
topField.addFocusListener(new FocusAdapter() {
@Override
public void focusLost(FocusEvent e) {
int value = (int) topField.getValue();
onNinePointTopChanged(value);
}
});
bottomField.addFocusListener(new FocusAdapter() {
@Override
public void focusLost(FocusEvent e) {
int value = (int) bottomField.getValue();
onNinePointBottomChanged(value);
}
});
leftField.addFocusListener(new FocusAdapter() {
@Override
public void focusLost(FocusEvent e) {
int value = (int) leftField.getValue();
onNinePointLeftChanged(value);
}
});
rightField.addFocusListener(new FocusAdapter() {
@Override
public void focusLost(FocusEvent e) {
int value = (int) rightField.getValue();
onNinePointRightChanged(value);
}
});
}
@Override
@ -466,7 +510,9 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
super.paintComponent(g);
Graphics2D g2d = (Graphics2D) g;
g2d.drawImage(transparentImage, 0, 0, getWidth(), getHeight(), null);
g2d.setColor(BACKGROUND_PANE_COLOR);
g2d.fillRect(0, 0, getWidth(), getHeight());
Image image = imagePreviewPane.getImage();
@ -491,6 +537,8 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
scale = 1.0 * scaleImgHeight / imgHeight;
}
g2d.setColor(BACKGROUND_IMG_COLOR);
g2d.fillRect(scaleImgX, scaleImgY, scaleImgWidth, scaleImgHeight);
g2d.drawImage(image, scaleImgX, scaleImgY, scaleImgWidth, scaleImgHeight, null);
int scaleLeft = (int) (ninePointLeft * scale);
@ -503,28 +551,45 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
double leftXInPane = scaleImgX + scaleLeft;
double rightXInPane = scaleImgX + scaleImgWidth - scaleRight;
g2d.setColor(PATCH_COLOR);
// draw horizontal patch
GraphDrawHelper.fillRect(g2d, 0, topYInPane, getWidth(), scaleImgHeight - scaleTop - scaleBottom);
// draw vertical patch
GraphDrawHelper.fillRect(g2d, scaleImgX + scaleLeft, 0,scaleImgWidth - scaleLeft - scaleRight, getHeight());
g2d.setColor(DIVIDER_COLOR);
// draw top divider
GraphDrawHelper.drawLine(g2d, 0, topYInPane, getWidth(), topYInPane);
// draw bottom divider
GraphDrawHelper.drawLine(g2d, 0, bottomYInPane, getWidth(), bottomYInPane);
// draw left divider
GraphDrawHelper.drawLine(g2d, leftXInPane, 0, leftXInPane, getHeight());
// draw right divider
GraphDrawHelper.drawLine(g2d, rightXInPane, 0, rightXInPane, getHeight());
g2d.setColor(TEXT_COLOR);
// draw nine point info
GraphDrawHelper.drawString(g2d, Integer.toString(ninePointTop), (leftXInPane + rightXInPane) / 2.0F, topYInPane / 2.0);
GraphDrawHelper.drawString(g2d, Integer.toString(ninePointBottom), (leftXInPane + rightXInPane) / 2.0F, (bottomYInPane + getHeight()) / 2.0);
GraphDrawHelper.drawString(g2d, Integer.toString(ninePointLeft), leftXInPane / 2.0, (topYInPane + bottomYInPane) / 2.0);
GraphDrawHelper.drawString(g2d, Integer.toString(ninePointRight), (rightXInPane + getWidth()) / 2.0, (topYInPane + bottomYInPane) / 2.0);
// 绘制分割线
// 顶部
drawLine(g2d, DIVIDER_BACKGROUND_COLOR, DIVIDER_FOREGROUND_COLOR, scaleImgX, topYInPane, scaleImgX + scaleImgWidth, topYInPane);
// 底部
drawLine(g2d, DIVIDER_BACKGROUND_COLOR, DIVIDER_FOREGROUND_COLOR, scaleImgX, bottomYInPane, scaleImgX + scaleImgWidth, bottomYInPane);
// 左侧
drawLine(g2d, DIVIDER_BACKGROUND_COLOR, DIVIDER_FOREGROUND_COLOR, leftXInPane, scaleImgY, leftXInPane, scaleImgY + scaleImgHeight);
// 右侧
drawLine(g2d, DIVIDER_BACKGROUND_COLOR, DIVIDER_FOREGROUND_COLOR, rightXInPane, scaleImgY, rightXInPane, scaleImgY + scaleImgHeight);
// 绘制分割线位置提示
// 顶部
drawLine(g2d, HINT_LINE_BACKGROUND_COLOR, HINT_LINE_FOREGROUND_COLOR, (leftXInPane + rightXInPane) / 2.0F, scaleImgY, (leftXInPane + rightXInPane) / 2.0F, topYInPane);
drawHint(g2d, Integer.toString(ninePointTop), (leftXInPane + rightXInPane) / 2.0F, (scaleImgY + topYInPane) / 2.0, topField);
// 底部
drawLine(g2d, HINT_LINE_BACKGROUND_COLOR, HINT_LINE_FOREGROUND_COLOR, (leftXInPane + rightXInPane) / 2.0F, bottomYInPane, (leftXInPane + rightXInPane) / 2.0F, scaleImgY + scaleImgHeight);
drawHint(g2d, Integer.toString(ninePointBottom), (leftXInPane + rightXInPane) / 2.0F, (bottomYInPane + scaleImgY + scaleImgHeight) / 2.0, bottomField);
// 左侧
drawLine(g2d, HINT_LINE_BACKGROUND_COLOR, HINT_LINE_FOREGROUND_COLOR, scaleImgX, (topYInPane + bottomYInPane) / 2.0, leftXInPane, (topYInPane + bottomYInPane) / 2.0);
drawHint(g2d, Integer.toString(ninePointLeft), (scaleImgX + leftXInPane) / 2.0, (topYInPane + bottomYInPane) / 2.0, leftField);
// 右侧
drawLine(g2d, HINT_LINE_BACKGROUND_COLOR, HINT_LINE_FOREGROUND_COLOR, rightXInPane, (topYInPane + bottomYInPane) / 2.0, scaleImgX + scaleImgWidth, (topYInPane + bottomYInPane) / 2.0);
drawHint(g2d, Integer.toString(ninePointRight), (rightXInPane + scaleImgX + scaleImgWidth) / 2.0, (topYInPane + bottomYInPane) / 2.0, rightField);
}
private void drawHint(Graphics2D g2d, String hint, double centerX, double centerY, UIIntNumberField hintField) {
FontMetrics metrics = GraphDrawHelper.getFontMetrics(g2d.getFont());
double height = metrics.getAscent() + metrics.getDescent();
double width = Math.max(metrics.stringWidth(" " + hint + " "), metrics.stringWidth(" 123 "));
hintField.setBounds((int) (centerX - width / 2.0), (int) (centerY - height / 2.0), (int) width, (int) height);
}
private void drawLine(Graphics2D g2d, Color backgroundColor, Color foregroundColor, double x1, double y1, double x2, double y2) {
g2d.setColor(backgroundColor);
GraphDrawHelper.draw(g2d, new Line2D.Double(x1, y1, x2, y2), Constants.LINE_THIN, 2.0F);
g2d.setColor(foregroundColor);
GraphDrawHelper.draw(g2d, new Line2D.Double(x1, y1, x2, y2), Constants.LINE_DASH, 1.0F);
}
@Override
@ -537,34 +602,22 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
switch (cursorType) {
case Cursor.W_RESIZE_CURSOR: {
int nextLeft = (int) ((x - scaleImgX) / scale);
if (1 <= nextLeft && nextLeft < imgWidth - ninePointRight) {
ninePointLeft = nextLeft;
repaint();
}
this.onNinePointLeftChanged(nextLeft);
return;
}
case Cursor.E_RESIZE_CURSOR: {
int nextRight = (int) ((scaleImgX + scaleImgWidth - x) / scale);
if (1 <= nextRight && nextRight < imgWidth - ninePointLeft) {
ninePointRight = nextRight;
repaint();
}
this.onNinePointRightChanged(nextRight);
return;
}
case Cursor.N_RESIZE_CURSOR: {
int nextTop = (int) ((y - scaleImgY) / scale);
if (1 <= nextTop && nextTop < imgHeight - ninePointBottom) {
ninePointTop = nextTop;
repaint();
}
this.onNinePointTopChanged(nextTop);
return;
}
case Cursor.S_RESIZE_CURSOR: {
int nextBottom = (int) ((scaleImgY + scaleImgHeight - y) / scale);
if (1 <= nextBottom && nextBottom < imgHeight - ninePointTop) {
ninePointBottom = nextBottom;
repaint();
}
this.onNinePointBottomChanged(nextBottom);
}
}
}
@ -584,10 +637,17 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
// determine cursor
int cursorType = Cursor.DEFAULT_CURSOR;
boolean hoveringLeftDivider = Math.abs(x - (scaleImgX + scaleLeft)) < 2;
boolean hoveringRightDivider = Math.abs(x - (scaleImgX + scaleImgWidth - scaleRight)) < 2;
boolean hoveringTopDivider = Math.abs(y - (scaleImgY + scaleTop)) < 2;
boolean hoveringBottomDivider = Math.abs(y - (scaleImgY + scaleImgHeight - scaleBottom)) < 2;
boolean hoveringLeftDivider = false;
boolean hoveringRightDivider = false;
boolean hoveringTopDivider = false;
boolean hoveringBottomDivider = false;
if (scaleImgX - 2 <= x && x <= scaleImgX + scaleImgWidth + 2 && scaleImgY - 2 <= y && y <= scaleImgY + scaleImgHeight + 2) {
hoveringLeftDivider = Math.abs(x - (scaleImgX + scaleLeft)) < 2;
hoveringRightDivider = Math.abs(x - (scaleImgX + scaleImgWidth - scaleRight)) < 2;
hoveringTopDivider = Math.abs(y - (scaleImgY + scaleTop)) < 2;
hoveringBottomDivider = Math.abs(y - (scaleImgY + scaleImgHeight - scaleBottom)) < 2;
}
if (hoveringLeftDivider) {
cursorType = Cursor.W_RESIZE_CURSOR;
@ -609,7 +669,7 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
@Override
public void mouseClicked(MouseEvent e) {
requestFocus();
}
@Override
@ -634,12 +694,72 @@ public class BorderLineAndImagePane extends JPanel implements UIObserver {
}
private void onNinePointTopChanged(int value) {
if (value < MIN_NINE_POINT) {
value = MIN_NINE_POINT;
} else if (value >= imgHeight - ninePointBottom) {
value = imgHeight - ninePointBottom - MIN_NINE_POINT;
}
this.ninePointTop = value;
topField.setText(Integer.toString(value));
repaint();
}
private void onNinePointBottomChanged(int value) {
if (value < MIN_NINE_POINT) {
value = MIN_NINE_POINT;
} else if (value >= imgHeight - ninePointTop) {
value = imgHeight - ninePointTop - MIN_NINE_POINT;
}
this.ninePointBottom = value;
bottomField.setText(Integer.toString(value));
repaint();
}
private void onNinePointLeftChanged(int value) {
if (value < MIN_NINE_POINT) {
value = MIN_NINE_POINT;
} else if (value >= imgWidth - ninePointRight) {
value = imgWidth - ninePointRight - MIN_NINE_POINT;
}
this.ninePointLeft = value;
leftField.setText(Integer.toString(value));
repaint();
}
private void onNinePointRightChanged(int value) {
if (value < MIN_NINE_POINT) {
value = MIN_NINE_POINT;
} else if (value >= imgWidth - ninePointLeft) {
value = imgWidth - ninePointLeft - MIN_NINE_POINT;
}
this.ninePointRight = value;
rightField.setText(Integer.toString(value));
repaint();
}
private UIIntNumberField createNumberField() {
UIIntNumberField field = new UIIntNumberField();
field.setBorder(BorderFactory.createLineBorder(Color.GRAY, 1));
field.setOpaque(true);
field.setMinValue(MIN_NINE_POINT);
field.setForeground(HINT_FOREGROUND_COLOR);
field.setBackground(HINT_BACKGROUND_COLOR);
field.setHorizontalAlignment(SwingConstants.CENTER);
return field;
}
public void setNinePoint(int[] ninePoint) {
ninePointLeft = ninePoint[0];
ninePointTop = ninePoint[1];
ninePointRight = ninePoint[2];
ninePointBottom = ninePoint[3];
leftField.setValue(ninePointLeft);
rightField.setValue(ninePointRight);
topField.setValue(ninePointTop);
bottomField.setValue(ninePointBottom);
}
public int[] getNinePoint() {

Loading…
Cancel
Save