Collapsing borders in JavaFX 8

Hey there! I'm having a little issue with JavaFX 8 components. I'm trying to make them sit next to each other with borders, but it's not quite working out. Is there a way to make them blend together and share one border?

import javafx.geometry.Pos;
import javafx.scene.Parent;
import javafx.scene.control.Label;
import javafx.scene.layout.VBox;

public class SettingsList {

    private VBox root;

    private String[] settingsList = new String[]{"set1", "set2", "set3"};

    public SettingsList(){

    }

    public Parent getControl(){
        root = new VBox();
        root.setAlignment(Pos.CENTER);
        root.getStylesheets().add(getClass().getResource("settingList.css").toExternalForm());
        for(String settingName: settingsList){
            Label settingLabel = new Label(settingName);
            settingLabel.getStyleClass().add("setting-label");
            root.getChildren().add(settingLabel);
        }

        return root;
    }
}

Answer №1

As far as I know, there is no built-in equivalent to border-collapse. You can handle the first one separately:

boolean isFirst = true ; 
for(String itemName: itemList){
    Label itemLabel = new Label(itemName);
    itemLabel.getStyleClass().add("item-label");
    if (isFirst) {
        itemLabel.getStyleClass().add("first-item");
    }
    isFirst = false ;
    root.getChildren().add(itemLabel);
}

Then, in the CSS file:

.item-label {
    -fx-label-padding: 10 ;
    -fx-border-color: black ;
    -fx-border-width: 0 1 1 1 ;
}
.item-label.first-item {
    -fx-border-width: 1 ;
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Drop-down functionality in Bootstrap Form becomes unresponsive after screen width is decreased

I recently encountered a strange issue with my simple Bootstrap form. When I resize my browser width to mobile size or view it on a mobile device, the form stops functioning properly. Unfortunately, I am unable to provide any specific code examples at this ...

Dynamically updating the ng-class name in AngularJS

Exploring the integration of animate.css with AngularJS. Attempting to assign a class to an element on ng-click, but facing difficulties in updating the element. Various strategies were attempted, including modifying scope values through functions, without ...

Separate the label and content sections in an Angular Material vertical stepper

After applying the following CSS: mat-step-header{ display: flex ; justify-content: flex-end ; } I am attempting to make this stepper function properly. I have implemented Angular Material design for a vertical stepper. How can I position the steppe ...

Arrange list items dynamically using ajax

I am attempting to adjust the positioning of the scrollable list item depending on whether a message was sent by a user or another party. However, my current method is not yielding the desired results. I have experimented with adding .css('position&a ...

Customizing Material UI Stepper styles using CSS API

I am trying to customize the text color (represented by an SVG Icon) in Material UI StepIcon for active and completed steps only. Currently, I have successfully changed the icon color for those steps. This is how my custom MuiTheme appears: export default ...

Learn the method for printing CSS outlines and background colors in IE8 using JQuery's printElement feature

Printing my HTML calendar table in Chrome results in a perfect display. However, when I try to print it in IE8, the background colors and images are not included. Despite following steps from a helpful post on setting it as the default option, there were n ...

I am currently exploring the ExpectedConditions class in search of the onChange method

During testing of the application I am currently working on, I have observed that when I click a submit button, a grid refreshes. There is a row count available to me in a span element, and my intention was to achieve something like: (new WebDriverWait(dr ...

The MySQL Query Maker

To fetch data from a database for only one row and then generate separate pieces of information, use the following code: <?php session_start(); ob_start(); error_reporting(E_ERROR | E_WARNING | E_PARSE); ini_set("display_errors", 1); set_time_limit(1 ...

Having trouble displaying API JSON data in a Vue.js table component

In my HTML file, I have implemented fetching data from an API and displaying it in a table successfully. Now, I am trying to convert the HTML file to use Vue.js, but encountering some issues. Despite being able to fetch data from the API with Vue, the tab ...

Tips for customizing Material-UI Switch button appearance

Is there a way to remove the box-shadow on the thumb of the Switch button when it's disabled? I've tried various methods like adding the box-shadow in the switchBase and removing it from the thumb, but it affects the parent element as well. Anoth ...

Validating Java Objects to Json with GSON

When using the GSON API to convert a Java object to a Json string, I need the conversion to fail if any of the annotated attributes are null. For instance: public class Order{ @SerializedName("orderId") @Expose @Required private Integer id; //getter &a ...

"Resolving issue with Android's filterResults() displaying multiple identical items

I encountered an error while using my implemented function filterResults(). The issue arises when I search for a city multiple times in the edit text field. Initially, everything works fine after the first search. However, subsequent searches result in dup ...

The @Test method does not wait for Selenium code to finish executing before moving on to the

package demoActitime; import java.util.concurrent.TimeUnit; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.firefox.FirefoxDriver; import org.testng.Assert; import org ...

Having trouble getting the jQuery click event to work on iPhone browsers? Despite already trying the cursor:pointer; method

I am facing an issue with setting a click event on anchor tags in my WordPress site. Surprisingly, the event works perfectly fine on all of my devices including PC, Android phone, and tablet except for my iPhone. Despite trying to set the 'Cursor&apo ...

Exploring the various functions of Android ListView

Currently, I am populating a custom ListView with data from a JSON request and would like to add an OnItemClickListener. Here is how I have implemented it: ListView lv = (ListView) findViewById(R.id.MessageList); lv.setOnItemClickListener(new android. ...

Can I receive the latest trending topics from YouTube?

My current project involves tracking the latest trends on Youtube. I am looking for a way to retrieve the JSON Object so that I can integrate it into my Java code efficiently. ...

Manipulate the timing of css animations using javascript

I am currently working with a progress bar that I need to manipulate using JavaScript. The demo of the progress bar has a smooth animation, but when I try to adjust its width using jQuery $($0).css({'width': '80%'}), the animation disap ...

Text alignment and block dimensions

I attempted to organize three buttons within a block. <link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.0.3/tailwind.min.css" rel="stylesheet"/> <div class="grid grid-cols-1 md:grid-cols-3 text-center place-content-center"> ...

What is the specific use of the second app.css file in Laravel?

I'm currently delving into Laravel 8, and I'm perplexed by the role of Resources\css\app.css. While every other component in the Resources directory serves a clear function, the app.css file appears to be empty. Even when I attempt to a ...

Creating a list of items using HTML tags should be coded in a way that fits neatly within the main container element

UPDATE: I've come across this code that seems to be functioning somewhat as desired. You can view it live at UPDATE - It's still not aligning properly within the #main div! I've experimented with both 100% and 990px for width in #menu span, ...