Het creëren van een aantrekkelijke gebruikersinterface voor Android-apps is bijna altijd een tijdrovende klus, wat met ondersteuning van tientallen Android-versies, schermformaten en pixeldichtheden. Tegenwoordig, met steeds meer gebruikers die verwachten dat apps zich houden aan de richtlijnen van Material Design, is de taak aantoonbaar nog moeilijker geworden. Gelukkig heeft CodeCanyon verschillende Android-app-sjablonen die u kunt gebruiken om de ontwikkeling van uw volgende app een vliegende start te geven.
In deze zelfstudie help ik u aan de slag met een dergelijke sjabloon, genaamd Material Design UI Android Template App, die is ontwikkeld door CreativeForm.
Om deze tutorial te kunnen volgen, hebt u de nieuwste versie van Android Studio en een Android-apparaat of -emulator met Android 2.3 of hoger nodig.
Begin door in te loggen op uw Envato Market-account en de Materiaalontwerp UI Android Template-app op CodeCanyon.
U kunt nu de broncode van de sjabloon - in de vorm van een ZIP-bestand - vinden in de downloads sectie.
Na het downloaden van het ZIP-bestand en het extraheren naar een map van uw keuze, zou u de volgende bestanden en mappen moeten hebben:
De sjabloon kan zowel met Eclipse als Android Studio worden gebruikt. Laten we in deze zelfstudie echter alleen focussen op het laatste.
Start Android Studio en selecteer de Open een bestaand Android Studio-project optie in het welkomstmenu. Navigeer naar de map waarin u de sjabloon hebt geëxtraheerd, selecteer android - AS, en druk op OK.
Materiaalontwerp UI Android Template-app is afhankelijk van verschillende open-sourcebibliotheken. De compileSdkVersion
van sommige van die bibliotheken is API Level 19, dat iets ouder is dan dat van de sjabloon zelf. Daarom moet u de bibliotheken bijwerken om buildfouten te voorkomen.
Het volgende zijn de bibliotheken die moeten worden gewijzigd:
Open de build.gradle bestand van elke bibliotheek en verander de waarde van compileSdkVersion
naar 21 zodat het overeenkomt met de compileSdkVersion
van de sjabloon.
compileSdkVersion 21
Vergeet niet op te drukken Synchroniseer nu knop na het aanbrengen van de wijzigingen.
Op dit punt kunt u doorgaan en de app-sjabloon uitvoeren op uw Android-apparaat of -emulator. Echter, voordat u op de Rennen knop, zorg ervoor dat de UIAppTemplate configuratie uitvoeren is geselecteerd.
Merk op dat de eerste keer dat u de app probeert uit te voeren, u enkele fouten tegenkomt die gerelateerd zijn aan karaktercodering. De fouten zijn aanwezig in een bestand met de naam ProgressWheel.java, die deel uitmaakt van de Progress Wheel-bibliotheek.
De eenvoudigste manier om de fouten te herstellen, is door het bestand te openen, ervoor te zorgen dat de codering is ingesteld op UTF-8 en het op te slaan.
Nadat de build is voltooid, kunt u het startscherm van de app-sjabloon bekijken.
U kunt de navigatielade gebruiken om alle lay-outs, animaties en aangepaste weergaven te bekijken die beschikbaar zijn in de sjabloon. Bijvoorbeeld kiezen Aanmeldingspagina's> Media toont u het volgende scherm.
U kunt nu Material Design UI Android-sjabloonapp aanpassen aan uw vereisten. Het heeft meer dan 50 verschillende activiteiten, vijf thema's en meer dan 100 lay-out XML-bestanden. Dat betekent dat u uw volgende app kunt bouwen door simpelweg een subset van die UI-elementen te selecteren en uw gegevens en bedrijfslogica hiermee te associëren.
Voor meer informatie over de sjabloon raadpleegt u de uitgebreide documentatie die beschikbaar is in de docs map.
Envato Market heeft honderden andere Android-app-sjablonen waaruit u kunt kiezen. Er zijn sjablonen voor games en complete applicaties, evenals uitgebreide startersjablonen zoals die we in dit bericht hebben gebruikt. Dus neem een kijkje en u bespaart uzelf misschien veel werk in uw volgende Android-app.