MaterialFX

MaterialFX copied to clipboard

It would be a great addition to the library if an element like MFXFrieldGroup was provided, it could act somehow like a fieldset element in HTML but with a material look.

The screenshot does not have material look, but it provides an idea.

That would be very useful to have group fields, especially check and radio boxes that are part of a group, for example currently these groups don't provide any way to label the group, you have to place the label manually.

UPDATE: Just a simple example of what I'm currently doing to achieve the above-mentioned result:

The fxml code:

<Pane layoutX="8.0" layoutY="225.0" prefHeight="51.0" prefWidth="231.0" styleClass="fieldset">
   <children>
      <MFXRadioButton layoutX="14.0" layoutY="17.0" text="Male">
         <toggleGroup>
            <ToggleGroup fx:id="gender" />
         </toggleGroup>
      </MFXRadioButton>
      <MFXRadioButton layoutX="111.0" layoutY="17.0" text="Female" toggleGroup="$gender" />
      <Label layoutX="8.0" layoutY="-10.0" styleClass="fieldset-title" text="Gender" />
   </children>
</Pane>

The CSS code:

.fieldset {
    -mfx-main: -mfx-purple;
    -fx-background-color: white;
    -fx-background-radius: 5;
    -fx-border-color: lightgray;
    -fx-border-radius: 5;
    -fx-padding: 5;
}

.fieldset .fieldset-title {
    -fx-padding: 0 3;
    -fx-font-family: "Open Sans Regular";
    -fx-text-fill: -mfx-text-he;
    -fx-background-color: white;
}

@panosru You can start a pull request for this feature if you want and see if it gets approved.

I can't process this request as of now sorry, I'm really busy today I'll make sure to reply tomorrow

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

Sorry for the late response, I'm too much busy lately

So, I think your solution is quite good actually. I don't really see the utility of a MFXFieldGroup since it is basically a container (in this case a Pane) with a bunch of fields inside and a label which is the title of the group. Also, rather than considering only text fields I'd rather generalize the concept and allow any control to be in the group. But at this point the Pane is just a decorator for another region. Let's assume you have a login interface. So, you have two fields and maybe a bunch of buttons (to confirm, cancel of whatever). Ideally you want to place the two fields one below the other(vertical) and the two buttons one after the other(horizontal). As you can see the layout is pretty complex, so you would probably use a GridPane to make things easier or a combination of other panes. So the Pane which identifies this group would basically be a "decoration" at this point. It should be pretty basic to make with a custom skin

I'll leave this open in case I change my mind in the future and decide to implement it but I can't make any promise. As @Tech-Expert-Wizard also suggested you can implement the feature and send a PR, I will gladly review it and once it's good to go merge it