Eine ausführlichere Erklärung, wie das Löschen durch Wischen mit der linken Maustaste in WeChat-Miniprogrammen implementiert wird

Der Effekt „Nach links wischen zum Löschen“ ist bei App-Interaktionsmethoden sehr beliebt, beispielsweise in der universellen Anwendung WeChat

WeChat: Nach links wischen zum Löschen

Ein weiteres Beispiel: Die Produktivitäts-App Löschen

Zu löschende Folien löschen

Technisch gesehen ist es nicht schwierig, diesen Effekt zu erzielen . Die Antwort: Schieben Sie einfach den Vorgang, verschieben Sie die Komponente, fügen Sie einige Koordinatenberechnungen hinzu und zeichnen Sie den Status auf. Es gibt auch einige Artikel, die vorstellen, wie man diesen Effekt bei Miniprogrammen erreichen kann, aber ich bin mir grundsätzlich sicher, dass diese Entwickler ihn nicht ausführlich auf echten Maschinen getestet haben, denn durch meine Praxis habe ich herausgefunden, dass es fast unmöglich ist, dies zu erreichen Wirkung perfekt auf Mini-Programme Es ist eine unmögliche Mission .

Alles beginnt mit dem Ereignismechanismus des Applets. Für gleitende Operationen bietet das Miniprogramm zwei Möglichkeiten, auf Ereignisse zu reagieren: bind und catch. Der Unterschied besteht darin, ob verhindert werden soll, dass das Ereignis sprudelt, es bietet jedoch nicht die Methode preventDefault, was bedeutet, dass dies nicht möglich ist dynamisch im Programm ermittelt werden. Verhindern Sie, dass ein Ereignis sprudelt.

Dann sprechen wir über eine weitere Funktion des Miniprogramms. Diese Funktion ist nur auf echten Geräten gültig. Das heißt, das Framework bietet standardmäßig einen vertikalen Scrolleffekt Code, und das Miniprogramm stellt auch sorgfältig Got onPullDownRefresh und onReachBottom bereit, nun, alles ist perfekt.

Wenn diese Funktionen dann auf den linken Gleiteffekt stoßen, wird es peinlich. Für einen perfekten Löscheffekt durch Wischen nach links sollte bei der Beurteilung als horizontales Verschieben die Bewegung des Benutzers in vertikaler Richtung ignoriert werden (schließlich kann man nicht erwarten, dass der Finger des Benutzers nicht nach oben und unten zittert). Da es jedoch keine preventDefault-Methode gibt, müssen Sie entweder das Gleitereignis abfangen oder Sie können nur erwarten, dass der Finger des Benutzers streng horizontal gleitet.

Aus den oben genannten Gründen gibt es unter den Miniprogrammen, die ich gesehen habe, fast keine Löschvorgänge durch Wischen nach links. Das liegt fast daran, dass es eines gibt, das diesen Effekt erzielt, nämlich Impression Micro Notes List

Impression Micro Notes List

Sie können sehen, dass die Seite gleichzeitig nach oben und unten scrollt, wenn Sie nach links wischen, was nicht gut ist Erfahrung. (Übrigens verwendet die frühe Version der Impression Micro Notes-Liste Scroll-view, um diesen Effekt zu erzielen, und das Erlebnis ist noch schlimmer)

Natürlich können Sie auch das Gleitereignis erfassen, aber Auf diese Weise ist das horizontale Schieben kein Problem, und beim vertikalen Schieben wird es auch keine Reaktion beim Wischen geben.

Ich war sehr frustriert, als ich diese Probleme entdeckte, aber ich denke, der Kern des Problems besteht darin, dynamisch verhindern zu können, dass die Seite vertikal scrollt. Neben der Ansicht bietet die Bildlaufansicht auch die Möglichkeit, vertikal zu scrollen, und verfügt außerdem über ein Attribut scroll-y     Boolean    false     允许纵向滚动. Ja, ich denke, Sie haben auch darüber nachgedacht, solange diese Eigenschaft dynamisch unter den richtigen Bedingungen eingestellt wird, sollte der gewünschte Effekt erzielt werden.

Aus Sicht der Implementierung sollte das vertikale Scrollen zuerst deaktiviert und dann aktiviert werden, nachdem festgestellt wurde, dass der Benutzer vertikal arbeitet. Aber die Tatsache hat mich wieder einmal getroffen: Durch die Aktivierung dieser Eigenschaft im touchmove-Ereignis wird der vertikale Scrolleffekt nicht aktiviert.

Machen Sie dann das Gegenteil, aktivieren Sie zuerst den vertikalen Bildlauf und deaktivieren Sie dieses Attribut, nachdem Sie den horizontalen Vorgang festgelegt haben. Nun, die Praxis hat gezeigt, dass diese Methode funktioniert, aber es gibt immer noch Probleme. Bevor wir die Gleitrichtung bestimmen, bewegt sich der Benutzer wahrscheinlich in die vertikale Richtung. Obwohl sie sehr klein ist, wird der Benutzer dennoch spüren, wie die Seite nach oben und unten scrollt.

Das Folgende ist der imitierte WeChat-Homepage-Effekt, den ich basierend auf dieser Idee erzielt habe

Zum Löschen nach links wischen

Im Folgenden Artikel: Ich zeige Ihnen eine andere Möglichkeit, diesen Effekt zu erzielen, der das Problem des vertikalen Scrollens der Seite perfekt beseitigt, aber noch andere Einschränkungen aufweist.

Das obige ist der detaillierte Inhalt vonEine ausführlichere Erklärung, wie das Löschen durch Wischen mit der linken Maustaste in WeChat-Miniprogrammen implementiert wird. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!