Warum haben beide Papier-Fab und Papier-Icon-Button-Komponenten?

Polymer hat ein paper-icon-button: https://www.webcomponents.org/element/PolymerElements/paper-icon-button Warum haben beide Papier-Fab und Papier-Icon-Button-Komponenten?

Polymer auch ein paper-fab hat: https://www.webcomponents.org/element/PolymerElements/paper-fab/elements/paper-fab

I Unterschied verstehen das Design; dass die material design spec empfiehlt (z. B. "Pro Bildschirm wird nur eine schwimmende Aktionstaste empfohlen"), aber gibt es wirklich einen Unterschied, was die Komponenten angeht? Oder ist ein paper-fab nur ein paper-icon-button mit einem rosa Hintergrund, einem Grenzradius und einem Kastenschatten (drei Linien von css?). Grundsätzlich verstehe ich nicht, warum ich beide importieren sollte.

Quelle

2017-12-19 Teddy Ward

Wie Sie kommentiert haben, ist es aufgrund seines Verhaltens nach Material Design spec. <paper-fab> soll die primäre Aktion der App darstellen, während <paper-icon-button> zusätzliche Funktionalität bietet.

Lassen Sie uns Twitter Mobile App als ein Beispiel verwenden. In Android hat es eine "Papierfabrik", um neue Tweets zu veröffentlichen, und wir sind uns alle einig, dass der Hauptzweck der Twitter-App darin besteht, Tweets zu posten, so dass es sinnvoll ist, eine schwebende Schaltfläche für diese Aktion zu platzieren, während zusätzliche Schaltflächen dargestellt werden als Symbole, um Funktionalität hinzuzufügen, zum Beispiel die Kontakte finden Schaltfläche, die Sie neben der Suchleiste finden können.

Hinweis: Berücksichtigen Sie das Datum, an dem diese Antwort gepostet wurde, da Twitter UI seither geändert werden konnte. Wenn die Beispielbeschreibung nicht klar ist, bitte kommentiere sie und ich werde versuchen, einen Screenshot zu posten.

die Umsetzung in Polymer dieser Komponenten betrifft, beide verwendet <iron-icon> und wir konnten den Code „ziemlich nahe“ betrachten, können Sie hier überprüfen: <paper-icon-button> und <paper-fab>

So, zum Schluss, trotz denken, sie sind ziemlich Ähnlich ist es gut, sie als verschiedene Komponenten zu verwenden, da sie verschiedene Dinge repräsentieren.

Quelle

2017-12-20 13:50:33

Ich stimme dem zu, was Sie sagen, aber ich verstehe nicht, warum ich beide Abhängigkeiten in meine App importieren soll. Es scheint eine totale Verschwendung zu sein, wenn sie sich nur in Stil und Verwendung unterscheiden, nicht wirklich in der Funktionalität. –

@TeddyWard Ein paar Gründe könnten wegen Wiederverwendbarkeit und Wartbarkeit sein. Wenn Sie eine schwebende Schaltfläche ohne Schaltfläche "Papierfabrikation" einfügen möchten, müssen Sie "das Rad neu erfinden" und möglicherweise die gleichen Stile auf mehreren Seiten wiederholen, auf denen Sie eine schwebende Schaltfläche einfügen (und Ihr Code könnte besonders riechen, wenn Sie ihn ändern möchten) etwas). Es liegt an Ihnen, einen Papier-Icon-Button mit divs und Styles oder was auch immer einzubinden, um eine schwebende Aktion ohne Papier herzustellen, aber jemand könnte denken, dass Sie nicht alle Vorteile nutzen, die Web-Komponenten-Technologien bieten. –

Und wenn Sie denken, dass dies eine totale Verschwendung wegen der zwei "" Importe in beiden Komponenten ist, ist Polymer intelligent genug, "" nur einmal zu importieren. [link] (https://github.com/Polymer/polymer/issues/4775) –

Warum haben beide Papier-Fab und Papier-Icon-Button-Komponenten?

Antwort

Verwandte Themen