*Arabic text styled in italics using JavaFX*

I'm having an issue trying to italicize Arabic text, It just won't work, I've experimented with different fonts as well, but none seem to be working, Here's the code snippet:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.AnchorPane;
import javafx.scene.text.Text;
import javafx.stage.Stage;


public class JavafxApp extends Application {

    public static void main(String[] args) {
        launch(args);
    }

    @Override
    public void start(Stage primaryStage) {
        var pane = new AnchorPane();
        var text = new Text("عربي English");
        text.setLayoutX(50);
        text.setLayoutY(100);
        text.setStyle("-fx-font-style: italic; -fx-font-size: 18; -fx-font- 
        family : Simplified Arabic;");
        pane.getChildren().add(text);
        var scene = new Scene(pane, 200, 200);
        primaryStage.setScene(scene);
        primaryStage.show();

    }
}

Check out the result here,

Any advice or solutions? I would really appreciate it

Answer №1

One possible reason for your issue could be the lack of an ITALIC version of your font in your Windows fonts folder. JavaFX does not have the ability to generate bold or italic fonts if no font of that style is available.

For more information, refer to: JDK-8091064 & JDK-8130526

This implies that you will need to ensure there is an italic font included in your font family.

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

Difficulty encountered while setting up jQuery slider

I am struggling to set up a jquery slider (flexslider) It seems like I am overlooking something very fundamental, but for some reason I just can't figure it out. Any assistance would be greatly appreciated. Please check out the link to the test site ...

Guide to creating a dynamic amount of slides in a React carousel for optimal responsiveness

Looking for a solution to adjust the number of elements displayed in my React Carousel based on available size? I have a React Carousel that currently shows 3 elements at one time. Here is the code snippet: const RCarousel = ({items}) => { const numIt ...

Create an HTML component that expands to fill any leftover space on the page, without using flex

In my current situation, I have two elements positioned side by side with dynamic widths based on their content. The element on the right needs to fill up as much vertical space as possible without a set width. I am looking for an alternative to flexbox d ...

Can a CSS <div> element have margins applied to it?

Can a margin be defined for a text area? My WYSIWYG editor wraps my text within <div> tags instead of using line breaks <br /> So I was thinking of adding a margin to the <div> tag? Is this possible in CSS? If so, how can it be done? ...

Fixed position toolbar within a container positioned beside a dynamically sized sidebar navigation

I'm trying to figure out how to create a fixed toolbar that fills the remaining width of the page when a side nav is collapsible. Setting the width to 100% causes it to overflow the page due to the dynamic nature of the side nav. Using calc() isn&apos ...

Looking for assistance in creating contemporary gallery labels?

I am in the process of creating a portfolio website and I want to showcase some of my work from middle school. However, I would like to add a label to differentiate it from my current work. The gallery features various images with different dimensions dis ...

I am not getting any emails when users click on the "Pay Now" button

I am currently learning PHP and working on a website that integrates with the paytm gateway. I have a registration page with a "Pay Now" button, but when someone clicks on it, they are directed to pgRedirect.php (provided by paytm). I would like to recei ...

Is the "footer" div automatically nested within the "main" div if they are not nested in the code?

Within my code structure, I currently have the following: <html> <head> ... </head> <body> <div id="body"> <div id="main"> ... </div> <div id="foot ...

IE does not support hover effects

Having trouble with a hover effect that works in Chrome but not in MSIE. Are there any alternatives or fixes to make it work in MSIE? The hover/rollover effects I've tried all seem to have this issue in IE. normalize.css demo.css set2.css font- ...

Guide to switch background image using querySelector

I am currently trying to figure out how to set the background image of a div block by using querySelector. I have attempted various methods in my test code below, but unfortunately none seem to be working. Can someone please provide assistance? <!DOC ...

Unresponsive CSS styles on a specific DIV element

Here is the HTML code I am currently working with: <body> <section id="info"> <div class="status"> ... I have been attempting to apply styles to the div with a class of 'status' using my CSS file linke ...

Is there a way to insert text onto an Isotope image?

I recently created a portfolio using Isotope and Jquery, but I am struggling to add descriptive text to my images without disrupting the layout of the portfolio. I have experimented with various options such as using position:relative for the images and p ...

Scrolling behavior in two columns with sticky positioning

Both columns have varying heights, with the left sometimes higher than the right. I want them to start scrolling down simultaneously, but when the shorter column's content ends, it should stick to the bottom of the viewport and "wait" until the taller ...

Ensuring a @keyframe animation remains constant for the entire duration of the user's visit to the webpage using CSS

How can I create a continuous @keyframe animation that stays active for the duration of the user's visit to my webpage? I've implemented several color animations on my website, each with a specific duration. Is there a way to make these color ch ...

Experiencing issues with ngx-masonry functionality in Angular application, resulting in images appearing clustered and overlapping

Working on a layout design in Angular 9 and utilizing the ngx-masonry package (https://www.npmjs.com/package/ngx-masonry) to achieve a specific grid structure. Here’s a snippet of my code: <div class="container pt-5"> <ngx-masonry ...

Controlling the position of a <div> element using JavaScript

Is there a way to adjust the position and size of a <div>? I have already set it to float with this CSS code: div.grid_tooltip { position: absolute; left: 0px; top: 0px; } ...

Utilizing window.matchMedia in Javascript to retain user selections during page transitions

I am encountering difficulties with the prefers-color-scheme feature and the logic I am attempting to implement. Specifically, I have a toggle on my website that allows users to override their preferred color scheme (black or light mode). However, I am fac ...

Display the value of a shortened string

My Goal I aim to develop a method for determining the amount of a string visible before it gets cut off. Motivation In my project, there is a collection of items that can be chosen. A panel presents a concatenated string of the selected item names separa ...

Removing a CSS Class Using Tampermonkey: A Step-by-Step Guide

I'm completely new to CSS and javascript, so please bear with me. My goal is to remove the class disable-stream from each of the div elements located under the div with the class "stream-notifications". Below is an image for reference: Even though I ...

What is the best way to position a search icon on the right side using CSS?

I am trying to figure out how to display a search icon image on the right side using CSS, but so far I have been unsuccessful. Here is the code that I have: The CSS code: .search { background: url(../images/icons/search.png) no-repeat; display:in ...