--- title: Het herstructureren van mobiele applicaties date: 2024-03-06 categories: - app-development - mobile - mobiletogether tags: - app-development - mobile-apps - mobiletogether - refactoring description: Verbeteringen aan bestaande softwaretoepassingen komen vaak voort uit de feedback van enthousiaste gebruikers, en het implementeren van nieuwe functies creëert mogelijkheden om mobiele apps te optimaliseren. --- Status: #blog Tags: #app-development #mobile-apps #mobiletogether #refactoring Categories: [mobile-development](/blog/nl/category/mobile-development.md) | [mobile-development](/blog/nl/category/mobile-development.md) | [mobile-development](/blog/nl/category/mobile-development.md) # Het herstructureren van mobiele applicaties De beste ideeën voor nieuwe functies en andere verbeteringen van bestaande software-applicaties komen vaak van enthousiaste gebruikers. Het implementeren van nieuwe functies creëert mogelijkheden om mobiele apps te optimaliseren. Na jarenlang gebruik van de MobileTogether Solar Data Tracking-app om de prestaties van een zonnepaneleninstallatie op een dak te monitoren, had mijn vriend Casey een suggestie. De app toonde één pagina met grafieken en tabellen om de productie per maand over een jaar weer te geven, en een andere pagina om de dagelijkse productie van de afgelopen 30 dagen weer te geven. Navigatieknoppen op elke pagina maakten het eenvoudig om tussen de verschillende weergaven te wisselen. Casey's suggestie was om de app te herzien en alle grafieken en tabellen op één pagina te plaatsen. In de loop der tijd zijn mobiele gebruikers gewend geraakt aan mobiele apps die gegevens presenteren in lange pagina's die met een eenvoudige veegbeweging kunnen worden doorlopen. Een app met één pagina zou soepeler aanvoelen en moderner ogen. ![](/blog/images/Blog_MT_control_templates_2.jpg) De Solar Data Tracker is een applicatie voor Android, iOS en Windows, [ontwikkeld vanuit één bron](https://www.altova.com/nl/mobiletogether) met behulp van de Altova MobileTogether Designer. Het samenvoegen van de rapporten op één pagina bood ook de mogelijkheid om de implementatie te herstructureren en de applicatie te vereenvoudigen. De MobileTogether Designer is een tool waarmee je elementen kunt slepen en neerzetten, en die ondersteuning biedt voor kopiëren en plakken van applicatieonderdelen. Daarnaast biedt het tools voor [het herstructureren van mobiele applicaties](https://www.altova.com/nl/mobiletogether/modular-app-development#refactoring) door het identificeren van het gebruik van lokale en globale variabelen, functies, actiegroepen, stijlbladen, externe databronnen en meer. Al deze functies hebben de revisie aanzienlijk vereenvoudigd. Hieronder ziet u een vergelijking van de pagina voor het maandelijkse rapport over de zonne-energieproductie en de pagina voor het dagelijkse rapport, zoals deze eruitzien op een Android-telefoon: ![[Pasted image 20250224145704.png]] En hier is de nieuwe versie, die op één pagina is weergegeven en alle gegevens bevat, zoals je dit zou zien op een iPhone door te scrollen: ![[Pasted image 20250224145734.png]] De knop "Nieuwe factuur toevoegen" in het midden, bovenin, was voorheen het einde van de maandelijkse rapportpagina. Nu loopt het rapport continu door naar de dagelijkse historische gegevens. We hebben een regel onderaan toegevoegd om het einde van de pagina aan te geven. De stappen om de nieuwe versie te maken in de MobileTogether Designer waren eenvoudig: - Kopieer de designelementen van de pagina voor het dagelijkse rapport en plak ze aan het einde van de pagina voor het maandelijkse rapport - Verwijder de onnodige navigatieknoppen op de pagina - Pas de koppen aan en vereenvoudig de labels - Definieer de tabel met dagelijkse gegevens opnieuw om de mogelijkheid om te scrollen te verwijderen - Verwijder de oude pagina voor het dagelijkse rapport uit de workflow-structuur De MobileTogether Designer bevat een validatietool om logische fouten of waarschuwingen te controleren, en een "Ongedaan"-knop waarmee u stap voor stap terug kunt gaan door elke wijziging, zodat u precies kunt achterhalen welke wijziging mogelijk een probleem heeft veroorzaakt. We moeten ook één actiegroep aanpassen. Wanneer een gebruiker een nieuwe dagelijkse notitie toevoegt of informatie rapporteert die op een energierekening staat, moeten de grafieken ook worden bijgewerkt met de nieuwe gegevens. De oorspronkelijke implementatie gebruikte afzonderlijke actiegroepen om de grafieken op elke pagina bij te werken. We kunnen het dialoogvenster voor de actiegroep openen en acties toevoegen aan een bestaande actiegroep om ook de dagelijkse grafieken bij te werken. [![Het herstructureren van mobiele applicaties biedt mogelijkheden om de interne efficiëntie te verbeteren.](/blog/images/action-group-1.png)](action-group-1.png) We hebben ook de naam van de actiegroep gewijzigd om haar activiteiten beter te beschrijven. Wanneer u de naam van de actiegroep wijzigt in het dialoogvenster "Actiegroepen", past de ontwerper de naam automatisch aan op alle plaatsen waar de actiegroep wordt gebruikt. Het ingebouwde MobileTogether Simulator-venster voert de oplossing direct uit, zodat we de logica kunnen testen, de gebruikersinterface kunnen bekijken zoals deze eruit zal zien op verschillende Android-, iOS-, Windows- en andere apparaten, en de veranderingen in de workflowgegevens tijdens de uitvoering kunnen bekijken. De simulator bevat ook uitgebreide debugfunctionaliteit voor gedetailleerde observatie en het volgen van het uitvoeringsgedrag. Het menu "Refactoren" bevat commando's die een overzicht geven van waar verschillende ontwerpcomponenten worden gebruikt, of van elementen die nergens in de applicatie worden gebruikt. [![De opties in het menu "MobileTogether Designer Refactor" zijn bedoeld voor het herstructureren van mobiele applicaties](/blog/images/refactor-menu.png)](refactor-menu.png) De lijst met actiegroepen omvat de oorspronkelijke groep die de dagelijkse productieoverzichten bijwerkte. Omdat de pagina voor het dagelijkse rapport niet langer onderdeel is van de app, zal die actiegroep nooit meer nodig zijn en kan deze ook worden verwijderd. [![Verbeterde weergave die ongebruikte actiegroepen toont.](/blog/images/refactor-listing-1.png)](refactor-listing-1.png) We hebben de nieuwe mobiele datatracker geïnstalleerd, en Casey demonstreerde deze met enthousiasme op een evenement voor elektrische auto's in een park met een zwak mobiel netwerk en geen wifi-verbinding. Probeer alle functies van MobileTogether om mobiele apps te optimaliseren door de gratis te gebruiken [MobileTogether Designer](https://www.altova.com/nl/mobiletogether/download) te downloaden.