Tworzenie aplikacji mobilnych

30
Gru

Wtyczki Android Studio

Android Studio to narzędzie umożliwiające w bardzo produktywny sposób tworzenie aplikacji dla systemu Android. Posiada solidne narzędzia do edycji kodu, debugowania i profilowania wydajności. Inną przydatną funkcjonalnością jest tworzenie interfejsu użytkownika w sposób graficzny z użyciem metody drag&drop. Jednak nawet tak zaawansowane i rozbudowane narzędzie może być przystosowane do naszych potrzeb w większym stopniu, odpowiadający naszym oczekiwaniom i wspierający naszą produktywność.

 

Co sprawia, że jesteśmy bardziej produktywni? Każdy programista może mieć różne odpowiedzi na to pytanie. Najczęściej chodzi jednak o możliwość pisania większej liczby wierszy za pomocą kilku klawiszy czy bardziej wydajne debugowanie i profilowanie kodu. Lepsze zrozumienie IDE, w którym pracujemy, może znacząco zwiększyć produktywność. W Android Studio mamy dostęp do pokaźnej ilości wtyczek usprawniających naszą pracę.

 

Konfiguracja

Aby włączyć menu wtyczek, w ustawieniach Android Studio wybieramy sekcję Plugins. Mamy możliwość instalacji wtyczek z różnych źródeł, np. ze zdalnych repozytoriów czy bezpośrednio z dysku.

Sekcja Plugins ustawień Android Studio.

Sekcja Plugins ustawień Android Studio

 

Przykładowe narzędzia

MVP Generator

Umożliwia generowanie kodu MVP na Androida. Całość jest konfigurowalna, możemy dodać dodatkowe moduły w zależności od naszych preferencji.  

Android Selectors Generator

Ta wtyczka Android Studio automatycznie generuje graficzne selektory z odpowiednio nazwanych zasobów Androida.  

Material Theme UI EAP

Android studio ma dwa dostępne motywy – Domyślny i Dracula. Gdy zainstalujesz tę wtyczkę, możesz użyć motywu odpowiadającego standardom Material Design.  

Android DPI Calculator

Kalkulator DPI pozwala obliczyć różne rozmiary we wszystkich dostępnych i domyślnych gęstościach pikseli na platformie Android, tj. xxxhdpi, xxhdpi, xhdpi, hdpi, mdpi, ldpi i tvdpi.  

Zużycie zasobów Androida

Ta wtyczka automatycznie zlicza zużycie zasobów i pokazuje je w lewym pasku każdej linii w twoim Android Studio. Okazuje się przydatna, jeśli chcesz pozbyć się zasobów, które nie są już używane w twoim projekcie.  

AndroidLocalizationer

Wtyczka pomaga ci przetłumaczyć ciągi znaków użytych w aplikacji na inne języki. Zainstaluj ją, a następnie kliknij prawym przyciskiem myszy plik zasobów ciągu, zaznacz „Konwertuj na inne języki” i wybierz języki, które chcesz.  

Android Wifi ADB

Android Wifi ADB pomaga instalować, uruchamiać i debugować aplikacje dla Androida za pośrednictwem Wi-Fi. Czas pozbyć się noszenia kabla USB.

 

Rozbudowana lista ciekawych i użytecznych wtyczek jest dostępna tutaj.

11
Lis

Push notyfikacje App Center

Push notyfikacje są funkcją aplikacji mobilnych, która w obecnych czasach znajduje się w większości aplikacji mobilnych. Mogą być wykorzystywane zarówno do informowania użytkownika o ważnych dla niego czynnościach czy wydarzeniach, jak również mogą stanowić istotną pomoc przy promowaniu i reklamowaniu naszych usług czy produktów. App Center jako kompleksowy system wspomagający tworzenie aplikacji mobilnych posiada moduł umożliwiający wysyłanie push notyfikacji. Aby z niego skorzystać, potrzebujemy projektu React Native z dodaną i skonfigurowaną biblioteką App Center (link).

Gdy mamy już taki projekt, zajmijmy się instalacją modułu, wykonując poniższe polecenie w katalogu głównym projektu:

npm install appcenter-push –save 

Następnie na końcu pliku android/app/build.gradle dodajemy:

apply plugin: 'com.google.gms.google-services' 

Oraz w pliku android/build.gradle:

buildscript { 
  repositories { 
     // Add google line if missing before jcenter 
     google() 
     jcenter() 
  } 
 
  dependencies { 
    // Add this line 
    classpath 'com.google.gms:google-services:4.0.1' 
  } 
} 
 
allprojects { 
 repositories { 
    // Add google line if missing before jcenter 
    google() 
    jcenter() 
  } 
} 


Konfiguracja Firebase

Kolejnym krokiem będzie stworzenie projektu w usłudze Firebase. Jest to system Google umożliwiający komunikację z aplikacją oraz dostarczający wiele ciekawych modułów do naszych aplikacji. Wchodzimy na poniższą stronę https://console.firebase.google.com i tworzymy nowy projekt.

 

Tworzenie nowego projektu Firebase



Następnie tworzymy nową aplikację Android i pobieramy plik google-services.json, który umieszczamy w katalogu android/app

Pobieranie pliku google-services.json



Teraz pobierzemy klucz API usługi Firebase. W tym celu wchodzimy do konsoli Firebase > Ustawienia projektu > Komunikacja w Chmurze. Klucz serwera (API) jest dostępny w sekcji Dane logowania dla projektu.

Sekcja Dane logowania



Skopiowany klucz wklejamy w odpowiednim polu w zakładce Push Notifications w projekcie App Center.

Dodawanie klucza serwera



Dostępna jest teraz opcja wysyłania notyfikacji.

Okno dialogowe wysyłania push notyfikacji



Po wypełnieniu wymaganych pól możemy wysłać notyfikację na urządzenia.


Grupy odbiorców aplikacji 

App Center umożliwia również tworzenie tzw. Audiences, czyli grup, do których ma zostać skierowana aplikacja na podstawie odpowiednich reguł jak: kraj, wersja aplikacji, model urządzenia, itp.

Dodawanie nowej grupy odbiorców aplikacji



Podsumowując, App Center dostarcza całkiem dobry moduł umożliwiający wysyłanie push notyfikacji. Nie posiada jednak funkcji wysyłania tzw. Rich notifications, czyli powiadomień zawierających zdjęcia lub filmy – w takim przypadku warto użyć tutaj biblioteki OneSignal. Jednak w mało wymagających przypadkach Push Notifications z użyciem App Center jest wystarczające. 

10
Lis

Narzędzia diagnostyczne i analityczne App Center


Moduł diagnostyczny


Podczas konserwacji aplikacji ważnym zadaniem jest odpowiednie reagowanie na pojawiające się błędy i crashe aplikacji. Czasami ponowne wykonanie błędu jest bardzo trudne do odtworzenia i dlatego potrzebujemy o nim niezbędnych informacji. Z pomocą przychodzi tu moduł Diagnostics systemu App Center. Pozwala na wyświetlanie błędów występujących podczas pracy aplikacji i ich diagnozowanie. Aby użyć funkcji potrzebujemy projektu React Native z zainstalowaną biblioteką App Center (instrukcja dostępna tutaj). W takim projekcie w katalogu głównym wykonujemy polecenie: 

npm install appcenter-crashes --save-exact 

Po zainstalowaniu modułu, w przypadku crashu aplikacji, mamy dostęp do informacji o błędzie z użyciem konsoli App Center.


Symulacja błędu aplikacji

Zasymulujmy teraz crash aplikacji. W pliku App.js naszej aplikacji zaimportujmy bibliotekę:

import Crashes from 'appcenter-crashes'; 

Następnie w metodzie render() lub componentDidMount() dodajmy wywołanie metody:

Crashes.generateTestCrash();

W zakładce Diagnostics aplikacji App Center pojawią się szczegóły o błędzie. Oczywiście sam moduł jest znacznie bardziej rozbudowany, np. umożliwia przeglądanie informacji o błędach wewnątrz aplikacji lub unieszkodliwianie ich skutków.


Moduł analityczny
 

Innym ciekawym modułem jest moduł odpowiadający za statystyki związane z naszą aplikacją. Aby do niego przejść, wybieramy zakładkę Analytics projektu App Center.

Strona modułu analitycznego projektu aplikacji w App Center



Dostępne tu informacje obejmują liczbę aktywnych użytkowników, szczegóły ich urządzeń, czy ich języków i krajów. Dodatkową opcją są również wydarzenia wewnątrz aplikacji. Aby z niej skorzystać, musimy w projekcie naszej aplikacji React Native zainstalować bibliotekę. Używamy do tego poniższego polecenia:

npm install appcenter-analytics --save-exact

Następnie aby przetestować działanie w aplikacji w pliku App.js naszego projektu, zaimportujmy bibliotekę: 

import Analytics from 'appcenter-analytics'; 

I następnie w dowolnym miejscu (np. po włączeniu aplikacji) wywołujemy metodę, która wywoła konkretne wydarzenie.

Analytics.trackEvent("Render App.js");

W zakładce Events pojawią się stosowne statystyki.

Statystyki wydarzenia wywołanego wewnątrz aplikacji


Funkcja znajduje zastosowanie wtedy, gdy chcemy sprawdzić, które moduły naszej aplikacji są najczęściej używane przez użytkowników. A co za tym idzie – na rozwoju czego powinniśmy się skupić.

Podsumowując, moduły diagnostyczne i analityczne często są pomijane przy tworzeniu aplikacji mobilnych, jednak ich wykorzystanie znacząco usprawnia pracę deweloperom i informuje właściciela aplikacji (zwłaszcza tych komercyjnych) o ich rentowności i działaniach użytkowników.