Maak een mobiel dashboard waarmee u elke manager kunt imponeren
In een eerdere post, "Het creëren van elegante mobiele apps", hebben we voorbeelden laten zien van een eenvoudige app en een compleet mobiel dashboard dat op verschillende mobiele apparaten draait. Mobiele ontwikkelaars kunnen eindgebruikers ook tevreden stellen door hen de mogelijkheid te geven de app-ervaring aan te passen. Met MobileTogether kunnen ontwikkelaars cross-platform apps aanpassen aan elk mobiel platform en gebruikers in staat stellen de tekstgrootte eenvoudig en intuïtief aan te passen.
Het toestaan van elke eindgebruiker om de gewenste tekstgrootte in te stellen, afhankelijk van de weergaveomstandigheden en het apparaat, is zowel respectvol naar de gebruikers toe als het ontlast ontwikkelaars van de taak om de juiste tekstgrootte te bepalen die op alle apparaten werkt.
Laat gebruikers de tekstgrootte kiezen
U kunt ofwel twee afzonderlijke knoppen gebruiken, of een schuifregelaar, om gebruikers in een mobiele app de mogelijkheid te geven om de tekstgrootte aan te passen.
Twee knoppen voor tekstgrootte
De app voor verkooprapporten van ons eerdere bericht maakt gebruik van de techniek met twee knoppen.
De onderste rij van de bedieningselementen bevat twee knoppen voor het wijzigen van de tekstgrootte, met duidelijke en begrijpelijke labels:
Deze knoppen verhogen of verlagen de waarde van een persistent data-element met de naam "textSize" binnen een bereik van waarden van 10 tot 50.
Hieronder staat de actie die wordt uitgevoerd wanneer op de knop "verlagen" wordt geklikt:
En de actie voor de knop om de waarde te verhogen:
Het element textSize wordt gebruikt in een eenvoudige MobileTogether-gebruikersfunctie om een geldige string te construeren die gebruikt kan worden om de tekstgrootte in te stellen:
Ten slotte wordt de lettergrootte voor elk tekstelement in de app ingesteld via een XPath-expressie, in plaats van via het dropdown-menu voor grootte in het eigenschappenvenster
Omdat het element "textSize" is gedefinieerd in de permanente datastructuur, wordt de door de gebruiker gekozen tekstgrootte bewaard voor de volgende keer dat de app op dat apparaat wordt gestart.
Deze methode met twee knoppen werkt goed voor een app met slechts een paar hoofdpagina's, zoals het rapport over de verkopen van het bedrijf, omdat de gebruiker direct het resultaat ziet en de grootte naar wens kan aanpassen. Hieronder staan voorbeelden van het rapport over de verkopen van het bedrijf, met kleine en grote tekst:
Let op dat de hoofdtitel groter is dan de hoofdtekst. Dit wordt bereikt via een tweede gebruikersfunctie voor titels, die een relatie instelt tussen de grootte van de hoofdtekst en de titel:
Schuifregelaar voor tekstgrootte
Een andere manier om de gebruiker de mogelijkheid te geven de tekstgrootte aan te passen, is door gebruik te maken van een schuifregelaar. Ontwikkelaars zullen nog steeds een persistent data-element voor de tekstgrootte willen aanmaken, gebruikersfuncties willen creëren om de grootte als een string weer te geven, en de eigenschap voor de tekstgrootte toewijzen als een XPath-expressie, zoals hierboven beschreven.
Maar soms is er simpelweg niet genoeg ruimte op het scherm om twee knoppen te gebruiken om de tekstgrootte aan te passen. In dat geval kunt u één knop gebruiken om een schuifregelaar te openen.
De mobiele app "Executive Sales Dashboard" die hieronder wordt weergegeven, presenteert verkoopgegevens voor elke gewenste datum in verschillende grafische vormen. De rij met bedieningselementen bovenaan biedt verschillende snelle datumselectoren, maar er is slechts ruimte voor nog één knop om de tekstgrootte aan te passen.
In deze app opent de knop "A±" een subpagina met een schuifregelaar waarmee gebruikers de waarde van het element "textSize" kunnen aanpassen
De voorbeeldtekst in de bovenste regel wordt in real-time aangepast wanneer de gebruiker de schuifregelaar bedient. Wanneer de gebruiker op de "terug"-knop klikt, wordt de hoofdpagina opnieuw weergegeven met de tekstelementen in de aangepaste grootte. Net als bij de methode met twee knoppen, wordt het element "textSize" opgeslagen als permanente data, en de keuze van de gebruiker wordt de volgende keer dat de app wordt gestart, hersteld.
Sommige apps hebben verschillende elementen die geschikt zijn om op te slaan als gebruikersinstellingen, zoals inches versus centimeters, dollars versus euro's, of een standaardadres of bestandsnaam voor afbeeldingen. In dat geval kunnen ontwikkelaars een enkele pagina met instellingen maken, zodat de gebruiker alle opgeslagen gebruikersinstellingen op één plek kan bekijken en aanpassen.
MobileTogether Designer is een gratis tool waarmee u snel al deze geavanceerde functies kunt implementeren voor apps die op verschillende platforms werken, zoals Android, iOS, Windows 8, Windows 10, Windows Phone 8, en een client die werkt via een HTML-5 browser. Download een exemplaar en begin vandaag nog!