diff --git a/apps/desktop/desktop/src/main/java/bisq/desktop/main/content/bisq_easy/trade_wizard/select_offer/TradeWizardSelectOfferView.java b/apps/desktop/desktop/src/main/java/bisq/desktop/main/content/bisq_easy/trade_wizard/select_offer/TradeWizardSelectOfferView.java index fff796de69..dc3b3c23a4 100644 --- a/apps/desktop/desktop/src/main/java/bisq/desktop/main/content/bisq_easy/trade_wizard/select_offer/TradeWizardSelectOfferView.java +++ b/apps/desktop/desktop/src/main/java/bisq/desktop/main/content/bisq_easy/trade_wizard/select_offer/TradeWizardSelectOfferView.java @@ -60,9 +60,9 @@ @Slf4j class TradeWizardSelectOfferView extends View { - private final static int TABLE_WIDTH = 800; - private final HBox noMatchingOffersBox; + private static final int TABLE_WIDTH = 800; + private final HBox noMatchingOffersBox; private final BisqTableView tableView; private final Label headlineLabel, subtitleLabel; private Button goBackButton, browseOfferbookButton; @@ -85,14 +85,16 @@ class TradeWizardSelectOfferView extends View(model.getSortedList()); tableView.getStyleClass().add("bisq-easy-trade-wizard-select-offer"); tableView.setMinWidth(TABLE_WIDTH); - tableView.setMaxWidth(tableView.getMinWidth()); // fits 4 rows - tableView.setMaxHeight(262); // 4 * 55 (row height) + 40 (header height) + 2 (border) + tableView.setMaxHeight(260); // 4 * 55 (row height) + 40 (header height) + + VBox tableContainer = new VBox(tableView); + tableContainer.getStyleClass().add("matching-offers-table-container"); noMatchingOffersBox = new HBox(25); VBox.setMargin(noMatchingOffersBox, new Insets(10, 0, 0, 0)); - root.getChildren().addAll(Spacer.fillVBox(), headlineLabel, subtitleLabel, tableView, noMatchingOffersBox, Spacer.fillVBox()); + root.getChildren().addAll(Spacer.fillVBox(), headlineLabel, subtitleLabel, tableContainer, noMatchingOffersBox, Spacer.fillVBox()); } @Override @@ -169,10 +171,11 @@ private void maybeConfigTableView() { return; } + // Selection marker + tableView.getColumns().add(tableView.getSelectionMarkerColumn()); + // Maker - String peer = model.getDirection() == Direction.BUY ? - Res.get("offer.seller") : - Res.get("offer.buyer"); + String peer = model.getDirection() == Direction.BUY ? Res.get("offer.seller") : Res.get("offer.buyer"); tableView.getColumns().add(new BisqTableColumn.Builder() .title(peer) .left() @@ -203,9 +206,9 @@ private void maybeConfigTableView() { } // BTC amount - String baseAmountTitle = model.getDirection().isBuy() ? - Res.get("bisqEasy.tradeWizard.review.table.baseAmount.buyer") : - Res.get("bisqEasy.tradeWizard.review.table.baseAmount.seller"); + String baseAmountTitle = model.getDirection().isBuy() + ? Res.get("bisqEasy.tradeWizard.review.table.baseAmount.buyer") + : Res.get("bisqEasy.tradeWizard.review.table.baseAmount.seller"); tableView.getColumns().add(new BisqTableColumn.Builder() .title(baseAmountTitle) .minWidth(160) @@ -213,16 +216,9 @@ private void maybeConfigTableView() { .comparator(Comparator.comparing(ListItem::getBaseAmountAsLong)) .build()); - tableView.getColumns().add(new BisqTableColumn.Builder() - .minWidth(170) - .isSortable(false) - .setCellFactory(getSelectButtonCellFactory()) - .right() - .build()); isTableViewConfigured = true; } - private Callback, TableCell> getMakerCellFactory() { return new Callback<>() { @Override @@ -234,12 +230,12 @@ public TableCell call(TableColumn column { userName.setId("chat-user-name"); - int size = 20; + int size = 30; catIcon.setFitWidth(size); catIcon.setFitHeight(size); StackPane catIconWithRing = ImageUtil.addRingToNode(catIcon, size, 1.5, "-bisq-dark-grey-50"); hBox = new HBox(10, catIconWithRing, userName); - hBox.setAlignment(Pos.CENTER_LEFT); + hBox.setAlignment(Pos.CENTER); } @Override @@ -262,19 +258,27 @@ public void updateItem(final ListItem item, boolean empty) { private Callback, TableCell> getReputationCellFactory() { return new Callback<>() { - - @Override public TableCell call(TableColumn column) { return new TableCell<>() { private final ReputationScoreDisplay reputationScoreDisplay = new ReputationScoreDisplay(); private Subscription selectedItemPin; + private TableRow tableRow; + + { + reputationScoreDisplay.setAlignment(Pos.CENTER); + } @Override public void updateItem(final ListItem item, boolean empty) { super.updateItem(item, empty); + if (item != null && !empty) { - getTableRow().setOnMouseClicked(e -> reputationScoreDisplay.useWhiteAcceptStar()); + tableRow = getTableRow(); + tableRow.setOnMouseClicked(e -> { + reputationScoreDisplay.useWhiteAcceptStar(); + controller.onSelectRow(item); + }); selectedItemPin = EasyBind.subscribe(tableView.getSelectionModel().selectedItemProperty(), selectedItem -> { @@ -288,10 +292,14 @@ public void updateItem(final ListItem item, boolean empty) { reputationScoreDisplay.setReputationScore(item.getReputationScore()); setGraphic(reputationScoreDisplay); } else { - setGraphic(null); + if (tableRow != null) { + tableRow.setOnMouseClicked(null); + tableRow = null; + } if (selectedItemPin != null) { selectedItemPin.unsubscribe(); } + setGraphic(null); } } }; @@ -299,78 +307,6 @@ public void updateItem(final ListItem item, boolean empty) { }; } - private Callback, TableCell> getSelectButtonCellFactory() { - return column -> new TableCell<>() { - - private final Button button = new Button(Res.get("bisqEasy.tradeWizard.selectOffer.table.select")); - private TableRow tableRow; - private Subscription selectedItemPin; - - { - button.setMinWidth(160); - button.setMaxWidth(160); - } - - @Override - public void updateItem(final ListItem item, boolean empty) { - super.updateItem(item, empty); - - if (item != null && !empty) { - button.setOnAction(e -> { - tableView.getSelectionModel().select(item); - controller.onSelect(item); - }); - - tableRow = getTableRow(); - tableRow.setOnMouseEntered(e -> { - if (!tableRow.isSelected()) { - button.setVisible(true); - button.getStyleClass().remove("white-button"); - button.getStyleClass().add("outlined-button"); - } - }); - tableRow.setOnMouseExited(e -> { - button.getStyleClass().remove("outlined-button"); - if (!tableRow.isSelected()) { - button.setVisible(tableView.getSelectionModel().getSelectedItem() == null); - button.getStyleClass().remove("white-button"); - } - }); - tableRow.setOnMouseClicked(e -> controller.onSelectRow(item)); - - selectedItemPin = EasyBind.subscribe(tableView.getSelectionModel().selectedItemProperty(), - selectedItem -> { - if (item.equals(selectedItem)) { - button.setVisible(true); - button.getStyleClass().remove("outlined-button"); - button.getStyleClass().add("white-button"); - button.setText(Res.get("bisqEasy.tradeWizard.selectOffer.table.reviewTakeOffer")); - } else { - button.setVisible(selectedItem == null); - button.getStyleClass().remove("white-button"); - button.setText(Res.get("bisqEasy.tradeWizard.selectOffer.table.select")); - } - }); - - setGraphic(button); - } else { - button.setOnAction(null); - if (tableRow != null) { - tableRow.setOnMouseEntered(null); - tableRow.setOnMouseExited(null); - tableRow.setOnMouseClicked(null); - tableRow = null; - } - if (selectedItemPin != null) { - selectedItemPin.unsubscribe(); - selectedItemPin = null; - } - setGraphic(null); - } - } - }; - } - @ToString @EqualsAndHashCode @Getter diff --git a/apps/desktop/desktop/src/main/resources/css/bisq_easy.css b/apps/desktop/desktop/src/main/resources/css/bisq_easy.css index 06b08ecdd5..f59adc3f24 100644 --- a/apps/desktop/desktop/src/main/resources/css/bisq_easy.css +++ b/apps/desktop/desktop/src/main/resources/css/bisq_easy.css @@ -725,53 +725,39 @@ /******************************************************************************* - * TradeWizardTakeOfferView.tableView * + * TradeWizardTakeOfferView.tableView * ******************************************************************************/ -.bisq-easy-trade-wizard-select-trade.table-view { - -fx-font-size: 1.15em; -} - -.bisq-easy-trade-wizard-select-offer.table-view .column-header { - -fx-pref-height: 40px; -} - -.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell { - -fx-pref-height: 55px; -} - -.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell .table-cell { - -fx-background-color: -bisq-dark-grey-40; -} - -.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell:hover .table-cell { - -fx-background-color: -bisq-darker-grey; +.matching-offers-table-container { + -fx-background-color: -bisq-dark-grey-20; + -fx-border-width: 0 0 5px 0; + -fx-border-color: -bisq-dark-grey-20; } -.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell:selected .table-cell { - -fx-background-color: -bisq2-green; +.bisq-easy-trade-wizard-select-offer.table-view { + -fx-background-insets: 0; + -fx-padding: 0; } -.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell:empty { - -fx-border-color: derive(-bisq-dark-grey-40, -30%); +.bisq-easy-trade-wizard-select-offer.table-view .column-header { + -fx-pref-height: 40px; } -.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell:empty .table-cell { - -fx-background-color: derive(-bisq-dark-grey-40, -15%); +.bisq-easy-trade-wizard-select-offer.table-view .column-header .label { + -fx-alignment: center; } -.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell:empty:hover .table-cell { - -fx-background-color: derive(-bisq-dark-grey-40, -15%); +.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell:hover { + -fx-cursor: hand; } -.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell:selected .button.white-button .text { - -fx-fill: -bisq-black !important; - -fx-font-family: "IBM Plex Sans Medium" !important; +.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell { + -fx-pref-height: 55px; + -fx-border-width: 0; } -.bisq-easy-trade-wizard-select-offer.table-view .table-row-cell:hover .button.outlined-button .text { - -fx-fill: -bisq2-green; - -fx-font-family: "IBM Plex Sans Medium"; +.bisq-easy-trade-wizard-select-offer.table-view .table-cell { + -fx-padding: 0; } /* the text property from list view need to set to apply the color to the button label */