fix emphasis triangle scaling and center drawing. Make Text configurable.

Author: DivineThreepwood

.idea/encodings.xml

@@ -112,9 +112,9 @@ public EmphasisControlTriangle() {
     double mousePosX;
     double mousePosY;
 
-    public void updateHandlePosition(final double sceneMousePosX, final double sceneMousePosY, final double scale, final boolean mouseClicked, final GraphicsContext gc) {
-        mousePosX = (sceneMousePosX) / scale - PADDING;
-        mousePosY = (sceneMousePosY) / scale - PADDING;
+    public void updateHandlePosition(final double sceneMousePosX, final double sceneMousePosY, final double scale, final double xTranslate, final double yTranslate, final boolean mouseClicked, final GraphicsContext gc) {
+        mousePosX = (sceneMousePosX) / scale - xTranslate;
+        mousePosY = (sceneMousePosY) / scale - yTranslate;
 
         // compute handle position
         if (contains(mousePosX, (EMPHASIS_TRIANGLE_HEIGHT - mousePosY))) {

src/main/java/org/openbase/bco/bcozy/view/generic/EmphasisControlTriangle.java

@@ -2,15 +2,19 @@
 
 import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIcon;
 import javafx.application.Platform;
+import javafx.beans.binding.Bindings;
 import javafx.beans.property.SimpleDoubleProperty;
 import javafx.beans.property.SimpleObjectProperty;
 import javafx.geometry.Pos;
+import javafx.scene.Node;
 import javafx.scene.canvas.Canvas;
 import javafx.scene.canvas.GraphicsContext;
 import javafx.scene.control.Label;
 import javafx.scene.input.MouseEvent;
 import javafx.scene.layout.*;
+import javafx.scene.text.TextAlignment;
 import javafx.scene.transform.Affine;
+import org.openbase.jul.iface.provider.LabelProvider;
 import org.openbase.jul.processing.StringProcessor;
 import org.openbase.jul.visual.javafx.geometry.svg.SVGGlyphIcon;
 import org.openbase.jul.visual.javafx.iface.DynamicPane;
@@ -28,11 +32,16 @@ public class EmphasisControlTrianglePane extends BorderPane implements DynamicPa
     private final Canvas canvas;
     private final Label emphasisLabel = new Label("Emphasis");
     private final SVGGlyphIcon emphasisIcon;
+    private final HBox triangleOuterHPane;
     private GraphicsContext gc;
     private double scale;
+    private double xTranslate;
+    private double yTranslate;
     private final Pane trianglePane;
     private volatile boolean emphasisStateUpdate;
 
+    private EmphasisDescriptionProvider labelProvider = primaryEmphasisCategory -> "Optimize " + StringProcessor.transformFirstCharToUpperCase(primaryEmphasisCategory.name().toLowerCase());
+
     public EmphasisControlTrianglePane() {
 
         this.emphasisStateProperty = new SimpleObjectProperty<>(EmphasisState.getDefaultInstance());
@@ -68,39 +77,12 @@ public EmphasisControlTrianglePane() {
 
         this.gc = canvas.getGraphicsContext2D();
 
-        this.trianglePane.setMinHeight(50);
-        this.trianglePane.setMinWidth(50);
-
         this.trianglePane.setPrefSize(200, 185);
 
-        //this.trianglePane.prefHeightProperty().bind(trianglePane.widthProperty());
-
-        // this.trianglePane.prefWidthProperty()/;
-
         this.canvas.setCache(true);
 
         canvas.widthProperty().bind(trianglePane.widthProperty());
         canvas.heightProperty().bind(trianglePane.heightProperty());
-//        trianglePane.widthProperty().addListener((observable, oldValue, newWidth) -> {
-//            if(newWidth.doubleValue() < trianglePane.getHeight()) {
-//                this.canvas.widthProperty().unbind();
-//                this.canvas.heightProperty().unbind();
-//
-//                this.canvas.widthProperty().bind(trianglePane.widthProperty());
-//                this.canvas.heightProperty().bind(trianglePane.widthProperty().multiply(0.85d));
-//            }
-//        });
-//
-//        trianglePane.heightProperty().addListener((observable, oldValue, newHeight) -> {
-//            if(newHeight.doubleValue() <= trianglePane.getWidth()) {
-//
-//                this.canvas.widthProperty().unbind();
-//                this.canvas.heightProperty().unbind();
-//
-//                this.canvas.heightProperty().bind(trianglePane.heightProperty());
-//                this.canvas.widthProperty().bind(trianglePane.heightProperty().multiply(1.15d));
-//            }
-//        });
 
         this.trianglePane.heightProperty().addListener((observable, oldValue, newValue) -> {
             this.updateDynamicContent();
@@ -123,6 +105,7 @@ public EmphasisControlTrianglePane() {
         this.canvas.setOnMousePressed(event -> {
             applyMousePositionUpdate(event.getX(), event.getY(), scale, true, gc);
             event.consume();
+            interactionProperty.set(event);
         });
 
         this.canvas.setOnMouseClicked(event -> {
@@ -137,18 +120,31 @@ public EmphasisControlTrianglePane() {
         });
 
         this.trianglePane.getChildren().addAll(canvas, emphasisIcon);
+        AnchorPane.setTopAnchor(trianglePane, 0.0);
+        AnchorPane.setBottomAnchor(trianglePane, 0.0);
+        AnchorPane.setLeftAnchor(trianglePane, 0.0);
+        AnchorPane.setRightAnchor(trianglePane, 0.0);
+
+        final VBox triangleOuterVPane = new VBox();
+        triangleOuterVPane.setAlignment(Pos.CENTER);
+        triangleOuterVPane.setFillWidth(true);
+        triangleOuterVPane.getChildren().add(trianglePane);
 
-        final HBox triangleOuterPane = new HBox();
-        triangleOuterPane.setAlignment(Pos.CENTER);
-        triangleOuterPane.setFillHeight(true);
-        triangleOuterPane.getChildren().add(trianglePane);
+        triangleOuterHPane = new HBox();
+        triangleOuterHPane.setAlignment(Pos.CENTER);
+        triangleOuterHPane.setFillHeight(true);
+        triangleOuterHPane.getChildren().add(triangleOuterVPane);
 
-        //innerPane.getChildren().add(triangleOuterPane);
+        trianglePane.prefHeightProperty().bind(triangleOuterHPane.heightProperty());
+        trianglePane.prefWidthProperty().bind(triangleOuterHPane.widthProperty());
+
+        emphasisLabel.setTextAlignment(TextAlignment.CENTER);
+        emphasisLabel.setStyle("-fx-font-size: 20px; -fx-font-weight: bold;");
 
         final HBox labelBox = new HBox(emphasisLabel);
         labelBox.setAlignment(Pos.CENTER);
 
-        this.setCenter(triangleOuterPane);
+        this.setCenter(triangleOuterHPane);
         this.setBottom(labelBox);
 
         this.initContent();
@@ -178,7 +174,7 @@ private void updateEmphasisCategory(Category primaryEmphasisCategory) {
                     emphasisIcon.setForegroundIcon(MaterialDesignIcon.FLASH);
                     break;
             }
-            emphasisLabel.setText("Optimize " + StringProcessor.transformFirstCharToUpperCase(primaryEmphasisCategory.name().toLowerCase()));
+            emphasisLabel.setText(labelProvider.getLabel(primaryEmphasisCategory));
         } else {
             Platform.runLater(() -> {
                 switch (primaryEmphasisCategory) {
@@ -195,7 +191,7 @@ private void updateEmphasisCategory(Category primaryEmphasisCategory) {
                         emphasisIcon.setForegroundIcon(MaterialDesignIcon.FLASH);
                         break;
                 }
-                emphasisLabel.setText("Optimize " + StringProcessor.transformFirstCharToUpperCase(primaryEmphasisCategory.name().toLowerCase()));
+                emphasisLabel.setText(labelProvider.getLabel(primaryEmphasisCategory));
             });
         }
     }
@@ -219,21 +215,27 @@ private void computeEmphasisState() {
     @Override
     public void updateDynamicContent() {
 
-        scale = Math.min(trianglePane.getWidth(), trianglePane.getHeight()) / (EMPHASIS_TRIANGLE_OUTER_LINE + EmphasisControlTriangle.PADDING * 2);
-//        System.out.println("canvas.getWidth(): " + canvas.getWidth());`
+        scale = Math.min(canvas.getWidth(), canvas.getHeight()) / (EMPHASIS_TRIANGLE_OUTER_LINE + EmphasisControlTriangle.PADDING * 2);
+//        System.out.println("canvas.getWidth(): " + canvas.getWidth());
 //        System.out.println("canvas.getHeight(): " + canvas.getHeight());
 //        System.out.println("getHeight(): " + getHeight());
 //        System.out.println("getWidth: " + getWidth());
 //        System.out.println("scale: " + scale);
+//        System.out.println("triangle size: " + EMPHASIS_TRIANGLE_OUTER_LINE);
+//        System.out.println("triangle size scaled: " + (EMPHASIS_TRIANGLE_OUTER_LINE * scale));
+//        System.out.println("triangle leftover: " + ((canvas.getWidth() - EMPHASIS_TRIANGLE_OUTER_LINE * scale)/2));
+
+        xTranslate = ((canvas.getWidth()/scale - EMPHASIS_TRIANGLE_OUTER_LINE)/2);
+        yTranslate = ((canvas.getHeight()/scale - EMPHASIS_TRIANGLE_HEIGHT)/2);
 
         // reset previous scale value
         gc.setTransform(new Affine());
 
         // set new scale
         gc.scale(scale, scale);
 
-        // translate regarding frame
-        gc.translate(EmphasisControlTriangle.PADDING, EmphasisControlTriangle.PADDING);
+        // translate into center of canvas
+        gc.translate(xTranslate, yTranslate);
 
         // initial triangle draw
         emphasisControlTriangle.drawShapes(false, gc);
@@ -253,18 +255,17 @@ public void updateDynamicContent() {
     }
 
     private void applyMousePositionUpdate(final double sceneX, final double sceneY, final double scale, final boolean mouseClicked, final GraphicsContext gc) {
-        emphasisControlTriangle.updateHandlePosition(sceneX, sceneY, scale, mouseClicked, gc);
+        emphasisControlTriangle.updateHandlePosition(sceneX, sceneY, scale, xTranslate, yTranslate, mouseClicked, gc);
     }
 
-
     private void updateIcon(final boolean mouseClicked) {
         // setup icon animation
         if (!mouseClicked) {
             emphasisIcon.setForegroundIconColorAnimated(emphasisControlTriangle.getEmphasisColor(), 2);
         }
 
-        emphasisIcon.setLayoutX(emphasisControlTriangle.getHandlePosX() * scale - (emphasisIcon.getSize() / 2));
-        emphasisIcon.setLayoutY(emphasisControlTriangle.getHandlePosY() * scale - (emphasisIcon.getSize() / 2));
+        emphasisIcon.setLayoutX((emphasisControlTriangle.getHandlePosX() + xTranslate) * scale - (emphasisIcon.getSize() / 2) - EmphasisControlTriangle.PADDING * scale);
+        emphasisIcon.setLayoutY((emphasisControlTriangle.getHandlePosY() + yTranslate) * scale - (emphasisIcon.getSize() / 2) - EmphasisControlTriangle.PADDING * scale);
     }
 
 
@@ -289,6 +290,10 @@ public SimpleObjectProperty<MouseEvent> interactionProperty() {
     }
 
     public void setTrianglePrefSize(double prefWidth, double prefHeight) {
-        trianglePane.setPrefSize(prefWidth, prefHeight);
+        triangleOuterHPane.setPrefSize(prefWidth, prefHeight);
+    }
+
+    public void setLabelProvider(EmphasisDescriptionProvider labelProvider) {
+        this.labelProvider = labelProvider;
     }
 }

src/main/java/org/openbase/bco/bcozy/view/generic/EmphasisControlTrianglePane.java

@@ -0,0 +1,7 @@
+package org.openbase.bco.bcozy.view.generic;
+
+import org.openbase.type.domotic.action.ActionEmphasisType.ActionEmphasis.Category;
+
+public interface EmphasisDescriptionProvider {
+    String getLabel(Category primaryCategory);
+}