redesign account list page sidebar

This commit is contained in:
Haowei Wen
2021-09-07 00:46:46 +08:00
parent b7997dfbce
commit b78f5407cc
3 changed files with 86 additions and 62 deletions

View File

@@ -24,6 +24,7 @@ import javafx.beans.property.*;
import javafx.beans.value.ObservableValue; import javafx.beans.value.ObservableValue;
import javafx.collections.FXCollections; import javafx.collections.FXCollections;
import javafx.collections.ObservableList; import javafx.collections.ObservableList;
import javafx.geometry.Insets;
import javafx.scene.control.ScrollPane; import javafx.scene.control.ScrollPane;
import javafx.scene.control.Skin; import javafx.scene.control.Skin;
import javafx.scene.control.SkinBase; import javafx.scene.control.SkinBase;
@@ -48,6 +49,8 @@ import static org.jackhuang.hmcl.ui.versions.VersionPage.wrap;
import static org.jackhuang.hmcl.util.i18n.I18n.i18n; import static org.jackhuang.hmcl.util.i18n.I18n.i18n;
import static org.jackhuang.hmcl.util.javafx.ExtendedProperties.createSelectedItemPropertyFor; import static org.jackhuang.hmcl.util.javafx.ExtendedProperties.createSelectedItemPropertyFor;
import java.net.URI;
public class AccountListPage extends ListPageBase<AccountListItem> implements DecoratorPage { public class AccountListPage extends ListPageBase<AccountListItem> implements DecoratorPage {
private final ReadOnlyObjectWrapper<State> state = new ReadOnlyObjectWrapper<>(State.fromTitle(i18n("account.manage"), -1)); private final ReadOnlyObjectWrapper<State> state = new ReadOnlyObjectWrapper<>(State.fromTitle(i18n("account.manage"), -1));
private final ListProperty<Account> accounts = new SimpleListProperty<>(this, "accounts", FXCollections.observableArrayList()); private final ListProperty<Account> accounts = new SimpleListProperty<>(this, "accounts", FXCollections.observableArrayList());
@@ -91,81 +94,89 @@ public class AccountListPage extends ListPageBase<AccountListItem> implements De
BorderPane root = new BorderPane(); BorderPane root = new BorderPane();
{ {
VBox left = new VBox(); BorderPane left = new BorderPane();
left.getStyleClass().add("advanced-list-box-content"); FXUtils.setLimitWidth(left, 200);
left.getChildren().add(new ClassTitle(i18n("account.create")));
AdvancedListItem offlineItem = new AdvancedListItem();
offlineItem.getStyleClass().add("navigation-drawer-item");
offlineItem.setActionButtonVisible(false);
offlineItem.setTitle(i18n("account.methods.offline"));
offlineItem.setLeftGraphic(wrap(SVG.account(Theme.blackFillBinding(), 24, 24)));
offlineItem.setOnAction(e -> Controllers.dialog(new CreateAccountPane(Accounts.FACTORY_OFFLINE)));
left.getChildren().add(offlineItem);
AdvancedListItem mojangItem = new AdvancedListItem();
mojangItem.getStyleClass().add("navigation-drawer-item");
mojangItem.setActionButtonVisible(false);
mojangItem.setTitle(i18n("account.methods.yggdrasil"));
mojangItem.setLeftGraphic(wrap(SVG.mojang(Theme.blackFillBinding(), 24, 24)));
mojangItem.setOnAction(e -> Controllers.dialog(new CreateAccountPane(Accounts.FACTORY_MOJANG)));
left.getChildren().add(mojangItem);
AdvancedListItem microsoftItem = new AdvancedListItem();
microsoftItem.getStyleClass().add("navigation-drawer-item");
microsoftItem.setActionButtonVisible(false);
microsoftItem.setTitle(i18n("account.methods.microsoft"));
microsoftItem.setLeftGraphic(wrap(SVG.microsoft(Theme.blackFillBinding(), 24, 24)));
microsoftItem.setOnAction(e -> Controllers.dialog(new CreateAccountPane(Accounts.FACTORY_MICROSOFT)));
left.getChildren().add(microsoftItem);
left.getChildren().add(new ClassTitle(i18n("account.methods.authlib_injector")));
{ {
VBox wrapper = new VBox(); VBox boxItemList = new VBox();
FXUtils.setLimitWidth(wrapper, 200); boxItemList.getStyleClass().add("advanced-list-box-content");
VBox box = new VBox(); boxItemList.getChildren().add(new ClassTitle(i18n("account.create")));
authServerItems = MappedObservableList.create(skinnable.authServersProperty(), server -> {
AdvancedListItem item = new AdvancedListItem();
item.getStyleClass().add("navigation-drawer-item");
item.setLeftGraphic(SVG.server(Theme.blackFillBinding(), 24, 24));
item.setOnAction(e -> Controllers.dialog(new CreateAccountPane(server)));
JFXButton btnRemove = new JFXButton(); {
btnRemove.setOnAction(e -> { VBox boxMethods = new VBox();
skinnable.authServersProperty().remove(server); FXUtils.setLimitWidth(boxMethods, 200);
e.consume();
AdvancedListItem offlineItem = new AdvancedListItem();
offlineItem.getStyleClass().add("navigation-drawer-item");
offlineItem.setActionButtonVisible(false);
offlineItem.setTitle(i18n("account.methods.offline"));
offlineItem.setLeftGraphic(wrap(SVG.account(Theme.blackFillBinding(), 24, 24)));
offlineItem.setOnAction(e -> Controllers.dialog(new CreateAccountPane(Accounts.FACTORY_OFFLINE)));
boxMethods.getChildren().add(offlineItem);
AdvancedListItem mojangItem = new AdvancedListItem();
mojangItem.getStyleClass().add("navigation-drawer-item");
mojangItem.setActionButtonVisible(false);
mojangItem.setTitle(i18n("account.methods.yggdrasil"));
mojangItem.setLeftGraphic(wrap(SVG.mojang(Theme.blackFillBinding(), 24, 24)));
mojangItem.setOnAction(e -> Controllers.dialog(new CreateAccountPane(Accounts.FACTORY_MOJANG)));
boxMethods.getChildren().add(mojangItem);
AdvancedListItem microsoftItem = new AdvancedListItem();
microsoftItem.getStyleClass().add("navigation-drawer-item");
microsoftItem.setActionButtonVisible(false);
microsoftItem.setTitle(i18n("account.methods.microsoft"));
microsoftItem.setLeftGraphic(wrap(SVG.microsoft(Theme.blackFillBinding(), 24, 24)));
microsoftItem.setOnAction(e -> Controllers.dialog(new CreateAccountPane(Accounts.FACTORY_MICROSOFT)));
boxMethods.getChildren().add(microsoftItem);
VBox boxAuthServers = new VBox();
authServerItems = MappedObservableList.create(skinnable.authServersProperty(), server -> {
AdvancedListItem item = new AdvancedListItem();
item.getStyleClass().add("navigation-drawer-item");
item.setLeftGraphic(wrap(SVG.server(Theme.blackFillBinding(), 24, 24)));
item.setOnAction(e -> Controllers.dialog(new CreateAccountPane(server)));
JFXButton btnRemove = new JFXButton();
btnRemove.setOnAction(e -> {
skinnable.authServersProperty().remove(server);
e.consume();
});
btnRemove.getStyleClass().add("toggle-icon4");
btnRemove.setGraphic(SVG.close(Theme.blackFillBinding(), 14, 14));
item.setRightGraphic(btnRemove);
ObservableValue<String> title = BindingMapping.of(server, AuthlibInjectorServer::getName);
item.titleProperty().bind(title);
item.subtitleProperty().set(URI.create(server.getUrl()).getHost());
Tooltip tooltip = new Tooltip();
tooltip.textProperty().bind(Bindings.format("%s (%s)", title, server.getUrl()));
FXUtils.installFastTooltip(item, tooltip);
return item;
}); });
btnRemove.getStyleClass().add("toggle-icon4"); Bindings.bindContent(boxAuthServers.getChildren(), authServerItems);
btnRemove.setGraphic(SVG.close(Theme.blackFillBinding(), 14, 14)); boxMethods.getChildren().add(boxAuthServers);
item.setRightGraphic(btnRemove);
ObservableValue<String> title = BindingMapping.of(server, AuthlibInjectorServer::getName); boxItemList.getChildren().add(new ScrollPane(boxMethods));
String url = server.getUrl(); }
item.titleProperty().bind(title);
item.subtitleProperty().set(url);
Tooltip tooltip = new Tooltip();
tooltip.textProperty().bind(Bindings.format("%s (%s)", title, url));
FXUtils.installFastTooltip(item, tooltip);
return item; left.setCenter(boxItemList);
}); }
Bindings.bindContent(box.getChildren(), authServerItems);
{
AdvancedListItem addAuthServerItem = new AdvancedListItem(); AdvancedListItem addAuthServerItem = new AdvancedListItem();
addAuthServerItem.getStyleClass().add("navigation-drawer-item"); addAuthServerItem.getStyleClass().add("navigation-drawer-item");
addAuthServerItem.setTitle(i18n("account.injector.add")); addAuthServerItem.setTitle(i18n("account.injector.add"));
addAuthServerItem.setSubtitle(i18n("account.methods.authlib_injector"));
addAuthServerItem.setActionButtonVisible(false); addAuthServerItem.setActionButtonVisible(false);
addAuthServerItem.setLeftGraphic(SVG.plusCircleOutline(Theme.blackFillBinding(), 24, 24)); addAuthServerItem.setLeftGraphic(wrap(SVG.plusCircleOutline(Theme.blackFillBinding(), 24, 24)));
addAuthServerItem.setOnAction(e -> Controllers.dialog(new AddAuthlibInjectorServerPane())); addAuthServerItem.setOnAction(e -> Controllers.dialog(new AddAuthlibInjectorServerPane()));
BorderPane.setMargin(addAuthServerItem, new Insets(0, 0, 12, 0));
wrapper.getChildren().addAll(box, addAuthServerItem); left.setBottom(addAuthServerItem);
left.getChildren().add(new ScrollPane(wrapper));
} }
FXUtils.setLimitWidth(left, 200);
root.setLeft(left); root.setLeft(left);
} }

View File

@@ -132,7 +132,7 @@ public class AddAuthlibInjectorServerPane extends StackPane implements DialogAwa
@FXML @FXML
private void onAddFinish() { private void onAddFinish() {
if (!config().getAuthlibInjectorServers().contains(serverBeingAdded)) { if (!config().getAuthlibInjectorServers().contains(serverBeingAdded)) {
config().getAuthlibInjectorServers().add(0, serverBeingAdded); config().getAuthlibInjectorServers().add(serverBeingAdded);
} }
fireEvent(new DialogCloseEvent()); fireEvent(new DialogCloseEvent());
} }

View File

@@ -62,7 +62,7 @@ import static org.jackhuang.hmcl.ui.FXUtils.*;
import static org.jackhuang.hmcl.util.i18n.I18n.i18n; import static org.jackhuang.hmcl.util.i18n.I18n.i18n;
import static org.jackhuang.hmcl.util.javafx.ExtendedProperties.classPropertyFor; import static org.jackhuang.hmcl.util.javafx.ExtendedProperties.classPropertyFor;
public class CreateAccountPane extends JFXDialogLayout { public class CreateAccountPane extends JFXDialogLayout implements DialogAware {
private boolean showMethodSwitcher; private boolean showMethodSwitcher;
private AccountFactory<?> factory; private AccountFactory<?> factory;
@@ -424,6 +424,12 @@ public class CreateAccountPane extends JFXDialogLayout {
public void selectAuthServer(AuthlibInjectorServer authserver) { public void selectAuthServer(AuthlibInjectorServer authserver) {
cboServers.getSelectionModel().select(authserver); cboServers.getSelectionModel().select(authserver);
} }
public void focus() {
if (txtUsername != null) {
txtUsername.requestFocus();
}
}
} }
private static class DialogCharacterSelector extends BorderPane implements CharacterSelector { private static class DialogCharacterSelector extends BorderPane implements CharacterSelector {
@@ -486,4 +492,11 @@ public class CreateAccountPane extends JFXDialogLayout {
} }
} }
} }
@Override
public void onDialogShown() {
if (detailsPane instanceof AccountDetailsInputPane) {
((AccountDetailsInputPane) detailsPane).focus();
}
}
} }