issue186:python
Différences
Ci-dessous, les différences entre deux révisions de la page.
Prochaine révision | Révision précédente | ||
issue186:python [2022/10/29 10:14] – créée auntiee | issue186:python [2022/11/02 15:51] (Version actuelle) – andre_domenech | ||
---|---|---|---|
Ligne 1: | Ligne 1: | ||
- | A few months ago, one of the Python newsfeed aggregator services had a short blurb about a new project named Flet. For some reason, it caught my eye and I decided to bite the bullet and take a look. Their main website (https:// | + | **A few months ago, one of the Python newsfeed aggregator services had a short blurb about a new project named Flet. For some reason, it caught my eye and I decided to bite the bullet and take a look. Their main website (https:// |
“The fastest way to build Flutter apps in Python. Flet enables developers to easily build realtime web, mobile and desktop apps in Python. No frontend experience required.” | “The fastest way to build Flutter apps in Python. Flet enables developers to easily build realtime web, mobile and desktop apps in Python. No frontend experience required.” | ||
Ligne 5: | Ligne 5: | ||
I wasn’t really familiar with Flutter, so I took a look at that before I went much further. A simple web search provided their main page (https:// | I wasn’t really familiar with Flutter, so I took a look at that before I went much further. A simple web search provided their main page (https:// | ||
- | “Flutter is an open source framework by Google for building beautiful, natively compiled, multi-platform applications from a single codebase.” | + | “Flutter is an open source framework by Google for building beautiful, natively compiled, multi-platform applications from a single codebase.”** |
- | So Flutter is a frontend framework for the Dart language and Dart was developed by Google. I don’t need to learn another programming language at this point in my life, but still, I was getting excited by the possibility that Flet might be a good extension for my Python programming. | + | Il y a quelques mois, l'un des services d' |
+ | |||
+ | J'ai toujours été intéressé par la programmation multi-plateforme comme Desktop vers Android ou IOS. Vous vous souvenez peut-être qu'il y a plusieurs années, j'ai fait un article sur Kivy (FCM n° 63, 64 et 65 de juillet, août et septembre 2012) qui permet aux programmeurs Python de créer des applications pour IOS, Android, Mac, Linux, Windows et pour les kiosques. Cela semblait donc être une chose logique à regarder. | ||
+ | |||
+ | Je n' | ||
+ | |||
+ | |||
+ | **So Flutter is a frontend framework for the Dart language and Dart was developed by Google. I don’t need to learn another programming language at this point in my life, but still, I was getting excited by the possibility that Flet might be a good extension for my Python programming. | ||
I returned to the Flet website and started to explore. | I returned to the Flet website and started to explore. | ||
Ligne 21: | Ligne 28: | ||
Using Flet | Using Flet | ||
- | According to the website, the basic structure of a flet app is as shown above. | + | According to the website, the basic structure of a flet app is as shown above.** |
- | When you break this basic program structure down, the function main() is the entry point for the Flet app and the Page is the “canvas” that holds the controls (or widgets to Tkinter programmers). In the sample above, the application opens in a native OS window, which is the default, but if you want to open the app in a browser window, you can modify the last line as follows: | + | Flutter est donc un framework frontal pour le langage Dart et Dart a été développé par Google. Je n'ai pas besoin d' |
+ | |||
+ | Je suis retourné sur le site de Flet et j'ai commencé à l' | ||
+ | |||
+ | Installation | ||
+ | |||
+ | Flet est une bibliothèque Python, nous allons donc utiliser pip pour l' | ||
+ | |||
+ | pip3 install flet --upgrade | ||
+ | |||
+ | Une fois que Flet est installé, nous pouvons le tester. | ||
+ | |||
+ | Utilisation de Flet | ||
+ | |||
+ | Selon le site Web, la structure de base d'une application Flet est ce qui est montré ci-dessus. | ||
+ | |||
+ | |||
+ | **When you break this basic program structure down, the function main() is the entry point for the Flet app and the Page is the “canvas” that holds the controls (or widgets to Tkinter programmers). In the sample above, the application opens in a native OS window, which is the default, but if you want to open the app in a browser window, you can modify the last line as follows: | ||
flet.app(target=main, | flet.app(target=main, | ||
Ligne 32: | Ligne 56: | ||
To run the app, simply type: | To run the app, simply type: | ||
+ | |||
+ | $ python FletTest1.py** | ||
+ | |||
+ | Lorsque vous décomposez cette structure de programme de base, la fonction main() est le point d' | ||
+ | |||
+ | flet.app(target=main, | ||
+ | |||
+ | Première application Flet | ||
+ | |||
+ | Créons une application Flet TRÈS simple pour voir comment tout cela s' | ||
+ | |||
+ | Pour lancer l' | ||
$ python FletTest1.py | $ python FletTest1.py | ||
- | You should see something like this: | + | |
+ | **You should see something like this: | ||
Please notice that I’ve resized the app to take the window image, since the default shows up very large on my screen. | Please notice that I’ve resized the app to take the window image, since the default shows up very large on my screen. | ||
Ligne 51: | Ligne 88: | ||
And re-running the application. | And re-running the application. | ||
- | Again, I’ve resized the app before I took the screenshot. | + | Again, I’ve resized the app before I took the screenshot.** |
- | Now, I’m going to show a more complex application, | + | Vous devriez voir quelque chose comme ceci : |
+ | |||
+ | Remarquez que j'ai redimensionné l' | ||
+ | |||
+ | En fait, la ligne vraiment importante dans cette petite démo est : | ||
+ | |||
+ | page.add(Text(value=" | ||
+ | |||
+ | C'est la seule ligne dans le point d' | ||
+ | |||
+ | page.title= "Flet Test #1" | ||
+ | |||
+ | Maintenant, essayons de modifier l' | ||
+ | |||
+ | flet.app(target=main, | ||
+ | |||
+ | Et exécutez l' | ||
+ | |||
+ | Encore une fois, j'ai redimensionné l' | ||
+ | |||
+ | |||
+ | **Now, I’m going to show a more complex application, | ||
We’ll start with the import section of the code. | We’ll start with the import section of the code. | ||
Ligne 77: | Ligne 135: | ||
You can see that the app contains a number of controls that get combined to create various custom controls, which is one of the big draws of Flutter. By using Flet, you don’t have to learn Dart to utilize the power of Flutter and its control set. | You can see that the app contains a number of controls that get combined to create various custom controls, which is one of the big draws of Flutter. By using Flet, you don’t have to learn Dart to utilize the power of Flutter and its control set. | ||
- | Next, I’ll show you the main function. Remember, this is the entry point of the app (shown below). | + | Next, I’ll show you the main function. Remember, this is the entry point of the app (shown below).** |
- | So you can see that the main function creates an instance of a class called TodoApp which is the workhorse of the application. Of course, there is much more to the class than I present here (next page, top right). | + | Maintenant, je vais vous montrer une application plus complexe, une application To Do, tirée de leur tutoriel. Vous pouvez trouver le code complet à l' |
+ | |||
+ | Nous allons commencer par la section d' | ||
+ | |||
+ | import flet | ||
+ | from flet import ( | ||
+ | Checkbox, | ||
+ | Column, | ||
+ | FloatingActionButton, | ||
+ | IconButton, | ||
+ | OutlinedButton, | ||
+ | Page, | ||
+ | Row, | ||
+ | Tab, | ||
+ | Tabs, | ||
+ | Text, | ||
+ | TextField, | ||
+ | UserControl, | ||
+ | colors, | ||
+ | icons, | ||
+ | ) | ||
+ | |||
+ | Vous pouvez voir que l' | ||
+ | |||
+ | Ensuite, je vais vous montrer la fonction principale. N' | ||
+ | |||
+ | |||
+ | **So you can see that the main function creates an instance of a class called TodoApp which is the workhorse of the application. Of course, there is much more to the class than I present here (next page, top right). | ||
When you look at the class definition line, you will see that it uses UserControl, | When you look at the class definition line, you will see that it uses UserControl, | ||
Ligne 85: | Ligne 170: | ||
As you look through the rest of this portion of the class, you can see the beginnings of the layering of the various controls to create a column container which shows its children in a vertical array (middle right). | As you look through the rest of this portion of the class, you can see the beginnings of the layering of the various controls to create a column container which shows its children in a vertical array (middle right). | ||
- | You can also tell that the TodoApp class uses a UserControl which, in this case, is part of the Task class (next page, top right). | + | You can also tell that the TodoApp class uses a UserControl which, in this case, is part of the Task class (next page, top right).** |
- | There is a lot more for the Task class, but I won’t spoil the tutorial by showing you all of that class' | + | Vous pouvez donc voir que la fonction principale crée une instance d'une classe appelée TodoApp, qui est la bête de somme de l' |
+ | |||
+ | Si vous regardez la ligne de définition de la classe, vous verrez qu' | ||
+ | |||
+ | En regardant le reste de cette partie du cours, vous pouvez voir les débuts de la superposition des différents contrôles pour créer un conteneur de colonne qui affiche ses enfants dans un tableau vertical (au milieu à droite). | ||
+ | |||
+ | Vous pouvez également constater que la classe TodoApp utilise un UserControl qui, dans ce cas, fait partie de la classe Task (page suivante, en haut à droite). | ||
+ | |||
+ | |||
+ | **There is a lot more for the Task class, but I won’t spoil the tutorial by showing you all of that class' | ||
So when the code is all created, here is what the app looks like. | So when the code is all created, here is what the app looks like. | ||
The bottom line, if you want to start to create portable applications between Web apps, Mac, Windows and Linux, a Portable Web app or (according to their website) via the Flet app for IOS and Android, you really should consider giving Flet a try. It would be a good idea to do some research into Flutter, since that’s the backbone of the whole thing. | The bottom line, if you want to start to create portable applications between Web apps, Mac, Windows and Linux, a Portable Web app or (according to their website) via the Flet app for IOS and Android, you really should consider giving Flet a try. It would be a good idea to do some research into Flutter, since that’s the backbone of the whole thing. | ||
- | Until next time, as always; stay safe, healthy, positive and creative! | + | Until next time, as always; stay safe, healthy, positive and creative!** |
+ | |||
+ | Il y a beaucoup d' | ||
+ | |||
+ | Une fois le code créé, voici à quoi ressemble l' | ||
+ | |||
+ | En conclusion, si vous voulez commencer à créer des applications portables entre des applications Web, Mac, Windows et Linux, une application Web portable ou (selon leur site Web) via l' | ||
+ | |||
+ | Jusqu' |
issue186/python.1667031247.txt.gz · Dernière modification : 2022/10/29 10:14 de auntiee