Modèle FMX pour la commande de restauration en ligne
Le but de créer ce modèle est que vous en tant que développeur de l'application de commande en ligne avez déjà la conception d'application principale avec des fonctionnalités de base prêtes. Il vous suffit de connecter votre backend à l'application et de configurer la sortie de votre contenu dans les méthodes existantes pour sortir des données sur des contrôles graphiques à l'aide de nos styles. De plus, bien sûr, il existe une capacité à mettre en œuvre indépendamment le reste de la fonctionnalité, qui convient exclusivement à votre restaurant.
Le modèle se compose d'un Datamoduls, 10 formes fonctionnelles et de la forme principale, qui affiche la plupart des formes fonctionnelles à l'intérieur.
Lorsque l'application démarre, le formulaire de démarrage ( ufrmGetStarted ) est lancé. Il affiche le nom de votre restaurant et les coordonnées de base. Aussi à droite des coordonnées, il existe des boutons qui permettent à l'utilisateur de passer un appel à partir de l'une des applications disponibles. De plus, il est possible d'envoyer un e-mail à l'adresse postale de votre restaurant à l'aide de l'une des applications proposées. Au bas du formulaire, il y a un bouton de démarrage. En cliquant sur ce bouton, vous serez redirigé vers le formulaire principal ( ufrmMain ) de l'application.
Le formulaire principal de l'application, au démarrage, charge et affiche immédiatement le formulaire de tableau de bord ( ufrmDashboard ). Toutes les formes chargées dans le menu latéral de la forme principale ou via les boutons en double du formulaire de tableau de bord sont affichés sur les pages du composant TTabControl . Cela vous permet d'utiliser le menu principal du programme sur tous les formulaires si nécessaire. Il vous permet également de gérer des formes et de transitions ouvertes efficacement entre eux à partir d'une seule forme à travers un seul mécanisme. La méthode principale utilisée pour créer des formulaires, affiche leur contenu sur les pages TTabControl de la forme principale, ainsi que pour attribuer des fonctionnalités aux contrôles de ces formulaires, est effectuée dans la méthode LoadScreenByName() . Étudiez-le et les méthodes qui y sont appelées, et vous déterminerez comment la logique pour afficher des formulaires dans l'application est construite.
Les formulaires implémentés dans ce modèle:
ufrmMain - la forme principaleufrmCart - formulaire de panierufrmCoupons - formulaire de coupons de réductionufrmDashboard - Formulaire de tableau de bordufrmGallery - Formulaire de galerie de restaurantsufrmGetStarted - Écran de bienvenueufrmAboutUs -ufrmMenu - la forme d'informations détaillées sur le plat sélectionné dans le formulaire de menuufrmAccount - Formulaire d'ajout / montage du compte utilisateurufrmAddToCart - Formulaire pour ajouter / supprimer les modificateurs du plat sélectionné à / dans le menuufrmOptionsList - est un formulaire qui s'affiche et permet au client de sélectionner des modificateurs de vaisselle supplémentaires (additifs). Comme la sauce, la moutarde, etc.uDMUnitMaintenant, nous analyserons plus en détail comment le travail avec les données d'application est organisé. De plus, nous considérerons les méthodes de sortie des données sur Listbox et d'autres éléments graphiques des formulaires d'application. Les données de test d'application, pour un exemple, sont implémentées à l'aide du composant TFDMemTable. Dans ce cas, la liste des champs n'est pas limitée et vous n'avez pas besoin d'utiliser exactement ce composant dans votre projet. Tout tQuery ou Tdataset devrait être bien. Cette version du modèle suppose la possibilité d'exécuter l'application sur n'importe quelle plate-forme.
Dans le module de données uDMUnit de l'application, un certain nombre de méthodes ont été créées qui ne sont nécessaires que pour remplir les composants TFDMemTable avec des données de test. Vous n'aurez pas besoin de ces méthodes et vous les supprimerez. Néanmoins, lors de l'étude de notre modèle, ils vous aideront à comprendre visuellement quels données et quel type de données vous devrez recevoir de votre backend ou vous pouvez choisir dans votre base de données afin de l'utiliser dans le modèle. Afin que le modèle fonctionne correctement avec les données que vous avez soumises.
Les styles de tous les composants présentés dans Stylebook sur la forme principale du modèle FRMMain peuvent être modifiés comme vous le souhaitez. Par conséquent, si nécessaire, ou si vous devez afficher des données supplémentaires dans un composant particulier, vous pouvez facilement refaire des styles existants et préparer l'application à vos besoins.
Pour que vos données, plutôt que les données de test, soient affichées sur les éléments visuels TListBox , vous devez télécharger vos données sur le TFDMemTable situé sur un module de données ou apporter des modifications à la méthode de remplissage lorsque le module de données est initialisé (implémentation de vos méthodes de réception de données à partir du backend ou de la base de données). Voici toutes les méthodes qui remplissent TFDMemTables avec les données de test au démarrage de l'application:
InsertTestDataForTheMenu ();InsertTestDataForTheCoupons ();InsertTestDataForTheGallery ();InsertTestDataForTheOptions ();InsertTestDataForAboutUs ();InsertTestDataForContactInfo (); D'après le nom des méthodes, il est clair lequel est responsable de remplir un formulaire ou un autre avec les données de test. Ayant étudié l'une des méthodes, il devient clair lequel de TFDMemTable est utilisé pour quelle forme. * *
MenuListTable - Utilisation dans les formulaires Ufrmmenu et UfrmcartCouponsListTable - Utilisation dans le formulaire UFRMCouponsGalleryListTable - Utilisation dans le formulaire UFRMGALERYOptionsListTable - Utilisation dans les formulaires UfrMoptionsList et UFRMADDTOCARTAboutUsTable - Utilisation dans les formulaires Ufrmaboutus et UfrmgetStartedAboutUsDesciptionTable - Utilisation dans les formulaires Ufrmaboutus et UfrmgetStarted Afin d'ajouter des images à TFDMemTables , utilisez TImageLists avec des images déjà chargées. Cela se fait afin de montrer comment charger une image dans les composants de la famille TQuery , et de montrer comment charger des images à partir de champs de type TBlob dans les éléments des commandes graphiques sur le formulaire. Tel, par exemple, comme TListBox .
Le chargement des données de TFDMemTables en éléments de contrôle graphique est implémenté sur chaque formulaire séparément. Une liste des noms de méthodes est donnée ci-dessous:
TfrmAboutUs.BuildAboutUsInfo ();TfrmAboutUs.BuildContsctInfoList ();TfrmAddToCart.BuildForm ();TfrmAddToCart.BuildOptionsList ();TfrmCart.BuildCartList ();TfrmCoupons.LoadCouponsList ();TfrmGallery.LoadGalleryList ();TfrmGetStarted.ShowInfoAboutRestaurant ();TfrmGetStarted.BuildContsctInfoList ();TfrmMenu.LoadMenuList ();TfrmOptionsList.BuildOptionsList (); Le panier est implémenté à l'aide d'un tableau d'enregistrements, présenté comme une classe TCartList . Les plats et leurs modificateurs sont ajoutés à ce tableau avec l'un ou l'autre type de TCartItemType . Et la connexion entre le plat et les modificateurs est organisée via l' Index des paramètres, OwnerIndex de la classe TCartList .
Pour la commodité de travailler avec le panier, plusieurs méthodes sont mises en œuvre:
AddItemToCart(aItemId: int64 = 0;aOwnerID: int64 = 0;const aItemName: string = '';aItemType: TCartItemType = citItem;aQuantity: Extended = 1;aItemPrice: Extended = 0;aOwnerIndex: Integer = -1): Integer;DelItemFromCart(aItemIndex: Integer = 0); ClearCart();GetCartTotalAmount(): Extended;Dans tous les cas, vous pouvez modifier ces méthodes comme vous le souhaitez, ou écrire vos propres méthodes pour remplir les formulaires et leurs composants visuels avec les données. Les méthodes fournies dans le modèle montrent uniquement comment le remplissage des données des formulaires de modèle est implémenté, ainsi que l'édition de ces données. Les méthodes ci-dessus fournissent des moyens d'attribuer des méthodes de traitement de clic aux tlistboxitems ou aux boutons situés à l'intérieur de TlistBoxItems. Après avoir analysé ces méthodes, vous remarquerez que la propriété TAG est utilisée pour transférer les identifiants de l'enregistrement ou de l'élément.
Chacun des modèles de l'implémentation actuelle ne représente que les effets stylistiques, graphiques et d'animation. Et les données de test sont présentées uniquement pour comprendre les processus de remplissage des éléments graphiques des formulaires.
Les icônes des éléments graphiques utilisées dans les modèles sont tirées de la ressource:
Vous trouverez ci-dessous une liste des ressources Internet à partir desquelles des images ont été téléchargées pour concevoir l'apparition de l'application. Image BG de formulaire GetStarted:
Icônes sociales: