Skip to content

Commit

Permalink
Add placeholder enhancement (#899)
Browse files Browse the repository at this point in the history 
* Added place holder to GenericStyledArea
* Added prompt text to StyledTextField
  • Loading branch information
@Jugen
Jugen authored Jan 15, 2020
1 parent c60e07d commit 12bc273
Show file tree
Hide file tree
Showing 2 changed files with 119 additions and 4 deletions.
50 changes: 49 additions & 1 deletion richtextfx/src/main/java/org/fxmisc/richtext/GenericStyledArea.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,8 @@
import java.util.function.IntSupplier;
import java.util.function.IntUnaryOperator;

import javafx.application.Platform;
import javafx.beans.NamedArg;
import javafx.beans.binding.Bindings;
import javafx.beans.property.BooleanProperty;
import javafx.beans.property.DoubleProperty;
import javafx.beans.property.ObjectProperty;
Expand Down Expand Up @@ -371,6 +371,14 @@ public Node getParagraphGraphic( int parNdx ) {
return getCell(parNdx).getGraphic();
}

/**
* This Node is shown to the user, centered over the area, when the area has no text content.
*/
private ObjectProperty<Node> placeHolderProp = new SimpleObjectProperty<>(this, "placeHolder", null);
public final ObjectProperty<Node> placeholderProperty() { return placeHolderProp; }
public final void setPlaceholder(Node value) { placeHolderProp.set(value); }
public final Node getPlaceholder() { return placeHolderProp.get(); }

private ObjectProperty<ContextMenu> contextMenu = new SimpleObjectProperty<>(null);
@Override public final ObjectProperty<ContextMenu> contextMenuObjectProperty() { return contextMenu; }
// Don't remove as FXMLLoader doesn't recognise default methods !
Expand Down Expand Up @@ -787,6 +795,41 @@ public GenericStyledArea(
.subscribe(evt -> Event.fireEvent(this, evt));

new GenericStyledAreaBehavior(this);

// Setup place holder visibility & placement
final Val<Boolean> showPlaceholder = Val.create
(
() -> getLength() == 0 && ! isFocused(),
lengthProperty(), focusedProperty()
);

placeHolderProp.addListener( (ob,oldNode,newNode) -> {
if ( oldNode != null ) {
oldNode.visibleProperty().unbind();
oldNode.layoutXProperty().unbind();
oldNode.layoutYProperty().unbind();
getChildren().remove( oldNode );
setClip( null );
}
if ( newNode != null ) {
newNode.visibleProperty().bind( showPlaceholder );
configurePlaceholder( newNode );
getChildren().add( newNode );
}
});
}

protected void configurePlaceholder( Node placeholder )
{
placeholder.layoutYProperty().bind( Bindings.createDoubleBinding( () ->
(getHeight() - placeholder.getLayoutBounds().getHeight()) / 2,
heightProperty(), placeholder.layoutBoundsProperty() )
);

placeholder.layoutXProperty().bind( Bindings.createDoubleBinding( () ->
(getWidth() - placeholder.getLayoutBounds().getWidth()) / 2,
widthProperty(), placeholder.layoutBoundsProperty() )
);
}

/* ********************************************************************** *
Expand Down Expand Up @@ -1398,6 +1441,11 @@ protected void layoutChildren() {
followCaretRequested = false;
paging = false;
});

Node node = getPlaceholder();
if (node != null && node.isResizable() && node.isManaged()) {
node.autosize();
}
}

/* ********************************************************************** *
Expand Down
73 changes: 70 additions & 3 deletions richtextfx/src/main/java/org/fxmisc/richtext/StyledTextField.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@

import javafx.application.Application;
import javafx.beans.NamedArg;
import javafx.beans.binding.Bindings;
import javafx.beans.property.ObjectProperty;
import javafx.beans.property.ObjectPropertyBase;
import javafx.css.CssMetaData;
Expand All @@ -28,6 +29,10 @@
import javafx.scene.input.KeyEvent;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.paint.Paint;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Text;
import javafx.scene.text.TextAlignment;
import javafx.scene.text.TextFlow;

Expand All @@ -51,19 +56,26 @@ public abstract class StyledTextField<PS, S> extends StyledTextArea<PS, S>
"-fx-alignment", (StyleConverter<?,TextAlignment>) StyleConverter.getEnumConverter(TextAlignment.class),
TextAlignment.LEFT, s -> (StyleableObjectProperty) s.alignmentProperty()
);

private final static CssMetaData<StyledTextField,Paint> PROMPT_TEXT_FILL = new CustomCssMetaData<>(
"-fx-prompt-text-fill", (StyleConverter<?,Paint>) StyleConverter.getPaintConverter(),
Color.GRAY, s -> (StyleableObjectProperty) s.promptTextFillProperty()
);

private final static Pattern VERTICAL_WHITESPACE = Pattern.compile( "\\v+" );
private final static String STYLE_SHEET;
private final static double HEIGHT;
static {
List<CssMetaData<? extends Styleable, ?>> styleables = new ArrayList<>(GenericStyledArea.getClassCssMetaData());
styleables.add( PROMPT_TEXT_FILL ); styleables.add( TEXT_ALIGNMENT );
CSS_META_DATA_LIST = Collections.unmodifiableList(styleables);

String globalCSS = System.getProperty( "javafx.userAgentStylesheetUrl" ); // JavaFX preference!
if ( globalCSS == null ) globalCSS = Application.getUserAgentStylesheet();
if ( globalCSS == null ) globalCSS = Application.STYLESHEET_MODENA;
globalCSS = "styled-text-field-"+ globalCSS.toLowerCase() +".css";
STYLE_SHEET = StyledTextField.class.getResource( globalCSS ).toExternalForm();

List<CssMetaData<? extends Styleable, ?>> styleables = new ArrayList<>(GenericStyledArea.getClassCssMetaData());
styleables.add(TEXT_ALIGNMENT); CSS_META_DATA_LIST = Collections.unmodifiableList(styleables);

// Ugly hack to get a TextFields default height :(
// as it differs between Caspian, Modena, etc.
TextField tf = new TextField( "GetHeight" );
Expand All @@ -73,6 +85,7 @@ public abstract class StyledTextField<PS, S> extends StyledTextArea<PS, S>

private boolean selectAll = true;
private StyleableObjectProperty<TextAlignment> textAlignment;
private StyleableObjectProperty<Paint> promptFillProp;


public StyledTextField(@NamedArg("initialParagraphStyle") PS initialParagraphStyle,
Expand Down Expand Up @@ -194,6 +207,60 @@ public String getName() {
public final EventHandler<ActionEvent> getOnAction() { return onActionProperty().get(); }
public final void setOnAction(EventHandler<ActionEvent> value) { onActionProperty().set(value); }


/**
* The prompt text to display or <tt>null</tt> if no prompt text is to be displayed.
* <p>The Text will be aligned according to the text fields alignment setting and have a default
* text fill of GRAY unless you have changed it by any means, e.g. with CSS "-fx-prompt-text-fill"
*/
public final ObjectProperty<? super Text> promptTextProperty() { return placeholderProperty(); }
public final Text getPromptText() { return getPlaceholder() instanceof Text ? (Text) getPlaceholder() : null; }
public final void setPromptText( Text value ) { setPlaceholder( value ); }
@Override protected void configurePlaceholder( Node placeholder )
{
placeholder.layoutYProperty().bind( Bindings.createDoubleBinding( () ->
(getHeight() - placeholder.getLayoutBounds().getHeight()) / 2 + Math.abs( placeholder.getLayoutBounds().getMinY() ),
heightProperty(), placeholder.layoutBoundsProperty() )
);

placeholder.layoutXProperty().bind( Bindings.createDoubleBinding( () -> calcHorizontalPos(),
widthProperty(), placeholder.layoutBoundsProperty(), paddingProperty(), alignmentProperty() )
);

if ( placeholder instanceof Text && ((Text) placeholder).getFill() == Color.BLACK ) {
((Text) placeholder).fillProperty().bind( promptTextFillProperty() );
}
}

private final ObjectProperty<Paint> promptTextFillProperty() {
if ( promptFillProp == null ) {
promptFillProp = new CustomStyleableProperty<>( Color.GRAY, "promptFill", this, PROMPT_TEXT_FILL );
}
return promptFillProp;
}

private double calcHorizontalPos()
{
double leftPad = getPadding().getLeft();
double rightPad = getPadding().getRight();
double promptWidth = getPlaceholder().getLayoutBounds().getWidth();
TextAlignment alignment = getAlignment();
double alignmentPadding = leftPad;

if ( alignment == TextAlignment.RIGHT ) alignmentPadding = rightPad;
else if ( alignment == TextAlignment.CENTER ) alignmentPadding = 0;

if ( promptWidth < (getWidth() - alignmentPadding) ) setClip( null );
else setClip( new Rectangle( getWidth(), getHeight() ) );

switch ( alignment )
{
case CENTER : return (getWidth() - promptWidth) / 2;
case RIGHT : return getWidth() - rightPad - promptWidth;
default : return leftPad;
}
}

@Override
public void replaceText( int start, int end, String text )
{
Expand Down

0 comments on commit 12bc273

Please sign in to comment.