lundi 25 janvier 2016

Change the CodeArea text background on checkbox click

Using RichTextFX I've been able to create a CodeArea which takes a string, and highlights any words that fall into the String[] KEYWORDS array.

I have a checkbox control above the CodeArea which I attach a handler() to in my controller code, so whenever the checkbox is clicked it de-highlights all the highlighted words in the CodeArea. I'm having trouble de-highlighting (making text background white) the text within the CodeArea because the styleClass is defined in a StyleSpans method shown below. Right now everything works except when I click the checkbox, it won't de-highlight the words:

FXML:

<HBox>
   <CheckBox fx:id="highlightBox" mnemonicParsing="false"  prefHeight="25.0" prefWidth="154.0" stylesheets="@styleMain.css" text="Highlight Words" />
</HBox>
<HBox>
   <children>
     <CodeArea fx:id="codeBox" wrapText="true" prefHeight="240.0"    prefWidth="339.0">
     </CodeArea>
   </children>
</HBox>

Java Controller:

@FXML
CheckBox highlightBox;

@FXML
public CodeArea codeBox;

private static final String[] KEYWORDS = new String[] {
 "one",
 "two",
 "three"
};

private static final String KEYWORD_PATTERN = "\\b(" + String.join("|", KEYWORDS) + ")\\b";

private static final Pattern PATTERN = Pattern.compile("(?<KEYWORD>" + KEYWORD_PATTERN + ")");

public static final String demoText = "one two three four five";

@Override
public void initialize(URL location, ResourceBundle resources) {

  //Highlighting  Words
  codeBox.richChanges().subscribe(change -> {
   codeBox.setStyleSpans(0, computeHighlighting(codeBox.getText()));
  });
  codeBox.replaceText(0, 0, demoText);


  highlightBox.setOnAction(new EventHandler < ActionEvent > () {
   @Override
   public void handle(ActionEvent event) {
    codeBox.setStyle("-fx-background-color: blue"); // this should instead change 'highlightKeyWords' background color to white
   }
  });

  ...
 } //End of initialize


public static StyleSpans < Collection < String >> computeHighlighting(String text) {
 Matcher matcher = PATTERN.matcher(text);
 int lastKwEnd = 0;
 StyleSpansBuilder < Collection < String >> spansBuilder = new StyleSpansBuilder < > ();
 while (matcher.find()) {
  String styleClass =
   matcher.group("KEYWORD") != null ? "highlightKeyWords" :
   null; /* never happens */
  assert styleClass != null;
  spansBuilder.add(Collections.emptyList(), matcher.start() - lastKwEnd);
  spansBuilder.add(Collections.singleton(styleClass), matcher.end() - matcher.start());

  lastKwEnd = matcher.end();
 }
 spansBuilder.add(Collections.emptyList(), text.length() - lastKwEnd);
 return spansBuilder.create();
}

In the handler I successfully change the background of the CodeArea to blue but if I instead try propertyOverview.setStyle("-fx-background-fill: blue;");

it doesn't change anything, the words stay highlighted. This is because I should be referencing highlightKeyWords which is created in the computeHighlighting method. Should I use something like highlightKeyWords.setStyle("-fx-background-fill: white") ?

CSS:

.highlightKeyWords{
-fx-font-size:13px;
-fx-background-color: grey;
-fx-background-fill: yellow;
}

Here the -fx-background-fill: yellow; works fine to highlight, but how do I change it to white in the handler?




Aucun commentaire:

Enregistrer un commentaire