ReactFX - "ленивая" область поиска в реальном времени
Новое в реактивном программировании здесь.
Я пытаюсь реализовать "ленивую" область поиска в реальном времени в JavaFX с помощью ReactFX. Под ленивым здесь я подразумеваю, что он выполняет поиск, как только пользователь перестает печатать на одну секунду. Код для этого был довольно прост:
EventStream<Change<String>> textEvents = EventStreams.changesOf(textArea.textProperty())
.successionEnds(Duration.ofSeconds(1));
Затем подпишитесь на этот поток событий и вуаля.
Но я также хочу, чтобы он выполнял поиск мгновенно, если пользователь нажимает Enter. Я не уверен, как это сделать "реактивным" способом. Простое выполнение поиска по ключевым событиям Enter приводит к тому, что поиск запускается дважды (один для ключевого события и один для изменения текста), так что это мое текущее решение:
BooleanProperty hasSearched = new SimpleBooleanProperty(false);
EventStream<KeyEvent> enterKeyPressedEvents = EventStreams.eventsOf(textArea, KeyEvent.KEY_PRESSED)
.filter(k -> k.getCode() == KeyCode.ENTER);
AwaitingEventStream<Change<String>> textEvents = EventStreams.changesOf(textArea.textProperty())
.successionEnds(Duration.ofSeconds(1));
subs = Subscription.multi(
//Text changed
textEvents.subscribe(e -> {
if (hasSearched.get()) {
hasSearched.set(false);
System.out.println("ignored text event");
} else {
performSearch(textArea.getText());
}
}),
//Enter key pressed
enterKeyPressedEvents.subscribe(e -> {
e.consume();
if (e.isShiftDown()) {
textArea.insertText(textArea.getCaretPosition(), "\n");
} else {
hasSearched.set(true);
System.out.println("enter pressed");
performSearch(textArea.getText());
if (!textEvents.isPending()) {
hasSearched.set(false);
}
}
})
);
Я пытался использовать SuspendableEventStream.suspend()
думая, что это "отбросит" все ожидающие события, но это не сработало, как ожидалось, ожидающее событие все еще генерируется:
EventStream<KeyEvent> enterKeyPressedEvents = EventStreams.eventsOf(textArea, KeyEvent.KEY_PRESSED)
.filter(k -> k.getCode() == KeyCode.ENTER);
SuspendableEventStream<Change<String>> textEvents = EventStreams.changesOf(textArea.textProperty())
.successionEnds(Duration.ofSeconds(1)).suppressible();
subs = Subscription.multi(
//Text changed
textEvents.subscribe(e -> {
performSearch(textArea.getText());
}),
//Enter key pressed
enterKeyPressedEvents.subscribe(e -> {
e.consume();
if (e.isShiftDown()) {
textArea.insertText(textArea.getCaretPosition(), "\n");
} else {
Guard guard = textEvents.suspend();
System.out.println("enter pressed");
performSearch(textArea.getText());
guard.close();
}
})
);
Как я могу придумать лучшее (более реактивное?) Решение?
3 ответа
Вот решение. Ключевой частью этого решения является наблюдение за изменениями текста внутри flatMap
, что имеет эффект "сброса" потока изменений текста.
import java.time.Duration;
import java.util.function.Function;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.TextArea;
import javafx.scene.input.KeyCode;
import javafx.scene.input.KeyEvent;
import javafx.stage.Stage;
import org.reactfx.EventStream;
import org.reactfx.EventStreams;
public class AutoSearch extends Application {
public static void main(String[] args) {
launch(args);
}
@Override
public void start(Stage stage) throws Exception {
TextArea area = new TextArea();
EventStream<KeyEvent> enterPresses = EventStreams.eventsOf(area, KeyEvent.KEY_PRESSED)
.filter(k -> k.getCode() == KeyCode.ENTER)
.hook(KeyEvent::consume);
EventStream<?> searchImpulse = enterPresses.withDefaultEvent(null) // emit an event even before Enter is pressed
.flatMap(x -> {
EventStream<?> edits = EventStreams.changesOf(area.textProperty())
.successionEnds(Duration.ofSeconds(1));
return ((x == null) ? edits : edits.withDefaultEvent(null))
.map(Function.identity()); // just to get the proper type of the result
});
searchImpulse.subscribe(x -> System.out.println("Search now!"));
stage.setScene(new Scene(area));
stage.show();
}
}
Вот еще одно решение. Он подсчитывает количество нажатий Enter и позволяет событию редактирования запускать поиск только в том случае, если счетчик Enter не изменился за это время.
import java.time.Duration;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.TextArea;
import javafx.scene.input.KeyCode;
import javafx.scene.input.KeyEvent;
import javafx.stage.Stage;
import org.reactfx.EventStream;
import org.reactfx.EventStreams;
public class AutoSearch2 extends Application {
public static void main(String[] args) {
launch(args);
}
@Override
public void start(Stage stage) throws Exception {
TextArea area = new TextArea();
EventStream<KeyEvent> enterPressed = EventStreams.eventsOf(area, KeyEvent.KEY_PRESSED)
.filter(k -> k.getCode() == KeyCode.ENTER)
.hook(KeyEvent::consume);
EventStream<Long> enterCount = enterPressed.accumulate(0L, (n, k) -> n + 1)
.withDefaultEvent(0L);
EventStream<Long> delayedEdits = enterCount.emitOnEach(EventStreams.changesOf(area.textProperty()))
.successionEnds(Duration.ofSeconds(1));
// check that the delayed edit event still has the current value of the Enter counter
EventStream<?> validEdits = enterCount.emitBothOnEach(delayedEdits)
.filter(cd -> cd.test((current, delayed) -> delayed == current));
EventStream<?> searchImpulse = EventStreams.merge(enterPressed, validEdits);
searchImpulse.subscribe(x -> System.out.println("Search now!"));
stage.setScene(new Scene(area));
stage.show();
}
}
Не проверено, но как насчет:
EventStream<KeyEvent> enterKeyPressedEvents = EventStreams.eventsOf(textArea, KeyEvent.KEY_PRESSED)
.filter(k -> k.getCode() == KeyCode.ENTER);
EventStream<Change<String>> textEvents = EventStreams.changesOf(textArea.textProperty())
.successionEnds(Duration.ofSeconds(1))
.filter(c -> ! isAdditionOfNewline(c, textArea.getCaratPosition()));
EventStreams.merge(enterKeyPressedEvents, textEvents)
.subscribe(o -> performSearch(textArea.getText()));
private boolean isAdditionOfNewline(Change<String> change, int caratPos) {
// TODO make sure this works as required
String oldText = change.getOldValue();
String newText = change.getNewValue();
if (oldText.length()+1 != newText.length() || caratPos == 0) {
return false ;
}
return oldText.equals(newText.substring(0, caratPos-1) + newText.substring(caratPos));
}