j62
/
ctbrec
2
2
Fork 2
Code Issues 4 Pull Requests Packages Projects Releases 3 Wiki Activity

Optimize GUI to work with big font sizes

This commit is contained in:
0xb00bface 2021-08-21 20:16:38 +02:00
parent 1e9867cc88
commit 50d1725e59
6 changed files with 42 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
client/src/main/java/ctbrec/ui/settings/ColorSettingsPane.java
View File

@ -28,12 +28,10 @@ public class ColorSettingsPane extends HBox {
baseColor.setValue(Color.web(config.getSettings().colorBase));
baseColor.setTooltip(new Tooltip("Base Color"));
baseColor.setMaxSize(44, 25);
baseColor.setPrefWidth(100);
accentColor.setValue(Color.web(config.getSettings().colorAccent));
accentColor.setTooltip(new Tooltip("Accent Color"));
accentColor.setMaxSize(44, 25);
reset.setMinSize(60, 25);
reset.setMaxSize(60, 25);
accentColor.setPrefWidth(100);
baseColor.setOnAction(evt -> {
config.getSettings().colorBase = toWeb(baseColor.getValue());

4
client/src/main/java/ctbrec/ui/settings/PostProcessingStepPanel.java
View File

@ -20,6 +20,7 @@ import ctbrec.ui.controls.Dialogs;
import javafx.collections.FXCollections;
import javafx.collections.ListChangeListener;
import javafx.collections.ObservableList;
import javafx.geometry.Insets;
import javafx.scene.control.Button;
import javafx.scene.control.ChoiceDialog;
import javafx.scene.control.ListView;
@ -82,6 +83,7 @@ public class PostProcessingStepPanel extends GridPane {
});
stepListView = new ListView<>(stepList);
GridPane.setHgrow(stepListView, Priority.ALWAYS);
GridPane.setFillWidth(stepListView, true);
add(stepListView, 0, 0);
add(buttons, 1, 0);
@ -94,6 +96,8 @@ public class PostProcessingStepPanel extends GridPane {
edit.setDisable(noSelection);
remove.setDisable(noSelection);
});
setPadding(new Insets(10));
}
private Button createUpButton() {

13
client/src/main/java/ctbrec/ui/settings/SettingsTab.java
View File

@ -55,7 +55,6 @@ import javafx.geometry.Pos;
import javafx.scene.Node;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.ScrollPane;
import javafx.scene.control.Tab;
import javafx.scene.control.TextInputDialog;
import javafx.scene.layout.Background;
@ -66,7 +65,6 @@ import javafx.scene.layout.BorderStrokeStyle;
import javafx.scene.layout.BorderWidths;
import javafx.scene.layout.CornerRadii;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.Priority;
import javafx.scene.layout.Region;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
@ -302,18 +300,9 @@ public class SettingsTab extends Tab implements TabSelectionListener {
Region preferencesView = prefs.getView();
prefs.onRestartRequired(this::showRestartRequired);
storage.setPreferences(prefs);
preferencesView.setMinSize(800, 400);
preferencesView.setPrefSize(1280, 960);
var scrollPane = new ScrollPane(preferencesView);
var container = new GridPane();
container.add(scrollPane, 0, 0);
GridPane.setFillWidth(scrollPane, true);
GridPane.setFillHeight(scrollPane, true);
GridPane.setHgrow(scrollPane, Priority.ALWAYS);
GridPane.setVgrow(scrollPane, Priority.ALWAYS);
var stackPane = new StackPane();
stackPane.getChildren().add(container);
stackPane.getChildren().add(preferencesView);
restartNotification = new Label("Restart Required");
restartNotification.setVisible(false);
restartNotification.setOpacity(0);

11
client/src/main/java/ctbrec/ui/settings/api/Preferences.java
View File

@ -16,6 +16,8 @@ import javafx.geometry.Insets;
import javafx.geometry.VPos;
import javafx.scene.Node;
import javafx.scene.control.Label;
import javafx.scene.control.ScrollPane;
import javafx.scene.control.ScrollPane.ScrollBarPolicy;
import javafx.scene.control.Tooltip;
import javafx.scene.control.TreeItem;
import javafx.scene.control.TreeView;
@ -88,13 +90,16 @@ public class Preferences {
}
main.setCenter(new Label("Center"));
BorderPane.setMargin(leftSide, new Insets(2));
categoryTree.getSelectionModel().selectedItemProperty().addListener((obs, oldV, newV) -> {
if (newV != null) {
Category cat = newV.getValue();
Node gui = cat.getGuiOrElse(() -> createGui(cat));
BorderPane.setMargin(gui, new Insets(10));
main.setCenter(gui);
ScrollPane scrollPane = new ScrollPane(gui);
scrollPane.setPadding(new Insets(20));
scrollPane.setHbarPolicy(ScrollBarPolicy.NEVER);
scrollPane.setFitToWidth(true);
scrollPane.setFitToHeight(true);
main.setCenter(scrollPane);
}
});
categoryTree.getSelectionModel().select(0);

9
client/src/main/java/ctbrec/ui/tabs/ThumbCell.css
View File

@ -1,4 +1,7 @@
.selection-background {
/*-fx-fill: #0096C9;*/
.thumbcell-selection-background {
-fx-fill: -fx-accent;
}
}
.thumbcell-name {
-fx-font: normal bold 1.2em 'sans-serif';
}

35
client/src/main/java/ctbrec/ui/tabs/ThumbCell.java
View File

@ -97,8 +97,8 @@ public class ThumbCell extends StackPane {
private RecordingIndicator recordingIndicator;
private Tooltip recordingIndicatorTooltip;
private StackPane previewTrigger;
private StackPane groupIndicator;
private Label groupIndicatorTooltipTrigger;
private ImageView groupIndicator;
private int index = 0;
ContextMenu popup;
private static final Color colorNormal = Color.BLACK;
@ -138,7 +138,6 @@ public class ThumbCell extends StackPane {
iv.setPreserveRatio(true);
getChildren().add(iv);
topicBackground = new Rectangle();
topicBackground.setFill(Color.BLACK);
topicBackground.setOpacity(0);
@ -154,7 +153,6 @@ public class ThumbCell extends StackPane {
StackPane.setMargin(resolutionBackground, new Insets(2));
getChildren().add(resolutionBackground);
topic = new Text();
String txt = recording ? " " : "";
txt += model.getDescription();
@ -177,7 +175,7 @@ public class ThumbCell extends StackPane {
name = new Text(model.getDisplayName());
name.setFill(Color.WHITE);
name.setTextAlignment(TextAlignment.CENTER);
name.prefHeight(25);
name.getStyleClass().add("thumbcell-name");
StackPane.setAlignment(name, Pos.BOTTOM_CENTER);
getChildren().add(name);
@ -197,20 +195,23 @@ public class ThumbCell extends StackPane {
StackPane.setAlignment(recordingIndicator, Pos.TOP_LEFT);
getChildren().add(recordingIndicator);
groupIndicator = new ImageView(imgGroupIndicator);
groupIndicator.setVisible(false);
groupIndicator = new StackPane();
groupIndicator.setMaxSize(24, 24);
var groupIndicatorImg = new ImageView(imgGroupIndicator);
groupIndicatorImg.setVisible(false);
groupIndicatorImg.visibleProperty().bind(groupIndicator.visibleProperty());
groupIndicatorTooltipTrigger = new Label();
groupIndicatorTooltipTrigger.setPrefSize(16, 16);
groupIndicatorTooltipTrigger.setMinSize(16, 16);
groupIndicatorTooltipTrigger.visibleProperty().bind(groupIndicator.visibleProperty());
groupIndicatorTooltipTrigger.setCursor(Cursor.HAND);
groupIndicatorTooltipTrigger.setOnMouseClicked(e -> new EditGroupAction(this, recorder, model).execute());
StackPane.setMargin(groupIndicatorTooltipTrigger, new Insets(0, 3, 23, 0));
StackPane.setAlignment(groupIndicatorTooltipTrigger, Pos.BOTTOM_RIGHT);
StackPane.setMargin(groupIndicator, new Insets(0, 3, 23, 0));
var groupIndicatorBackground = new Circle(12, Color.WHITE);
groupIndicatorBackground.visibleProperty().bind(groupIndicator.visibleProperty());
groupIndicatorBackground.setOpacity(0.7);
groupIndicator.getChildren().addAll(groupIndicatorBackground, groupIndicatorImg, groupIndicatorTooltipTrigger);
StackPane.setAlignment(groupIndicator, Pos.BOTTOM_RIGHT);
getChildren().add(groupIndicator);
getChildren().add(groupIndicatorTooltipTrigger);
if (Config.getInstance().getSettings().livePreviews) {
getChildren().add(createPreviewTrigger());
@ -267,7 +268,7 @@ public class ThumbCell extends StackPane {
}
private Node createPreviewTrigger() {
var s = 32;
var s = 24;
previewTrigger = new StackPane();
previewTrigger.setStyle("-fx-background-color: white;");
previewTrigger.setOpacity(.8);
@ -338,9 +339,9 @@ public class ThumbCell extends StackPane {
selectionProperty.set(selected);
selectionOverlay.setOpacity(selected ? .75 : 0);
if (selected) {
selectionOverlay.getStyleClass().add("selection-background");
selectionOverlay.getStyleClass().add("thumbcell-selection-background");
} else {
selectionOverlay.getStyleClass().remove("selection-background");
selectionOverlay.getStyleClass().remove("thumbcell-selection-background");
}
}
@ -760,8 +761,14 @@ public class ThumbCell extends StackPane {
@Override
protected void layoutChildren() {
super.layoutChildren();
nameBackground.setHeight(name.getLayoutBounds().getHeight());
resolutionBackground.setHeight(resolutionTag.getLayoutBounds().getHeight());
topicBackground.setHeight(getHeight() - nameBackground.getHeight());
StackPane.setMargin(groupIndicator, new Insets(0, 3, nameBackground.getHeight() + 4, 0));
if (Config.getInstance().getSettings().livePreviews) {
StackPane.setMargin(previewTrigger, new Insets(0, 0, nameBackground.getHeight() + 4, 4));
}
super.layoutChildren();
}
}