Impossible de supprimer une image dans une division modifiable par le contenu sur Android

Question

Je construis un éditeur de texte riche sous Android. Pour ce faire, j'utilise un webView avec un contentEditable div.

Pour ajouter des styles, j'invoque JavaScript . Tout cela fonctionne bien, sauf lorsque j'invoque JavaScript pour insérer une image ou une règle horizontale. Lorsque j'utilise JavaScript pour insérer ces éléments, si j'essaie ensuite d'appuyer sur le bouton Retour pour supprimer l'image ou la règle horizontale, cela ne fonctionne pas.

Curieusement, si je saisis d'abord un autre caractère, puis que j'insère l'image ou la règle horizontale, je peux supprimer l'image/la règle horizontale sans problème, mais je ne peux pas supprimer le caractère que j'ai saisi immédiatement avant l'image/la règle horizontale.

J'ai essayé d'imprimer le HTML dans chaque état, de vérifier la sélection/la gamme, etc., et je n'arrive pas à trouver quelque chose de différent dans l'état qui pourrait expliquer pourquoi je ne peux pas supprimer l'image, etc.

Answer 1

Android : Espace arrière dans WebView/BaseInputConnection

Sous-classez Webview et surchargez la méthode comme indiqué dans la question de ce type.

Sur certains téléphones, seule la question du gars répondra aux exigences. La réponse du lien complètera le code pour la compatibilité avec d'autres téléphones. Cependant, vous devez sous-classer un InputConnectionWrapper. et non un inputconnection. et ensuite retourner ce wrapper dans votre webview personnalisé.

Pour votre information, ce lien contient une explication beaucoup plus détaillée de la situation. Cependant, j'ai essayé d'appliquer rapidement leurs idées et cela n'a pas fonctionné. Peut-être trop compliqué pour mes besoins. La raison pour laquelle j'ai essayé leur solution au lieu de ce que j'ai mentionné ci-dessus est que la solution que j'ai mentionnée ci-dessus fait que la fonction voix-texte ne fonctionne pas correctement. Android - Impossible de capturer l'appui sur la touche de retour arrière/suppression dans le clavier logiciel.

Answer 2

J'ai implémenté un richTextEditor à l'aide de WebView y JavaScript .

Je n'ai eu aucun problème pour insérer/supprimer l'image que j'ai ajoutée à page html au contenu modifiable. Le code que j'ai utilisé pour insérer l'image est le suivant

String exeSucess = "document.execCommand('insertHtml', false,'<img src=\""
        + selectedImagePath + "\" height=auto width=200 ></img>');";
   //Then code for executing this javascript.

Merci.

Answer 3

<div contenteditable="true"></div>

Je l'utilise pour faire un éditeur riche dans une vue Web.

Puis remplacer la méthode TapInputConnection dans Webview

@Override
public InputConnection onCreateInputConnection(EditorInfo outAttrs) {
    return new TapInputConnection(super.onCreateInputConnection(outAttrs));
}

class TapInputConnection implements InputConnection {

    private InputConnection mConnection;

    public TapInputConnection(InputConnection conn){
        this.mConnection = conn;
    }

    @Override
    public CharSequence getTextBeforeCursor(int n, int flags) {
        return mConnection.getTextBeforeCursor(n, flags);
    }

    @Override
    public CharSequence getTextAfterCursor(int n, int flags) {
        return mConnection.getTextAfterCursor(n, flags);
    }

    @Override
    public CharSequence getSelectedText(int flags) {
        return mConnection.getSelectedText(flags);
    }

    @Override
    public int getCursorCapsMode(int reqModes) {
        return mConnection.getCursorCapsMode(reqModes);
    }

    @Override
    public ExtractedText getExtractedText(ExtractedTextRequest request, int flags) {
        return mConnection.getExtractedText(request, flags);
    }

    @Override
    public boolean deleteSurroundingText(int beforeLength, int afterLength) {
        return mConnection.deleteSurroundingText(beforeLength, afterLength);
    }

    @Override
    public boolean setComposingText(CharSequence text, int newCursorPosition) {
        return mConnection.setComposingText(text, newCursorPosition);
    }

    @Override
    public boolean setComposingRegion(int start, int end) {
        return mConnection.setComposingRegion(start, end);
    }

    @Override
    public boolean finishComposingText() {
        return mConnection.finishComposingText();
    }

    @Override
    public boolean commitText(CharSequence text, int newCursorPosition) {
        return mConnection.commitText(text, newCursorPosition );
    }

    @Override
    public boolean commitCompletion(CompletionInfo text) {
        return mConnection.commitCompletion(text);
    }

    @Override
    public boolean commitCorrection(CorrectionInfo correctionInfo) {
        return mConnection.commitCorrection(correctionInfo);
    }

    @Override
    public boolean setSelection(int start, int end) {
        return mConnection.setSelection(start, end);
    }

    @Override
    public boolean performEditorAction(int editorAction) {
        return mConnection.performEditorAction(editorAction);
    }

    @Override
    public boolean performContextMenuAction(int id) {
        return mConnection.performContextMenuAction(id);
    }

    @Override
    public boolean beginBatchEdit() {
        return mConnection.beginBatchEdit();
    }

    @Override
    public boolean endBatchEdit() {
        return mConnection.endBatchEdit();
    }

    @Override
    public boolean sendKeyEvent(KeyEvent event) {
        if (event.getKeyCode() == KeyEvent.KEYCODE_DEL) {
            if (event.getAction() == KeyEvent.ACTION_UP) {
                delete();
            }
            return true;
        }
        return mConnection.sendKeyEvent(event);
    }

    @Override
    public boolean clearMetaKeyStates(int states) {
        return false;
    }

    @Override
    public boolean reportFullscreenMode(boolean enabled) {
        return mConnection.reportFullscreenMode(enabled);
    }

    @Override
    public boolean performPrivateCommand(String action, Bundle data) {
        return mConnection.performPrivateCommand(action, data);
    }

    @TargetApi(Build.VERSION_CODES.LOLLIPOP)
    @Override
    public boolean requestCursorUpdates(int cursorUpdateMode) {
        return mConnection.requestCursorUpdates(cursorUpdateMode);
    }
}

Vous avez compris que je passe outre sendKeyEvent et je m'occupe de Delete Clé par moi-même

C'est le delete() fonction ;

public void delete(){
  loadurl("javascript:document.execCommand('delete', false, null);");
}