Cleaned up account and transaction tiles, and removed unneeded CSS references from most places.

This commit is contained in:
Andrew Lalis 2024-01-08 11:21:40 -05:00
parent 65595a47ac
commit 8a43862725
9 changed files with 48 additions and 36 deletions

View File

@ -14,8 +14,6 @@ import javafx.scene.layout.BorderPane;
import javafx.scene.layout.ColumnConstraints; import javafx.scene.layout.ColumnConstraints;
import javafx.scene.layout.HBox; import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority; import javafx.scene.layout.Priority;
import javafx.scene.paint.Color;
import javafx.scene.text.Text;
import java.math.BigDecimal; import java.math.BigDecimal;
import java.util.Map; import java.util.Map;
@ -26,10 +24,10 @@ import static com.andrewlalis.perfin.PerfinApp.router;
* A compact tile that displays information about an account. * A compact tile that displays information about an account.
*/ */
public class AccountTile extends BorderPane { public class AccountTile extends BorderPane {
private static final Map<AccountType, Color> ACCOUNT_TYPE_COLORS = Map.of( private static final Map<AccountType, String> ACCOUNT_TYPE_COLORS = Map.of(
AccountType.CHECKING, Color.rgb(3, 127, 252), AccountType.CHECKING, "-fx-theme-account-type-checking",
AccountType.SAVINGS, Color.rgb(57, 158, 74), AccountType.SAVINGS, "-fx-theme-account-type-savings",
AccountType.CREDIT_CARD, Color.rgb(207, 8, 68) AccountType.CREDIT_CARD, "-fx-theme-account-type-credit-card"
); );
public AccountTile(Account account) { public AccountTile(Account account) {
@ -44,9 +42,9 @@ public class AccountTile extends BorderPane {
} }
private Node getHeader(Account account) { private Node getHeader(Account account) {
Text title = new Text("Account #" + account.id); Label titleLabel = new Label(account.getName());
title.getStyleClass().addAll("large-font", "bold-text"); titleLabel.getStyleClass().addAll("large-font", "bold-text");
return title; return titleLabel;
} }
private Node getFooter(Account account) { private Node getFooter(Account account) {
@ -70,16 +68,12 @@ public class AccountTile extends BorderPane {
valueConstraints.setHalignment(HPos.RIGHT); valueConstraints.setHalignment(HPos.RIGHT);
propertiesPane.getColumnConstraints().setAll(keyConstraints, valueConstraints); propertiesPane.getColumnConstraints().setAll(keyConstraints, valueConstraints);
Label accountNameLabel = new Label(account.getName());
accountNameLabel.setWrapText(true);
accountNameLabel.getStyleClass().add("italic-text");
Label accountNumberLabel = new Label(account.getAccountNumber()); Label accountNumberLabel = new Label(account.getAccountNumber());
accountNumberLabel.getStyleClass().add("mono-font"); accountNumberLabel.getStyleClass().add("mono-font");
Label accountTypeLabel = new Label(account.getType().toString()); Label accountTypeLabel = new Label(account.getType().toString());
accountTypeLabel.setTextFill(ACCOUNT_TYPE_COLORS.get(account.getType()));
accountTypeLabel.getStyleClass().add("bold-text"); accountTypeLabel.getStyleClass().add("bold-text");
accountTypeLabel.setStyle("-fx-text-fill: " + ACCOUNT_TYPE_COLORS.get(account.getType()));
Label balanceLabel = new Label("Computing balance..."); Label balanceLabel = new Label("Computing balance...");
balanceLabel.getStyleClass().addAll("mono-font"); balanceLabel.getStyleClass().addAll("mono-font");
@ -103,8 +97,6 @@ public class AccountTile extends BorderPane {
}); });
propertiesPane.getChildren().addAll( propertiesPane.getChildren().addAll(
newPropertyLabel("Account Name"),
accountNameLabel,
newPropertyLabel("Account Number"), newPropertyLabel("Account Number"),
accountNumberLabel, accountNumberLabel,
newPropertyLabel("Account Type"), newPropertyLabel("Account Type"),

View File

@ -21,15 +21,22 @@ public class PropertiesPane extends GridPane {
private final ColumnConstraints defaultValueColumnConstraints; private final ColumnConstraints defaultValueColumnConstraints;
private boolean columnConstraintsSet = false; private boolean columnConstraintsSet = false;
public PropertiesPane() { public PropertiesPane(int keyColumnMinWidth) {
defaultKeyColumnConstraints = new ColumnConstraints(); defaultKeyColumnConstraints = new ColumnConstraints();
defaultKeyColumnConstraints.setHgrow(Priority.NEVER); defaultKeyColumnConstraints.setHgrow(Priority.NEVER);
defaultKeyColumnConstraints.setHalignment(HPos.LEFT); defaultKeyColumnConstraints.setHalignment(HPos.LEFT);
if (keyColumnMinWidth != -1) {
defaultKeyColumnConstraints.setMinWidth(keyColumnMinWidth);
}
defaultValueColumnConstraints = new ColumnConstraints(); defaultValueColumnConstraints = new ColumnConstraints();
defaultValueColumnConstraints.setHgrow(Priority.ALWAYS); defaultValueColumnConstraints.setHgrow(Priority.ALWAYS);
defaultValueColumnConstraints.setHalignment(HPos.LEFT); defaultValueColumnConstraints.setHalignment(HPos.LEFT);
} }
public PropertiesPane() {
this(-1);
}
@Override @Override
protected void layoutChildren() { protected void layoutChildren() {
// Apply grid positioning to all children in the order in which they appear, like so: // Apply grid positioning to all children in the order in which they appear, like so:

View File

@ -3,6 +3,7 @@ package com.andrewlalis.perfin.view.component;
import com.andrewlalis.perfin.data.util.CurrencyUtil; import com.andrewlalis.perfin.data.util.CurrencyUtil;
import com.andrewlalis.perfin.data.util.DateUtil; import com.andrewlalis.perfin.data.util.DateUtil;
import com.andrewlalis.perfin.model.CreditAndDebitAccounts; import com.andrewlalis.perfin.model.CreditAndDebitAccounts;
import com.andrewlalis.perfin.model.MoneyValue;
import com.andrewlalis.perfin.model.Profile; import com.andrewlalis.perfin.model.Profile;
import com.andrewlalis.perfin.model.Transaction; import com.andrewlalis.perfin.model.Transaction;
import javafx.application.Platform; import javafx.application.Platform;
@ -14,7 +15,6 @@ import javafx.scene.control.Label;
import javafx.scene.layout.BorderPane; import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox; import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox; import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.text.Text; import javafx.scene.text.Text;
import javafx.scene.text.TextFlow; import javafx.scene.text.TextFlow;
@ -37,28 +37,38 @@ public class TransactionTile extends BorderPane {
selected.addListener((observable, oldValue, newValue) -> { selected.addListener((observable, oldValue, newValue) -> {
if (newValue) { if (newValue) {
getStyleClass().add("tile-border-selected"); getStyleClass().add("tile-selected");
} else { } else {
getStyleClass().remove("tile-border-selected"); getStyleClass().remove("tile-selected");
} }
}); });
} }
private Node getHeader(Transaction transaction) { private Node getHeader(Transaction transaction) {
Label currencyLabel = new Label(CurrencyUtil.formatMoney(transaction.getMoneyAmount())); Label headerLabel = new Label("Transaction #" + transaction.id);
currencyLabel.getStyleClass().add("mono-font"); headerLabel.getStyleClass().addAll("bold-text");
HBox headerHBox = new HBox( return headerLabel;
currencyLabel
);
headerHBox.getStyleClass().addAll("std-spacing");
return headerHBox;
} }
private Node getBody(Transaction transaction) { private Node getBody(Transaction transaction) {
Label descriptionLabel = new Label(transaction.getDescription()); PropertiesPane propertiesPane = new PropertiesPane(150);
descriptionLabel.setWrapText(true); Label amountLabel = new Label("Amount");
amountLabel.getStyleClass().add("bold-text");
Label amountValue = new Label(CurrencyUtil.formatMoneyWithCurrencyPrefix(transaction.getMoneyAmount()));
amountValue.getStyleClass().add("mono-font");
Label descriptionLabel = new Label("Description");
descriptionLabel.getStyleClass().add("bold-text");
Label descriptionValue = new Label(transaction.getDescription());
descriptionValue.setWrapText(true);
propertiesPane.getChildren().addAll(
amountLabel, amountValue,
descriptionLabel, descriptionValue
);
VBox bodyVBox = new VBox( VBox bodyVBox = new VBox(
descriptionLabel propertiesPane
); );
getCreditAndDebitAccounts(transaction).thenAccept(accounts -> { getCreditAndDebitAccounts(transaction).thenAccept(accounts -> {
accounts.ifCredit(acc -> { accounts.ifCredit(acc -> {

View File

@ -8,7 +8,6 @@
xmlns="http://javafx.com/javafx" xmlns="http://javafx.com/javafx"
xmlns:fx="http://javafx.com/fxml" xmlns:fx="http://javafx.com/fxml"
fx:controller="com.andrewlalis.perfin.control.AccountViewController" fx:controller="com.andrewlalis.perfin.control.AccountViewController"
stylesheets="@style/base.css"
> >
<top> <top>
<Label fx:id="titleLabel" styleClass="std-padding,large-text,bold-text"/> <Label fx:id="titleLabel" styleClass="std-padding,large-text,bold-text"/>

View File

@ -8,7 +8,6 @@
xmlns="http://javafx.com/javafx/17.0.2-ea" xmlns="http://javafx.com/javafx/17.0.2-ea"
xmlns:fx="http://javafx.com/fxml/1" xmlns:fx="http://javafx.com/fxml/1"
fx:controller="com.andrewlalis.perfin.control.AccountsViewController" fx:controller="com.andrewlalis.perfin.control.AccountsViewController"
stylesheets="@style/base.css"
> >
<top> <top>
<HBox styleClass="std-padding,std-spacing"> <HBox styleClass="std-padding,std-spacing">

View File

@ -8,7 +8,6 @@
<BorderPane xmlns="http://javafx.com/javafx" <BorderPane xmlns="http://javafx.com/javafx"
xmlns:fx="http://javafx.com/fxml" xmlns:fx="http://javafx.com/fxml"
fx:controller="com.andrewlalis.perfin.control.CreateBalanceRecordController" fx:controller="com.andrewlalis.perfin.control.CreateBalanceRecordController"
stylesheets="@style/base.css"
> >
<top> <top>
<Label text="Create New Balance Record" styleClass="large-text,bold-text,std-padding"/> <Label text="Create New Balance Record" styleClass="large-text,bold-text,std-padding"/>

View File

@ -6,7 +6,6 @@
<BorderPane xmlns="http://javafx.com/javafx" <BorderPane xmlns="http://javafx.com/javafx"
xmlns:fx="http://javafx.com/fxml" xmlns:fx="http://javafx.com/fxml"
fx:controller="com.andrewlalis.perfin.control.CreateTransactionController" fx:controller="com.andrewlalis.perfin.control.CreateTransactionController"
stylesheets="@style/base.css"
> >
<center> <center>
<ScrollPane fitToWidth="true" fitToHeight="true"> <ScrollPane fitToWidth="true" fitToHeight="true">

View File

@ -7,7 +7,6 @@
xmlns="http://javafx.com/javafx/17.0.2-ea" xmlns="http://javafx.com/javafx/17.0.2-ea"
xmlns:fx="http://javafx.com/fxml/1" xmlns:fx="http://javafx.com/fxml/1"
fx:controller="com.andrewlalis.perfin.control.EditAccountController" fx:controller="com.andrewlalis.perfin.control.EditAccountController"
stylesheets="@style/base.css"
> >
<top> <top>
<HBox styleClass="std-padding,std-spacing"> <HBox styleClass="std-padding,std-spacing">

View File

@ -13,12 +13,17 @@ rather than with your own CSS.
-fx-theme-negative: rgb(247, 37, 69); -fx-theme-negative: rgb(247, 37, 69);
-fx-theme-positive: rgb(43, 196, 77); -fx-theme-positive: rgb(43, 196, 77);
-fx-theme-warning: rgb(250, 177, 2); -fx-theme-warning: rgb(250, 177, 2);
-fx-theme-account-type-checking: rgb(3, 127, 252);
-fx-theme-account-type-savings: rgb(57, 158, 74);
-fx-theme-account-type-credit-card: rgb(207, 8, 68);
} }
.root { .root {
-fx-font-family: "Roboto", sans-serif; -fx-font-family: "Roboto", sans-serif;
-fx-font-size: 14px; -fx-font-size: 14px;
-fx-text-fill: -fx-theme-text; -fx-text-fill: -fx-theme-text;
-fx-fill: -fx-theme-text;
-fx-background-color: -fx-theme-background; -fx-background-color: -fx-theme-background;
} }
@ -90,7 +95,7 @@ rather than with your own CSS.
-fx-background-color: derive(-fx-theme-background-2, -5%); -fx-background-color: derive(-fx-theme-background-2, -5%);
} }
.tile-border-selected { .tile-selected {
-fx-background-color: -fx-theme-background-3; -fx-background-color: -fx-theme-background-3;
} }
@ -106,6 +111,9 @@ rather than with your own CSS.
.normal-color-text-fill { .normal-color-text-fill {
-fx-text-fill: -fx-theme-text; -fx-text-fill: -fx-theme-text;
} }
.normal-color-fill {
-fx-fill: -fx-theme-text;
}
.secondary-color-text-fill { .secondary-color-text-fill {
-fx-text-fill: -fx-theme-text-secondary; -fx-text-fill: -fx-theme-text-secondary;