JavaFX focus on tab's content upon switch - javafx

Question

I have a TabPane with a TextArea inside each of its Tabs.
What I want to achieve is when switching tabs, the textArea get focused.
I tried with a listener but it doesn't seem to work :
#FXML
public void initialize() {
for(Tab tab : tabPane.getTabs())
{
tab.setOnSelectionChanged(event->
{
if(tab.isSelected())
{
System.out.println(tab.getText());
TextArea ta = (TextArea)((AnchorPane)tab.getContent()).getChildren().get(0);
ta.requestFocus();
}
});
}
}
When I switch tabs, the output shows the active tab title but it stays focused, how can I focus on the TextArea after switching?
Thanks!

Answer 1

While it's not unusual that node.requestFocus() doesn't focus the node as expected (with the usual slightly smelly way around of wrapping it into Platform.runlater()) I'm interested why exactly it doesn't work in this context.
Turned out that one technical reason is that at the time of getting notified by any of the selection properties (selectedItem/-Index, isSelected) the node is not yet in a visible parent hierarchy - so it can't be a valid focus target. To see, add a println to the onSelected handler:
Node tabContent = tab.getContent();
if (tab.isSelected() && tab.getContent() != null && tab.getContent().getParent() != null ) {
System.out.println("onSelection " + tab.getText()
+ tabContent.getParent().isVisible());
}
That is due to skin's layout/management of tabs: the content of each is wrapped into a specialized StackPane (TabContentRegion), all these are stacked on top of each other with only the selected with its visibility property true.
So a first approximation for a solution is to register a listener to the visibility property of that container: when changed to true, its children should be eligable as focus targets. Which in fact they are .. just .. the TabPaneBehavior is interfering by forcing the focus onto the tabPane itself whenever selection is changed by user interaction (both by clicking the tab header and using ctrl-tab)
// unconditionally by mouse
new MouseMapping(MouseEvent.MOUSE_PRESSED, e -> getNode().requestFocus())
// method called by keyMappings that move the selection
private void moveSelection(int startIndex, int delta) {
final TabPane tabPane = getNode();
if (tabPane.getTabs().isEmpty()) return;
int tabIndex = findValidTab(startIndex, delta);
if (tabIndex > -1) {
final SelectionModel<Tab> selectionModel = tabPane.getSelectionModel();
selectionModel.select(tabIndex);
}
tabPane.requestFocus();
}
Next round: let the tabPane pass-on the focus whenever it gets focused during selection change. One sentence posing two stumble stones:
there is no public api to support transfer focus, it must be hacked around, f.i. by manually firing a TAB
during selection change needs state logic to decide its start and end
In all, looks like a task for a custom skin which is outlined (beware: not formally tested!) in the example below (it's for fx11, fx8 might be similar but requires to access internal classes because skins are not yet public)
public class TabPaneFocusOnSelectionSO extends Application {
/**
* Custom skin that tries to focus the first child of selected tab when
* selection changed.
*
*/
public static class MyTabPaneSkin extends TabPaneSkin {
private boolean selecting = true;
/**
* #param control
*/
public MyTabPaneSkin(TabPane control) {
super(control);
// TBD: dynamic update on changing tabs at runtime
addTabContentVisibilityListener(getChildren());
registerChangeListener(control.focusedProperty(), this::focusChanged);
registerChangeListener(control.getSelectionModel().selectedItemProperty(), e -> {
selecting = true;
});
}
/**
* Callback from listener to skinnable's focusedProperty.
*
* #param focusedProperty the property that's changed
*/
protected void focusChanged(ObservableValue focusedProperty) {
if (getSkinnable().isFocused() && selecting) {
transferFocus();
selecting = false;
}
}
/**
* Callback from listener to tab visibility.
*
* #param visibleProperty the property that's changed
*/
protected void tabVisibilityChanged(ObservableValue visibleProperty) {
BooleanProperty b = (BooleanProperty) visibleProperty;
if (b.get()) {
transferFocus();
}
}
/**
* No public api to transfer focus "away" from any node, hack by firing
* a TAB key on the TabPane.
*/
protected void transferFocus() {
final KeyEvent tabEvent = new KeyEvent(KeyEvent.KEY_PRESSED, "", "",
KeyCode.TAB, false, false, false, false);
Event.fireEvent(getSkinnable(), tabEvent);
}
/**
* Register the visibilityListener to each child in the given list that
* is a TabContentArea.
*
*/
protected void addTabContentVisibilityListener(List<? extends Node> children) {
children.forEach(node -> {
if (node.getStyleClass().contains("tab-content-area")) {
registerChangeListener(node.visibleProperty(), this::tabVisibilityChanged);
}
});
}
}
private TabPane tabPane;
private Parent createContent() {
tabPane = new TabPane() {
#Override
protected Skin<?> createDefaultSkin() {
return new MyTabPaneSkin(this);
}
};
for (int i = 0; i < 3; i++) {
VBox tabContent = new VBox();
tabContent.getChildren().addAll(new Button("dummy " +i), new TextField("just a field " + i));
Tab tab = new Tab("Tab " + i, tabContent);
tabPane.getTabs().add(tab);
}
tabPane.getTabs().add(new Tab("no content"));
tabPane.getTabs().add(new Tab("not focusable content", new Label("me!")));
BorderPane content = new BorderPane(tabPane);
return content;
}
#Override
public void start(Stage stage) throws Exception {
stage.setScene(new Scene(createContent()));
stage.setTitle(" TabPane with custom skin ");
stage.show();
}
public static void main(String[] args) {
launch(args);
}
}