如何在RadioButton上将图形和文本对齐到相对的两侧

huangapple
go评论98阅读模式
英文:

How to align graphic and text to opposite sides on a RadioButton

问题

如何左对齐这些按钮的图标并右对齐文本（Java8）？

  1. <dependencies>
  2.     <dependency>
  3.         <groupId>de.jensd</groupId>
  4.         <artifactId>fontawesomefx-materialdesignfont</artifactId>
  5.         <version>1.7.22-4</version>
  6.         <type>jar</type>
  7.     </dependency>
  8.     <dependency>
  9.         <groupId>de.jensd</groupId>
  10.         <artifactId>fontawesomefx-commons</artifactId>
  11.         <version>8.15</version>
  12.     </dependency>
  13. </dependencies>

应该更像这样：

  1. [![enter image description here][2]][2]
  1. import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIcon;
  2. import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIconView;
  3. import javafx.application.Application;
  4. import javafx.scene.Scene;
  5. import javafx.scene.control.RadioButton;
  6. import javafx.scene.control.ToggleGroup;
  7. import javafx.scene.layout.VBox;
  8. import javafx.stage.Stage;
  10. public class Main extends Application {
  12.     public static void main(String[] args) {
  13.         launch(args);
  14.     }
  16.     @Override
  17.     public void start(Stage primaryStage) {
  18.         primaryStage.setTitle("Hello World!");
  19.         RadioButton memberButton = new RadioButton("Members");
  20.         memberButton.setGraphic(new MaterialDesignIconView(MaterialDesignIcon.WORKER));
  21.         RadioButton companyButton = new RadioButton("Companies");
  22.         companyButton.setGraphic(new MaterialDesignIconView(MaterialDesignIcon.CITY));
  23.         RadioButton settingsButton = new RadioButton("Settings");
  24.         settingsButton.setGraphic(new MaterialDesignIconView(MaterialDesignIcon.WRENCH));
  26.         stylizeAndSetButtons(memberButton, companyButton, settingsButton);
  28.         VBox root = new VBox();
  29.         root.getChildren().addAll(memberButton, companyButton, settingsButton);
  30.         primaryStage.setScene(new Scene(root, 300, 250));
  31.         primaryStage.show();
  32.     }
  34.     private static void stylizeAndSetButtons(RadioButton... buttons) {
  35.         ToggleGroup group = new ToggleGroup();
  37.         for (RadioButton button : buttons) {
  38.             button.setPrefWidth(150);
  39.             button.setMinHeight(50);
  40.             button.getStyleClass().remove("radio-button");
  41.             button.getStyleClass().add("toggle-button");
  42.             button.getStyleClass().add("default");
  44.             button.setToggleGroup(group);
  45.         }
  46.     }
  47. }
  2. <details>
  3. <summary>英文:</summary>
  4. How do I left align the icon graphic and right align the text of these buttons (Java8)?
  5. &lt;dependencies&gt;
  6. &lt;dependency&gt;
  7. &lt;groupId&gt;de.jensd&lt;/groupId&gt;
  8. &lt;artifactId&gt;fontawesomefx-materialdesignfont&lt;/artifactId&gt;
  9. &lt;version&gt;1.7.22-4&lt;/version&gt;
  10. &lt;type&gt;jar&lt;/type&gt;
  11. &lt;/dependency&gt;
  12. &lt;dependency&gt;
  13. &lt;groupId&gt;de.jensd&lt;/groupId&gt;
  14. &lt;artifactId&gt;fontawesomefx-commons&lt;/artifactId&gt;
  15. &lt;version&gt;8.15&lt;/version&gt;
  16. &lt;/dependency&gt;
  17. &lt;/dependencies&gt;
  18. [![enter image description here][1]][1]    
  19. Should be more like this:
  20. [![enter image description here][2]][2]
  21. import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIcon;
  22. import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIconView;
  23. import javafx.application.Application;
  24. import javafx.scene.Scene;
  25. import javafx.scene.control.RadioButton;
  26. import javafx.scene.control.ToggleGroup;
  27. import javafx.scene.layout.VBox;
  28. import javafx.stage.Stage;
  29. public class Main extends Application
  30. {
  31. public static void main(String[] args)
  32. {
  33. launch(args);
  34. }
  35. @Override
  36. public void start(Stage primaryStage)
  37. {
  38. primaryStage.setTitle(&quot;Hello World!&quot;);
  39. RadioButton memberButton = new RadioButton(&quot;Members&quot;);
  40. memberButton.setGraphic(new MaterialDesignIconView(MaterialDesignIcon.WORKER));
  41. RadioButton companyButton = new RadioButton(&quot;Companies&quot;);
  42. companyButton.setGraphic(new MaterialDesignIconView(MaterialDesignIcon.CITY));
  43. RadioButton settingsButton = new RadioButton(&quot;Settings&quot;);
  44. settingsButton.setGraphic(new MaterialDesignIconView(MaterialDesignIcon.WRENCH));
  45. stylizeAndSetButtons(memberButton, companyButton, settingsButton);
  46. VBox root = new VBox();
  47. root.getChildren().addAll(memberButton, companyButton, settingsButton);
  48. primaryStage.setScene(new Scene(root, 300, 250));
  49. primaryStage.show();
  50. }
  51. private static void stylizeAndSetButtons(RadioButton... buttons)
  52. {
  53. ToggleGroup group = new ToggleGroup();
  54. for (RadioButton button : buttons)
  55. {
  56. button.setPrefWidth(150);
  57. button.setMinHeight(50);
  58. button.getStyleClass().remove(&quot;radio-button&quot;);
  59. button.getStyleClass().add(&quot;toggle-button&quot;);
  60. button.getStyleClass().add(&quot;default&quot;);
  61. button.setToggleGroup(group);
  62. }
  63. }
  64. }
  65. [1]: https://i.stack.imgur.com/vUMeE.png
  66. [2]: https://i.stack.imgur.com/SUrDz.png
  67. </details>
  68. # 答案1
  69. **得分**: 3
  70. 这是实现你想要的方法之一。
  71. 不要使用默认的 `Label`。使用一个包含你的图标、一个占位面板以及一个新的 `Label` 的 `HBox`。
  72. ```java
  73. import javafx.application.Application;
  74. import javafx.geometry.Pos;
  75. import javafx.scene.Scene;
  76. import javafx.scene.control.Label;
  77. import javafx.scene.control.RadioButton;
  78. import javafx.scene.control.ToggleGroup;
  79. import javafx.scene.layout.HBox;
  80. import javafx.scene.layout.Pane;
  81. import javafx.scene.layout.Priority;
  82. import javafx.scene.layout.VBox;
  83. import javafx.stage.Stage;
  84. import org.kordamp.ikonli.javafx.FontIcon;
  85. public class App extends Application {
  86. public static void main(String[] args) {
  87. launch(args);
  88. }
  89. @Override
  90. public void start(Stage primaryStage) {
  91. primaryStage.setTitle("Hello World!");
  92. RadioButton companyButton = new RadioButton();
  93. FontIcon icon = new FontIcon("bi-alarm");
  94. Pane placeHolder = new Pane();
  95. Label label = new Label("Company");
  96. placeHolder.setMaxWidth(Double.MAX_VALUE);
  97. HBox.setHgrow(placeHolder, Priority.ALWAYS);
  98. HBox hbox = new HBox(icon, placeHolder, label);
  99. hbox.setAlignment(Pos.CENTER);
  100. companyButton.setGraphic(hbox);
  101. stylizeAndSetButtons(companyButton);
  102. VBox root = new VBox();
  103. root.getChildren().addAll(companyButton);
  104. primaryStage.setScene(new Scene(root, 300, 250));
  105. primaryStage.show();
  106. }
  107. private static void stylizeAndSetButtons(RadioButton... buttons) {
  108. ToggleGroup group = new ToggleGroup();
  109. for (RadioButton button : buttons) {
  110. button.setPrefWidth(150);
  111. button.setMinHeight(50);
  112. button.getStyleClass().remove("radio-button");
  113. button.getStyleClass().add("toggle-button");
  114. button.getStyleClass().add("default");
  115. button.setToggleGroup(group);
  116. }
  117. }
  118. }

请注意，这里使用了 Ikonli，但思想应该是相同的。

模块信息：

  1. module sed.home.testonesimplefx {
  2.     requires javafx.controls;
  3.     requires org.kordamp.ikonli.core;
  4.     requires org.kordamp.ikonli.javafx;
  5.     requires org.kordamp.ikonli.bootstrapicons;
  6.     exports sed.home.testonesimplefx;
  7. }

依赖项：

  1. <dependency>
  2.     <groupId>org.kordamp.ikonli</groupId>
  3.     <artifactId>ikonli-javafx</artifactId>
  4.     <version>12.3.1</version>
  5. </dependency>
  6. <dependency>
  7.     <groupId>org.kordamp.ikonli</groupId>
  8.     <artifactId>ikonli-bootstrapicons-pack</artifactId>
  9.     <version>12.3.1</version>
  10. </dependency>

注意：这里使用了 Ikonli，但思想应该是相同的。

英文:

Here is one way to do what you want.

Don't use the default Label. Use an HBox with your icon, a spaceholder pane, and a new Label.

Main

  1. import javafx.application.Application;
  2. import javafx.geometry.Pos;
  3. import javafx.scene.Scene;
  4. import javafx.scene.control.Label;
  5. import javafx.scene.control.RadioButton;
  6. import javafx.scene.control.ToggleGroup;
  7. import javafx.scene.layout.HBox;
  8. import javafx.scene.layout.Pane;
  9. import javafx.scene.layout.Priority;
  10. import javafx.scene.layout.VBox;
  11. import javafx.stage.Stage;
  12. import org.kordamp.ikonli.javafx.FontIcon;
  13. public class App extends Application
  14. {
  15. public static void main(String[] args)
  16. {
  17. launch(args);
  18. }
  19. @Override
  20. public void start(Stage primaryStage)
  21. {
  22. primaryStage.setTitle(&quot;Hello World!&quot;);
  23. RadioButton companyButton = new RadioButton();        
  24. FontIcon icon = new FontIcon(&quot;bi-alarm&quot;);
  25. Pane placeHolder = new Pane();
  26. Label label = new Label(&quot;Company&quot;);
  27. placeHolder.setMaxWidth(Double.MAX_VALUE);
  28. HBox.setHgrow(placeHolder, Priority.ALWAYS);
  29. HBox hbox = new HBox(icon, placeHolder, label);
  30. hbox.setAlignment(Pos.CENTER);
  31. companyButton.setGraphic(hbox);
  32. stylizeAndSetButtons( companyButton);
  33. VBox root = new VBox();
  34. root.getChildren().addAll( companyButton);
  35. primaryStage.setScene(new Scene(root, 300, 250));
  36. primaryStage.show();
  37. }
  38. private static void stylizeAndSetButtons(RadioButton... buttons)
  39. {
  40. ToggleGroup group = new ToggleGroup();
  41. for (RadioButton button : buttons)
  42. {
  43. button.setPrefWidth(150);
  44. button.setMinHeight(50);
  45. button.getStyleClass().remove(&quot;radio-button&quot;);
  46. button.getStyleClass().add(&quot;toggle-button&quot;);
  47. button.getStyleClass().add(&quot;default&quot;);
  48. button.setToggleGroup(group);
  49. }
  50. }
  51. }

Module-Info

  1. module sed.home.testonesimplefx {
  2. requires javafx.controls;
  3. requires org.kordamp.ikonli.core;
  4. requires org.kordamp.ikonli.javafx;
  5. requires org.kordamp.ikonli.bootstrapicons;    
  6. exports sed.home.testonesimplefx;
  7. }

Dependencies

  1.         &lt;dependency&gt;
  2. &lt;groupId&gt;org.kordamp.ikonli&lt;/groupId&gt;
  3. &lt;artifactId&gt;ikonli-javafx&lt;/artifactId&gt;
  4. &lt;version&gt;12.3.1&lt;/version&gt;
  5. &lt;/dependency&gt;
  6. &lt;dependency&gt;
  7. &lt;groupId&gt;org.kordamp.ikonli&lt;/groupId&gt;
  8. &lt;artifactId&gt;ikonli-bootstrapicons-pack&lt;/artifactId&gt;
  9. &lt;version&gt;12.3.1&lt;/version&gt;
  10. &lt;/dependency&gt;

Output

如何在RadioButton上将图形和文本对齐到相对的两侧

Note: This uses Ikonli but the ideas should be the same.

huangapple
  • 本文由 发表于 2023年7月13日 21:22:10
  • 转载请务必保留本文链接：https://go.coder-hub.com/76679849.html
  • java
  • javafx
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定