ABONAMENTE VIDEO REDACȚIA
RO
EN
×
▼ LISTĂ EDIȚII ▼
Numărul 19
Abonament PDF

Clientul Today Software Magazine pentru Android

3Pillar Global Team India
3Pillar Global Team India
DIVERSE


Fără doar şi poate revista Today Software Magazine reprezintă unul dintre elementele ce se afirmă tot mai pregnant în comunitatea IT din Cluj Napoca şi nu numai, transformându-se într-o portavoce prin care profesionişti în diverse domenii din industria sofware îşi etalează expertiza profesională, partajează bune practici din domeniu şi caută împreună soluţii la probleme specifice industriei.

În urmă cu mai bine de patru luni Today Software Magazine a realizat un parteneriat cu 3Pillar Global pentru a implementa o soluție ce facilitează utilizatorilor iPhone/iPad accesul la articolele Today Software Magazine , dar și socializarea în jurul acestora prin mijlocirea partajării articolelor, amplificând puterea creativă a tuturor pentru beneficiul comun. Iată că această colaborate continuă cu o soluţie similară dar, de data aceasta, pe o platformă Android

https://play.google.com/store/apps/details?id=com.tpg.tsm.ui&hl=ro

Începutul colaborării

Există multe asemănări şi diferenţe între cele două soluţii. Una dintre diferenţe este aceea că clientul realizat pe platformele iPhone/iPad a pornit de la zero în timp ce versiunea Android a avut un model funcţional la dispoziţie (lucru care nu a fost întotdeauna un avantaj). De asemenea, multitudinea de rezoluţii existente pentru terminalele ce folosesc Android a condus la modificări sau uneori la o regândire completă a interfeţei cu utilizatorul. Nu în ultimul rând, un interesant aspect este poate acela că întreaga echipă de dezvoltare a soluţiei, formată din patru persoane (un Technical Manager, doiprogramatori şi un tester), este parte a 3Pillar Global India care în șase săptămâni a acoperit tot efortul de implementare necesar demonstrând (dacă mai era nevoie) că diferenţa de fus orar nu mai reprezintă un factor perturbator în industria IT.

Echipa de dezvoltare a urmat principiile enunţate în Adaptive Product Lifecycle Management (un model de dezvoltare utilizat intern în 3Pillar Global şi care a fost definit în jurul metodologiei Agile Scrum), dezvoltarea fiind segmentată pe trei sprinturi (fiecare având câte o temă specifică) a câte două săptămâni.

Astfel, la finele fiecărui sprint a fost prezentat căte un demo util în ajustarea corespunzătoare a soluţiei pentru a acoperi cât mai bine nevoile de a accesa eficient conţinutul seriei Today Software Magazine.

Pentru urmărirea progresului proiectului s-a utilizat Jira, toate task-urile fiind create ca user story-uri şi fiind asignate membrilor echipei de dezvoltare. Ca sistem de control al fişierelor s-a utilizat GIT, fiind creat un branch de dezvoltare la începutul primului sprint. Pentru eliminarea conflictelor, acest branch era inclus în branch-ul master la finalul fiecărui sprint (evident după revizuirea colectivă a codului).

Discuţiile iniţiale s-au concentrat în principal pe respectarea design-ului şi a funcţionalităţilor implementate în versiunile precedente de iPhone/iPad ale soluţiei. Au existat, desigur, o serie de adaptări la specificul înterfeţei utilizator Android dar, în acelaşi timp, au fost propuse mai multe modificări ce au fost ulterior acceptate. Printre cele mai importante modificări implementate în raport cu versiunea iOS a clientului Today software Magazine amintim:

  • Actualizare: S-a propus implementarea a două modalităţi de informare a utilizatorilor despre conţinutul nou ce a apărut între timp în cadrul revistei. O variantă este dată de utilizarea de notificări push ce vor semnala că este conţinut nou, iar utilizatorii vor putea să facă o actualizare explicită. A doua metodă este prin punerea la dispoziţie a unei funcţionalităţi de actualizare manuală ce va permite utilizatorilor să decidă când doresc să verifice conţinutul. Într-un final s-a optat pentru implementarea celei de-a doua variante.
  • Partajarea în reţelele de socializare: Partajarea a diferite articole ale revistei pe Facebook sau Twitter s-a realizat prin folosirea unei biblioteci Android proprietare 3Pillar Global, care permite partajarea de conţinut pe reţelele de socializare chiar dacă utilizatorul nu are instalate Facebook sau Twitter pe propriul dispozitiv.
  • Suport pentru Android GingerBread 2.3.3, deoarece la momentul dezvoltării acesta reprezenta 25% din piaţa de dispozitive Android (statistică preluată din Android Market). În plus s-a sugerat portarea aplicaţiei pe tablete de 7"" din aceleaşi considerente de popularitate în rândul utilizatorilor Android.

Arhitectura aplicaţiei

Imediat după lansarea în execuţie, aplicaţia afişează un splash screen ce permite selectarea limbii de utilizare: română sau engleză. După alegerea limbii aplicaţia afişează coperta ultimului număr al revistei şi lista articolelor acestui număr (preluate de pe web serverul TSM). În background se încarcă datele corespunzătoare articolelor într-o bază de date SQLite şi în memoria internă (dacă este cazul).

În partea stângă a ecranului, selectând meniul din action bar se poate consulta lista tuturor numerelor revistei (fiecare fiind reprezentată de coperta sa), iar în panoul din dreapta este afişată mereu lista articolelor numărului curent selectat.

Selectarea oricărui articol din listă va avea ca efect afişarea conţinutului acestuia precum şi detalii despre autor. Prin selectarea butonului Share, se poate opta prin intermediul unui meniu pop-up pentru partajarea articolului pe platforme ca Facebook, Twitter sau e-mail.

De asemenea, limba selectată pentru afişare poate fi modificată prin selecţia meniului Settings din action bar. La selectarea unei noi limbi aplicaţia va şterge toate datele stocate şi va reîncepe încărcarea conţinutului de pe serverul TSM folosind noua limbă selectată.

Bibliotecile şi instrumentele utilizate

Pentru implementarea soluţiei au fost utilizate următoarele medii, instrumente şi biblioteci:

  • Eclipse: Eclipse IDE a fost utilizat ca mediu de dezvoltare.
  • Charles Proxy : a fost utilizat pentru testarea API şi pentru verificarea funcţionării aplicaţiei corespunzătoare iPhone.
  • SocialAuth Android Library (http://code.google.com/p/socialauth-android/) : bibliotecă dezvoltată intern ce permite autentificarea unui utilizator şi partajarea de informaţii în diferite reţele de socializare ascunzând detalii de conectare. Biblioteca a fost utilizată pentru partajarea articolelor pe diverse reţele sociale şi e-mail.
  • Android-app-v7-appcompat: Deoarece action bar-ul este implementat doar începând cu Android 4.0, această bibliotecă permite afişarea unui action bar şi în versiuni inferioare de Android. Implementare acestui action bar elimină dependenţa de butonul de opţiuni din Android.
  • I3P Android: Reprezintă o altă componentă dezvoltată intern în cadrul 3Pillar Labs, utilizat în crearea barei de navigare din partea stângă.

Provocări

Următoarele secţiuni prezintă câteva dintre provocările rezolvate cu succes de echipa de dezvoltare. În fiecare caz este descrisă problema şi modul în care a fost rezovată.

Optimizarea imaginilor

Problema

În ecranul principal al aplicaţiei este prezentată lista articolelor numărului selectat împreună cu pozele autorilor. Dimensiunea imaginilor originale aflate pe server trebuia redusă pentru a evita erori de tipul OutOfMemory ce conduceau la întreruperea aplicaţiei pentru anumite scenarii particulare.

Soluţie

Pentru a soluţiona eficient problema s-a utilizat metoda bitmap sampling care reprezintă un procedeu prin care se reduce dimensiunea unei imagini. Provocarea în acest caz a constat în menţinerea raportului de aspect al imaginii originale, nealterându-se calitatea imaginii redimensionate. În continuare, este prezentat un fragment de cod care calculeze dimensiunea imaginii reduse:

Calcul dimesiune imagine redusă

public  int calculateInSampleSize(BitmapFactory.Options options, int reqWidth, int reqHeight) {
		final int height = options.outHeight;
		final int width = options.outWidth;
		if(height<0 || width < 0)
			return -1;
		int inSampleSize = 1;
		final int heightRatio = Math.round((float) height / (float) reqHeight);
		final int widthRatio = Math.round((float) width / (float) reqWidth);
		inSampleSize = heightRatio < widthRatio ? heightRatio : widthRatio;
	  return inSampleSize;
} 

Crearea noii imagini

public Bitmap sampleBitmap(BitmapFactory.Options options,int reqWidth, int reqHeight, TSMBaseActivity activity, String id, InputStream imageResponse, String imagePath) throws IOException {
    int sampleSize = calculateInSampleSize(options, reqWidth, reqHeight);
    if (sampleSize >= 0) {
	options.inJustDecodeBounds = false;
	options.inSampleSize = sampleSize;
			
	if(haveNetworkConnection(activity.getBaseContext())){
		try{
			imageResponse=new HttpRequest(activity.getBaseContext()).getHttpInputStream(imagePath); //FileNotFoundException, MalformedUrlException
		}catch(IOException e){
			e.printStackTrace();
			if(e instanceof SocketException || e instanceof SocketTimeoutException){
			}
			return null;
		}
		if(imageResponse!=null){
			Bitmap bmp = BitmapFactory.decodeStream(imageResponse, null, options);
			if(bmp==null)
				return null;
			saveToInternalSorage(bmp, activity,id);
			return bmp;
		}
	}
}
    return null;
}

 

Redarea filmelor Youtube

Problema

O serie de articole de pe serverul TSM conţin filme Youtube inserate. Redarea acestor filme în componenta de vizualizare a paginii web reprezintă o provocare deoarece nu avem control asupra acesteia. De asemenea, implementarea variază în funcţie de dispozitiv (Gingerbread şi ICS). De exemplu, pe dispozitivele Gingerbread filmele Youtube se redau automat în varianta full screen, în timp ce pe dispozitive ICS sau mai vechi utilizatorii trebuie să selecteze manual opţiunea de full screen.

Soluţie

S-au implementat abordări distincte pentru dispozitivele Gingerbread şi ICS. Pentru Gingerbread s-a utilizat controlul Android implicit Videoview în timp ce pentru dispozitive ICS (sau mai vechi) s-a utilizat Java Reflection API pentru redarea similară a filmelor. Utilizând Reflection API se obţine referinţa la HTML5VideoFullScreen$VideoSurfaceView din webkit şi este redat filmul în full screen. Pentru ambele versiuni sunt redate mai jos exemple de cod:

YouTube video in Android 2.3.3

VideoView customVideoView = (VideoView) customViewContainer.getFocusedChild();
Field mUriField = VideoView.class.getDeclaredField("mUri");
mUriField.setAccessible(true);
Uri uri = (Uri) mUriField.get(customVideoView);

YouTube video in Android 4.0

Class _VideoSurfaceView_Class_ = Class.forName("android.webkit.HTML5VideoFullScreen$VideoSurfaceView");
java.lang.reflect.Field _HTML5VideoFullScreen_Field_ = _VideoSurfaceView_Class_.getDeclaredField("this$0");
_HTML5VideoFullScreen_Field_.setAccessible(true);
Object _HTML5VideoFullScreen_Instance_ = _HTML5VideoFullScreen_Field_.get(((FrameLayout) view).getFocusedChild ());

Îmbunătăţirea performanţelor aplicaţiei

Problema

Într-o primă fază transferul asincron al datelor TSM şi prezentarea acestora în interfaţa utilizator dura aproximativ 20-25 minute. Pentru a reduce din timpul de transfer au fost create mai multe procese care transferau datele în paralel de pe server, crescând astfel viteza de download. Provocarea în acest context a constat din sincronizarea datelor între procese şi evitarea oricărui conflict (de exemplu, pozele autorilor nu puteau fi transferate până când nu se transferau informaţiile despre autori, deoarece calea imaginii de transferat era conţinută în aceste informaţii). Prin urmare, provocarea a constat în optimizarea timpului de transfer al datele şi în îmbunătăţirea performanţei generale a aplicaţiei.

Soluţie

Ca soluţie s-a implementat ThreadPoolExecutor şi toate task-urile au fost ataşate executorului. Iniţial s-au creeat 2 thread-uri care se executau în paralel. După ce execuţia acestora se finaliza, următoarele thread-uri erau extrase din coadă pentru transferul datelor în funcţie de acţiunile de navigare ale utilizatorului.

ThreadPoolExecutor executorPool = new ThreadPoolExecutor(2, 2,60, TimeUnit.SECONDS, new ArrayBlockingQueue(2), threadFactory);
executorPool.execute(new LoadIssueImages(handler, language,getBaseContext()));
executorPool.execute(new LoadIssueArticles(handler, language,getBaseContext()));
executorPool.execute(new LoadAuthorInformation(handler,language, getBaseContext()));
executorPool.execute(new LoadAuthorImages(handler, language,getBaseContext(), this));

Testarea

Aplicaţia a fost testată pe următoarele dispozitive: Nexus 4 (Android 4.3) , Nexus 7(Android 4.1, 7"" Tablet) , HTC Desire (Android 2.3.3 , 480x800) şi Samsung Tab(7",10") , Galaxy Y(240x320).

Selecţia dispozitivelor s-a făcut pentru a acoperi un număr cât mai mare de potenţiali utilizatori de telefoane/tablete Android. Aplicaţia a fost testată în următoarele contexte:

  • Testarea lansării în execuţie pentur prima dată: După instalarea cu succes a aplicaţiei se crează un icon, la selectarea acestuia fiind lansată aplicaţia în execuţie prin afişarea unui splash screen iniţial.
  • Testare API: S-a verificat şi validat funcţionarea similară a soluţiei Android cu soluţia pentru iPhone/iPad pentru a se garanta furnizarea unei experienţe similare.
  • Testarea reţelei şi a conexiunii la Internet: S-a verificat aplicaţia în condiţiile unor probleme de conectare la internet în momentul în care se doreşte transferarea datelor.Utilizatorii vor primi mesajul de eroare "Network error. Please try again later"
  • Stress testing reprezintă un mod de a asigura stabilitatea soluţiei dezvoltate prin apăsarea în secvenţa rapidă a diverse butoate/link-uri/imagini etc. . Astfel, aflându-se în situaţia de a servi mai multe cereri în acelaşi timp au fost detectate mai multe defecţiuni.  
  • Testare cu diterite tipuri de reţea: Aplicaţia a fost testată pe mai multe tipuri de reţele, cum ar fi: 2G, 3G şi Wi-Fi.
  • Testarea pe dispozitive cu rezoluţii diferite: Aplicaţia s-a testat pe o diversitate de rezoluţii în intervalul 240x320 şi 1280x800 asigurându-se faptul că aplicaţia funcţionează corespunzător pe diferite rezoluţii.

Conferință

Sponsori

  • comply advantage
  • ntt data
  • 3PillarGlobal
  • Betfair
  • Telenav
  • Accenture
  • Siemens
  • Bosch
  • FlowTraders
  • MHP
  • Connatix
  • UIPatj
  • MetroSystems
  • Globant
  • Colors in projects