Android-Anwendung – Flutter implementiert seidiges Gleitlöschen, mobile Sortierung usw. – Ausführliche Erläuterung der Dismissible-Steuerung

Fügen Sie hier eine Bildbeschreibung ein

Einführung in Dismissible

Dismissible ist ein nützliches Widget in Flutter zum Implementieren verschiebbarer Lösch- oder Ziehvorgänge. Es wird hauptsächlich verwendet, um eine einfache Möglichkeit zur Implementierung bereitzustellen, wenn der Benutzer einen Lösch- oder Ziehvorgang für ein Listenelement oder ein anderes wischbares Element ausführt.

Szenen, die verwendet werden sollen

  • Löschen von Listenelementen: Ermöglicht Benutzern das Löschen eines Elements aus einer Liste mithilfe einer Wischgeste.
  • Nach links oder rechts wischen: Bietet einen anpassbaren Hintergrund, der angezeigt wird, wenn der Benutzer nach links oder rechts wischt.
  • Drag-Sortierung: Kann zum Implementieren der Drag-Sortierung verwendet werden. Wenn der Benutzer lange auf das Listenelement drückt und es zieht, kann es an eine neue Position gezogen werden.
  • Jedes Szenario, das Schiebegesten erfordert: Geeignet für jedes Szenario, das Schiebegesten erfordert.

Gemeinsame Eigenschaften

  • Schlüssel (Schlüssel? Schlüssel): Die Kennung des Widgets. Normalerweise wird der eindeutige Identifikator des Datenelements als Schlüssel verwendet.

  • child (Widget-Kind): Das umschlossene Widget kann verschoben werden, um den Inhalt zu löschen oder zu ziehen.

  • onDismissed (void Function(DismissDirection Direction)? onDismissed): Rückruffunktion, die aufgerufen wird, wenn der Schiebevorgang abgeschlossen ist. Der Rückrufparameter Direction stellt die Gleitrichtung dar und ist ein Wert der DismissDirection-Enumeration.

  • Richtung (DismissDirection Richtung): Definiert die Wischrichtung. Der Standardwert ist DismissDirection.horizontal, also die horizontale Richtung. Sie können zwischen DismissDirection.vertical, DismissDirection.endToStart, DismissDirection.startToEnd, DismissDirection.up und DismissDirection.down wählen.

  • resizeDuration (Dauer? resizeDuration): Steuert die Animationszeit für die Größenänderung des Widgets. Wenn der Wert auf null gesetzt ist, ist die Animation deaktiviert und die Größe des Widgets wird sofort geändert. Der Standardwert ist const Duration(Millisekunden: 200).

  • dismissThresholds (Map<DismissDirection, double>? dismissThresholds): Definieren Sie den Schwellenwert, bei dem die Folie den onDismissed-Rückruf auslöst. Der Schlüssel ist der DismissDirection-Enumerationswert, und der Wert ist vom Typ Double und gibt den gleitenden Prozentsatz an. Beispielsweise bedeutet { DismissDirection.endToStart: 0.5 }, dass ein Schieben um mehr als 50 % nach links einen Rückruf auslöst.

  • MovementDuration (Dauer? MovementDuration): Definiert die Animationszeit zum Anpassen der Position des Widgets. Der Standardwert ist const Duration (Millisekunden: 200).

  • crossAxisEndOffset (doppeltes crossAxisEndOffset): Wenn die Richtung DismissDirection.horizontal ist, definieren Sie den Versatz des Widgets in Richtung der vertikalen Achse. Ein positiver Wert bedeutet eine Verschiebung nach unten, ein negativer Wert eine Verschiebung nach oben. Der Standardwert ist 0.

  • Hintergrund (Widget? Hintergrund): Definiert den Hintergrund, der beim Ziehen angezeigt wird. In der Regel eine Schaltfläche oder ein Symbol, das eine Aktion wie etwa das Löschen ausführt.

  • SecondaryBackground (Widget? SecondaryBackground): Definiert einen sekundären Hintergrund, der beim Ziehen angezeigt wird, normalerweise eine Schaltfläche oder ein Symbol, das zum Ausführen anderer Aktionen verwendet wird. Dies ist der Hintergrund, der rechts angezeigt wird, wenn die Richtung „DismissDirection.horizontal“ ist.

  • bestätigenDismiss (Zukünftige Funktion(DismissDirection Richtung)? bestätigenDismiss): Eine optionale Rückruffunktion, die verwendet wird, um zu bestätigen, ob gleitendes Löschen oder Ziehen ausgeführt werden soll, bevor es tatsächlich ausgeführt wird. Wenn „true“ zurückgegeben wird, wird der Lösch- oder Ziehvorgang ausgeführt; wenn „false“ zurückgegeben wird, wird der Vorgang abgebrochen. Der Callback-Parameter Direction repräsentiert die Gleitrichtung.

  • DragStartBehavior (DragStartBehavior? DragStartBehavior): Definiert, wie das Ziehen beim Start gehandhabt wird. Der Standardwert ist DragStartBehavior.start.

  • crossAxisStartDragOffset (double crossAxisStartDragOffset): Definiert den Offset, um mit dem Ziehen in Richtung der vertikalen Achse zu beginnen. Ein positiver Wert bedeutet eine Verschiebung nach unten, ein negativer Wert eine Verschiebung nach oben. Der Standardwert ist 0.

  • MovementDurationVsCurrent} (bool? MovementDurationVsCurrent): Wenn beim Verschieben das Widget auf „true“ gesetzt ist, wird die Größe des aktuellen Widgets zur Berechnung der zurückgelegten Strecke verwendet, und nicht die Größe vor dem Verschieben des Widgets. Der Standardwert ist falsch.

Diese Eigenschaften bieten viel Flexibilität, um den Interaktionseffekt des Schiebens zum Löschen oder Ziehen entsprechend den spezifischen Anforderungen anzupassen. Wählen Sie bei der Verwendung die entsprechenden Attribute zur Konfiguration entsprechend der jeweiligen Situation aus.

Grundlegende Anwendungsbeispiele

Dismissible(
  key: Key(item.id.toString()), // 唯一标识,通常使用数据项的唯一标识
  onDismissed: (direction) {
    
    
    // 在用户滑动时调用,可以在这里执行删除等操作
    // direction 表示滑动的方向,是DismissDirection的枚举值之一
    // DismissDirection.horizontal 表示水平滑动
    // DismissDirection.vertical 表示垂直滑动
    // DismissDirection.endToStart 表示从右向左滑动(LTR语言环境)
    // DismissDirection.startToEnd 表示从左向右滑动(LTR语言环境)
    // DismissDirection.up 表示从下向上滑动
    // DismissDirection.down 表示从上向下滑动
  },
  background: Container(
    color: Colors.red, // 右滑或左滑时显示的背景颜色
    child: Icon(Icons.delete),
  ),
  child: ListTile(
    title: Text(item.title),
    // 其他列表项的内容
  ),
);

In diesem Beispiel umschließt Dismissible eine ListTile, die ein Element in der Liste darstellt. Wenn der Benutzer dieses Element verschiebt, wird der onDismissed-Rückruf ausgelöst, und Sie können hier Vorgänge wie das Löschen ausführen. Das Hintergrundattribut definiert den Hintergrund, der beim Wischen nach rechts oder links angezeigt wird und Symbole, Text usw. enthalten kann.

Vorsichtsmaßnahmen

  • Der Schlüssel ist erforderlich und wird normalerweise zur eindeutigen Identifizierung des Datenelements verwendet. Dies wird zur eindeutigen Identifizierung des Entwerfbaren verwendet, um eine korrekte Löschung und Sortierung sicherzustellen.
  • Im onDismissed-Rückruf müssen Sie bestimmte Vorgänge ausführen, z. B. das entsprechende Element aus der Datenliste löschen.
  • Der Richtungsparameter gibt die Gleitrichtung an und kann verwendet werden, um verschiedene Vorgänge entsprechend unterschiedlicher Richtungen auszuführen.
  • Das Hintergrundattribut definiert den beim Schieben angezeigten Hintergrund und wird normalerweise zur Anzeige von Löschvorgängen verwendet.
    Insgesamt ist Dismissible ein sehr nützliches Widget, das einige gängige Schiebegestenvorgänge erleichtert, insbesondere für Elemente in Listen.

Abschluss
Flutter ist ein von Google entwickeltes Open-Source-UI-Toolkit, mit dem Sie hochwertige, schöne Anwendungen auf verschiedenen Plattformen erstellen können, ohne viel plattformspezifischen Code schreiben zu müssen. Ich werde alle Aspekte von Flutter lernen und vertiefen. Von Grundkenntnissen bis hin zu fortgeschrittenen Techniken, vom UI-Design bis zur Leistungsoptimierung – diskutieren und lernen Sie gemeinsam mit uns und betreten Sie gemeinsam die wunderbare Welt von Flutter!

Supongo que te gusta

Origin blog.csdn.net/yikezhuixun/article/details/135068731
Recomendado
Clasificación