Kivy - # 1 plattformübergreifendes Entwicklungsframework

In der Welt der plattformübergreifenden Entwicklung für mobile Plattformen dominieren jetzt wahrscheinlich zwei Frameworks - Xamarin und React Native. Xamarin - weil es Microsofts „Adoptivsohn“ ist und stolz Krücken schwingt, fördert es aktiv letzteres, und React Native ist der Nachkomme von nicht weniger berühmtem Facebook, das Bärten mit nicht weniger Stolz für Programmierer wächst, die es satt haben, es zu entwickeln. Für mich selbst habe ich lange eine Alternative gefunden, und für diejenigen, die mit dem plattformübergreifenden Entwicklungsframework von Kivy nicht vertraut sind, willkommen im ...

Was ist gut, Kivy? Das erste ist, dass es kein JavaScript ist. Das ist Python. Daher die Geschwindigkeit der Entwicklung, die Kürze des Codes, die Fähigkeit, Änderungen in Anwendungen sofort zu ändern und zu verfolgen. Dies ist die Fähigkeit, einfach Code zu schreiben, wenn andere bei erfolglosen Versuchen, ihre Anwendung zu beenden oder die nächsten trendigen Krücken für ihre Projekte herzustellen, Bärte wachsen lassen. Zweitens handelt es sich um ein zu 99,9% reales plattformübergreifendes Framework, mit dem Sie sicher sein können, dass Ihr Code nach dem Schreiben gestartet wird und auf allen verfügbaren Plattformen funktioniert. Als Referenz: Xamarin ist nur 60% des Codes, der wiederverwendet werden kann, obwohl Entwickler behaupten, 80% zu sein. Kivy ist ein ausgereiftes Framework, das seit 2011 entwickelt wurde und älter ist als sein Kollege React Native (2015) und sein einjähriger Xamarin (2011).

Für den heutigen Artikel habe ich ein kleines Beispiel vorbereitet, das alle oben genannten Vorteile von Kivy deutlich zeigt. Wir werden ein neues Projekt mit dem Konsolendienstprogramm CreatorKivyProject erstellen , sehen, wie Widgets in Kivy animiert werden, und einen Bildschirm mit den folgenden Inhalten erstellen:


Laden Sie also das Dienstprogramm CreatorKivyProject herunter und erstellen Sie ein neues Projekt gemäß den Anweisungen in README. Nach dem Ausführen eines einfachen Befehls wird ein leeres Projekt mit einem Hauptbildschirm und zwei zusätzlichen Bildschirmen "Info" und "Lizenz" erstellt, die im Menü "Navigationsleiste" geöffnet werden können. Dies ist keine vorgefertigte Anwendung für mobile Plattformen, sie kann jedoch bereits direkt von den Quellen auf Ihrem Computer ausgeführt und getestet werden. Um das Projekt zu starten, müssen Sie das Skript main.py ausführen, das der Einstiegspunkt für die Anwendung ist.


Nach dem Start stehen folgende Bildschirme zur Verfügung:


Unsere Aufgabe ist es, einen Stapel von vier Schaltflächen vom Typ FloatingActionButton, schwebende Beschriftungen für sie und minimale Funktionalität für Schaltflächenereignisse in den Bildschirm zu integrieren. Mit einem Stapel von Schaltflächen meine ich Schaltflächen, die in der unteren rechten Ecke des Bildschirms platziert sind und sich überlappen. Da ein solcher Stapel in mehr als einem Projekt nützlich sein kann, erstellen wir ein Modul floatactionsbuttons.py, das wir später überall, in jedem Projekt und auf jeder Plattform verwenden können. Öffnen Sie das Verzeichnis libs / applibs , in dem sich die Anwendungspakete und -module befinden, und erstellen Sie das Paket floatactionsbuttons mit den Dateien __init__.py , floatactionsbuttons.kv und floatactionsbuttons.py :



Die Datei floatactionsbuttons.kv beschreibt das Layout von UI-Elementen in der speziellen Kv-Sprache, die viel einfacher und verständlicher ist als XAML in Xamarin, XML in Java oder JSX-Markup in React Native.

Die Datei floatactionsbuttons.py steuert das Verhalten der Elemente und ihre Logik, die in floatactionsbuttons.kv beschrieben sind .

So sieht das Layout des Stapels mit unseren Schaltflächen so klar und strukturiert mit einer leicht sichtbaren Hierarchie von Elementen aus:


Mal sehen, welche Elemente in unserem Stapel dem Markup entsprechen. Wir haben eine Signatur erstellt, die jeder Schaltfläche entspricht:


Schaltfläche, die sich im Stapel befindet:


Hauptschaltfläche, die in der unteren rechten Ecke des Bildschirms verankert ist:



und platzierte dies alles auf dem Bildschirm und zeigte den Signaturen die Positionen auf der linken Seite des Bildschirms (außerhalb der Sichtbarkeit) und für alle Schaltflächen die Positionen in der unteren rechten Ecke an:


Schaltflächen überlappen wir einfach. Jetzt ist die Zeit, sie wiederzubeleben. Datei öffnen


Kivy erstellt Animationen mit der Animationsklasse. Wie in Java reicht es aus, den Parameter des Elements anzugeben, das animiert werden soll, und den Endwert zu übergeben. Beachten Sie beispielsweise, dass die Höhe unserer Schaltflächen im kv-Layout auf 25 eingestellt ist, d. H. 25 Pixel vom unteren Bildschirmrand entfernt:

 <FloatingButton@MDFloatingActionButton>: x: Window.width - (self.width + dp(21)) y: dp(25) #     y 

Da wir drei Schaltflächen haben, geben wir in der Schleife jede Höhe (Parameter „y“ ) an, auf die sie angehoben werden muss, und übergeben den Namen der Funktion ( „out_elastic“ ), die für die Art der Animation verantwortlich ist (in unserem Projekt habe ich eine elastische Federanimation verwendet). und alles andere wird automatisch erledigt:

  def show_floating_buttons(self): '''         .     Puthon/C++/Php. ''' step = dp(46) for btn in self.btn_list: step += dp(56) Animation(y=step, d=.5, t='out_elastic').start(btn) 

Die Animation von Signaturen ist genau die gleiche, außer dass wir in Animation den Wert an den x- Parameter übergeben - die horizontale Position des Elements:

  def show_floating_labels(self): '''         .     Puthon/C++/Php. ''' i = 0 #      for lbl in self.lbl_list: i += .5 pos_x = Window.width - (lbl.width + dp(46 + 21 * 1.5)) Animation(x=pos_x, d=i, t='out_elastic').start(lbl) 

Das Paket ist fertig. Wie füge ich es unserem einzelnen Bildschirm hinzu? Öffnen Sie die Steuerdatei des Hauptbildschirms AnimatedButtons / libs / uix / baseclass / basescreen.py :



... das von uns erstellte Paket importieren und dem Bildschirm hinzufügen:

 from libs.applibs.floatingactionbuttons import FloatingActionButtons class BaseScreen(Screen): '''  .''' def on_enter(self): '''    .''' #      . self.add_widget(FloatingActionButtons( icon='lead-pencil', floating_data={ 'Python': 'language-python', 'Php': 'language-php', 'C++': 'language-cpp'}, callback=self.set_my_language)) 

Wie Sie sehen, ist alles einfach, transparent und schnell. Ich kann mir kaum vorstellen, wie die Implementierung einer solchen Funktionalität angesichts der Menge an Code, die der Autor für die Implementierung einer Anwendung wie "Hello World" in diesem Artikel benötigt hat , wie "React Native" aussehen wird. Neben Kivy kann ich nur Xamarin einfügen, das beim Erstellen von Paketen Mono und andere Bibliotheken mit sich zieht, genau wie Kivy den Python-Interpreter. Vorgefertigte Anwendungen für Kivy und Xamarin haben die gleiche Größe und ungefähre Startgeschwindigkeit, aber Xamarin hat derzeit viel mehr Probleme. Daher kann ich mit Zuversicht sagen, dass Kivy heute das plattformübergreifende Entwicklungsframework Nr. 1 ist!

Sie können den Quellcode des Projekts auf GitHub herunterladen.

Beispiele für Kivy-Anwendungen:

vimeo.com/29348760
vimeo.com/206290310
vimeo.com/25680681
www.youtube.com/watch?v=u4NRu7mBXtA
www.youtube.com/watch?v=9rk9OQLSoJw
www.youtube.com/watch?v=aa9LXpg_gd0
www.youtube.com/watch?v=FhRXAD8-UkE
www.youtube.com/watch?v=GJ3f88ebDqc&t=111s
www.youtube.com/watch?v=D_M1I9GvpYs
www.youtube.com/watch?v=VotPQafL7Nw
youtu.be/-gfwyi7TgLI

play.google.com/store/apps/details?id=org.kognitivo.kognitivo
play.google.com/store/apps/details?id=net.inclem.pyonicinterpreter
play.google.com/store/apps/details?id=com.madhattersoft.guessthequote
play.google.com/store/apps/details?id=com.prog.ders.ceyhan
play.google.com/store/apps/details?id=com.heattheatr.quotessaints