PhoneGap : proste triki na telefoniki


PhoneGap jest biblioteką , która pozwala programistom łączyć się bezpośrednio z urządzeniami mobilnymi używając bibliotek JavaScript. Z powodu wielu platform mobilnych, bardzo trudne i kosztowne jest tworzenie wielu aplikacji a Javie, Ovbjective-C lub innych natywnych językach. Dzięki bibliotece PhoneGap, wielu programistów internetowych może przekonwertować dotychczasową więdzę na temat HTML, CSS i JacaScript do zastosować z telefonami komórkowymi przy niewielkim wysiłku. Postaramy się zbadać wiele wspólnych funkcji projektowania mobilnego i jak są one realizowane z PhoneGap. Obejmuje to lokalizację GPS, mapy, multimedia, alcelerometry i dużo więcej. W wielu przykładach będziemy wykorzystywać podstawowy HTML, CSS i JavaScript. PhpneGap API będzie dostępne wyłącznie za pomocą różnych zmiennych i funkcji JavaScript. . Kiedy PhoneGAp nie zapewni standardowego wykonania pewnego wyglądu, użyjemy biblioteki mobilnej jQuery dla realizacji spójnego wyglądu na wielu urządzeniach. Mając skonfigurowane środowisko, będziesz musiał pobrać jQuery i bibliotekę mobilną jQuery. Wewnątrz katalogu www (gdzie znajduje się plik index.html), powinny być stworzone dwa nowe foldery : scripts i css. Pliki JavaScript z tymi dwoma pobranymi bibliotekami powinny być umieszczone wewnątrz katalogu scripts. Plik CSS i katalog images z biblioteką mobilną jQuery powinna być umieszczona wewnątrz katalogu css. Biblioteki te nie są wspierane przez starsze wersje BlackBerryt, więc będą stosowane z umiarem

01.Określanie czy urządzenie jest gotowe
Problem: Chcemy wykonać wywołanie PhoneGap API, ale nie mamy pewności czy urządzenie jest gotowe ,a aplikacja nie będzie działać ,jeśli API spróbuje uzyskać dostęp do urządzenia przedwcześnie
Rozwiązanie : Podstawowa funkcjonalność , która czyni dostępnym PhoneGap przez JavaScript API zależy od gotowości urządzenia; jednakże, JavaScript może zacząć pracować tak szybko jak dostępny jest Document Object Model (DOM). Dlatego ,zanim wykonamy wywołanie API, musimy upewnić się ,że PhoneGap określił czy urządzenie jest gotowe. Dla iOS, Androida i BlackBerry (wersja 5.0 lub wyższa), dostępny jest niestandardowy typ zdarzenia jakie możesz dołączyć do DOM, a PhoneGap będzie wyzwalał to zdarzenie kiedy urządzenie jest gotowe.
Omówienie
: Będziemy zawsze starali się od dzielić kod, co oznacza ,że JavaScript będzie umieszczany w plikach .js, CSS w plikach .css a HTML w plikach .html. Jak już mówiłem, zawsze powinniśmy tworzyć foldery wewnątrz katalogu www : scripts i css. Jądrem kodu JavaScript będzie umieszczenie wewnątrz pliku nazwanego common.js. Stwórzmy ten plik teraz wewnątrz katalogu scripts. Po jego stworzeniu, umieścimy poniższy kod w pliku:
// Globana zmienna , która mówu nam czy PhoneGap jest gotowy
var isPhoneGapReady = false;
function init() {
// Add an event listener for deviceready
document.addEventListener("deviceready",
onDeviceReady, false);
// Starsze wersje Blackberry < 5.0 nie obsługują niestandardowych zadarzeń PhoneGap, więc
// zamaist tego musimy wykonać interwał co 500 ms, aby zobaczyć ,czy PhoneGap jest gotowy
// Kiedy to zrobimy,. interwał jest zerowany i może się zacząć normalne przetwarzanie
var intervalID = window.setInterval(function() {
if (PhoneGap.available) {
onDeviceReady();
}
}, 500);
}
function onDeviceReady() {
window.clearInterval(intervalID);
// ustawienie na true
isPhoneGapReady = true;
alert('Urządzenie jest teraz gotowe);
}
// Ustawiamy onload do wywołania funkcji init
window.onload = init;
Ten kod wykonuje tylko jedną , ważną rzecz : tworzy i ustawia zmienną globalną nazwaną isPhoneGapReady, która będzie używana przez nas wielokrotnie. Aby dowiedzieć się ,czy urządzenie jest gotowe, PhoneGap tworzy i wyzwala okno zdarzenia nazwane deviceready. Przez nasłuch tego wydarzenia, zmienna może być zmieniona. Alert jest użyteczny dla testowania, ale oczywiście powinniśmy usunąć go dla celów produkcyjnych. W tym kodzie, umieszczono duży blok komentarza, pod zdarzeniem nasłuchiwania ponieważ starsze wersje BlackBerry nie wspiera tworzonych zdarzeń niestandardowych. Zamiast tego, kod musi sprawdzić zmienną PhoneGap.available co 500 milisekund aby zobaczyć czy jest gotowe. Kiedy to zrobi interwał jest zerowany a funkjca onDeviceReady jest wywoływana tak samo jak stworzone poprzednio zdarzenie nasłuchiwania. Na koniec, plik index..html musi zostać zaktualizowane aby dołączyć plik JavaScript :
< !DOCTYPE HTML >
< html >
< head >
< title >PhoneGap< /title >
< script type="text/javascript" charset="utf-8"
src="scripts/phonegap-1.0.0.js" >
< script type="text/javascript" charset="utf-8"
src="scripts/common.js" >< /script >
< /head >
< body>
< h1 >Hello World!< /h1 >
< /body >
< /html >
Możesz zauważyć ,że określiliśmu doctype jako HTML5. Wiele nowych telefonów obsługuje wiele funkcji HTML 5, co otwiera cały świat możliwości dla tworzenia interaktywności międzyplatformowej

02.Pobieranie informacji o urządzeniu
Problem : Chcemy dodać funkcjonalność, która jest dostępna tylko na pewnym urządzeniu lub platformie.
Rozwiązanie : Pewne funkcje PhoneGap API są dostępne tylko dla niektórych telefonów. Aby uniknąć ograniczenia możliwości, przez wykrywanie typu urządzenia, można zaoferować różne funkcje dla iOS, Androida lub różnych wersji BlackBerry. PhoneGap posiada globalna strukturę nazwaną device, która zawiera informacje o tym urządzeniu, wersji, UUID, platformie i nazwie. Każda właściwość może być dostępna przez JavaScript
Opis : Istnieje oczywiście wiele różnic pomiędzy różnymi smartfonami. Z powodu tych różnic ważne jest, aby zdawać sobie sprawę na jakim urządzeniu uruchomiona jest aplikacja. Naszym celem jest zarządzanie tylko jednym kodem, ale to nie oznacza ,że nie można dodać dodatkowych funkcji, które wspiera dany telefon. Poniżej mamy przykład JavaScript, jak można uzyskać dostęp do każdej właściwości dostępnej w strukturze urządzenia:
var deviceName = device.name;
var deviceVersion = device.version;
var devicePlatform = device.platform;
var deviceUUID = device.uuid;
var phoneGapVersion = device.phonegap;
Tu nie dzieje się nic specjalnego; każda właściwość będzie przechowana w zmiennej globalnej. Poniższy przykład pobiera informację o platformie urządzenia po poinformowaniu przez PhoneGap aplikacji ,że urządzenie jest gotowe. W oparciu o zwróconą informacje, kod ustawia zmienną globalną, która może być użyta w przyszłych przykładach kodu dla docelowych urządzeń określonej implementacji:
// Globalna zmienna, która będzie mówiła PhoneGap czy jest gotowe
var isPhoneGapReady = false;
// Domyślnie wszystkich typów telefonów są fałszywe
var isAndroid = false;
var isBlackberry = false;
var isIphone = false;
var isWindows = false;
// Przechowanie uuid urządzenia
var deviceUUID;
function init() {
// Dodanie zdarzenia nasłuchiwania dla deviceready
document.addEventListener("deviceready",
onDeviceReady, false);
}
function onDeviceReady() {
// ustawienie na true
isPhoneGapReady = true;
deviceUUID = device.uuid;
// wykrywnaie platform urządzenia
deviceDetection();
}
function deviceDetection() {
if (isPhoneGapReady) {
switch (device.platform) {
case "Android":
isAndroid = true;
break;
case "Blackberry":
isBlackberry = true;
break;
case "iPhone":
isIphone = true;
break;
case "WinCE":
isWindows = true;
break;
}
alert("Używasz " + device.platform);
}
}
// Ustaw onload dla wywołania funkcji init
window.onload = init;
Większość kodu jest podobna jak w Sztuczce 01., z kilkoma dodatkami. Po pierwsze zdefiniowano kilka globalnych zmiennych boolowskich, po jednej dla każdego możliwego typu telefonu. Domyślnie są ustawione na false, jak gdyby nie wykonano wykrywania. Następnie, wewnątrz funkcji onDeviceReady, jest ustawiona zmienna globalna która przechowuje UUID. Tuż pod jest wywołanie funkcji deviceDetection. Wewnątrz tej funkcji wykonywane jest polecenie przełączania na device.platform. W oparciu o dopasowanego polecenia case, ustawiana jest towarzysząca zmienna boolowska na true dla tej platformy. Później, kiedy będziemy zajmować się iPhone′em lub Androidem, można wykonać prostą instrukcję if :
if (isAndroid) {
// Do something for Android only...
}

03.Tworzenie stałego systemu nawigacji
Problem : Chcemy pozwolić użytkownikowi nawigować do innych stron z trwałego menu na dole aplikacji
Rozwiązanie : iOS powszechnie zawiera trwały pasek nawigacyjny , który pozwala na jednodotykowy dostęp do najczęściej używanych widoków. Zazwyczaj, jest umieszczony na dole aplikacji. Piękno PhoneGap polega na tym ,że pozwala na tworzenie aplikacji mobilnych przez korzystanie z HTML, JavaScript i CSS. Twórcy jQuery stworzyli doskonałą bibliotekę nazwają jQuery mobile, która pomaga użytkownikowi naśladować natywny wygląd menu i przycisków na urządzeniu używając HTML i CSS. Dzięki wykorzystaniu tej biblioteki, możesz łatwo osiągnąć standardową stopkę menu dopasowując typową funkcjonalność, do której przyzwyczaili się użytkownicy smartfonów.
Opis : System nawigacji jest tworzony przez podstawowe łącza HTML. Jeśli umieścimy te linki wewnątrz znacznika div, który ma dodatkowe atrybuty data-role , biblioteka jQuery mobile będzie konwertował je na stopkę menu. W tym przykładzie, tworzymy dwa kilki, jeden dla "Home" i jeden dla "About". Kiedy uruchomisz ten przykład na telefonie, kod pojawi się w stopce urządzenia. Ponieważ wykonywana jest praca JavaScript dla wyrównania menu do dołu, możesz zauważyć ,że menu będzie pojawiać się na górze, aby opaść na dół.
< !DOCTYPE HTML >
< html >
< head >
< title >PhoneGap< /title >
< link rel="stylesheet" href="
css/jquery.mobile-1.0rc1.min.css" / >
< script type="text/javascript" charset="utf-8"
src="scripts/phonegap-1.0.0.js" >< /script >
< script type="text/javascript" charset="utf-8"
src="scripts/common.js" >< /script >
< script type="text/javascript" charset="utf-8"
src="scripts/jquery-1.6.4.min.js" >< /script >
< script type="text/javascript" charset="utf-8"
src="scripts/jquery.mobile-1.0rc1.min.js" >< /script >
< /head>
< body >
< h1 >Hello World!< /h1 >
< div data-role="footer" data-position="fixed" >
< div data-role="navbar" >
< ul >
< li> < a href="index.html"
class="ui-btn-active">Home< /a>
< li>< a href="about.html">About< /a>< /li>
< /ul >
< /div >
< /div >
< /body >
< /html >
Kluczem do stworzenia tego menu HTML są atrybuty data-role i data-position na dwóch znacznikach otaczających linki. Zmieniając te wartości można zmienić menu pojawiające się na górze, albo może przepływać przez przeniesienie stałej pozycji. Jeśli chcesz wystylizować menu trochę bardziej możesz dodać kilka innych funkcji. Na przykład, możesz dodać ikonę powyżej każdego linku przez zastosowanie atrybutu data-icon do znacznika linku. Biblioteka jQuery zawiera różne predefiniowane ikony. Jeśli chciałbyś użyć własnych ikon, możesz osiągnąć to w następującysposób:
< style >
.ui-icon-home-custom {
background-image: url(images/home-icon.png);
}
< /style >
< div data-role="footer" data-position="fixed" >
< div data-role="navbar">
< ul >
< li >< a href="index.html" data-icon="home-custom"
class="ui-btn-active">Home< /a >< /li >
< li >< a href="about.html" >About< /a >< /li >
< /ul >
< /div >
< /div >
home-icon.png powinna być zapisana jako PNG-8 i będzie o wymiarach 18x18, z przeźroczystością alpha. Nie musisz wykonać nieniejszej konwencji, ale pomoże to zapewnić bardziej jednolity wygląd w przypadku korzystania z niektórych wbudowanych ikon. Innym doskonałym aby dopasować wygląd paska nawigacyjnego jest zmiana domyślnego motywu. Przez dodanie atrybutu data-theme do linków menu, możesz zmodyfikować użyty kolor i style. Aktualnie, JQuery zawiera pięć wbudowanych tematów. Po prostu ustawiasz wartość atrybuti a,b,c,d lub e dla zmodyfikowania tematu.

04.Wykrywanie statusu sieci urządzenia
Problem
: Chcesz pobrać lub wysłać dane za pomocą połączenia sieciowego urządzenia z aplikacji; jednak , aplikacja nie wie czy użytkownik ma dostęp do sieci
Rozwiązanie : Przed próbą dostępu do treści z Internetu, ważne jest aby upewnić się ,że użytkownik ma dostęp do Internetu. Sklepy z aplikacjami nie akceptują aplikacji , które nie wyświetlają standardowego komunikatu błędu lub ostrzeżeń kiedy użytkownik nie jest połączony z Internetem a treść nie może zostać pobrana. PhonneGap API udostępnia zmienny typ połączenia , który wykrywa bieżący status sieci .Dostępnych jest kilka stałych, które dostarczają dalszych szczegółów dotyczących stanu sieci urządzenia. umożliwiając potencjalne skalowanie treści dla użytkowników w wolniejszej sieci lub z niskim pasmem przepustowości
Opis> : Poprzez zapewnienie ,że zmienna nawigator.network.connection.type nie jest ró1)na stałej Connection.NONE, aplikacja może określić , że urządzenie jest aktywnie połączone z Internetem. Poniższy przykład rozszerza poprzednio stworzony plik common.js przez dodanie nowej funkcji, która wykonuje to sprawdzenie i ustawia zmienną globalną na true. Funckja jest wywoływana z funkcji onDeviceReady:
// Globalna zmienna , która mówi czy PhoneGap jest gotowy
var isPhoneGapReady = false;
// Przechowanie bieżącego stanu sieci
var isConnected = false;
function init() {
// Dodanie zdazenia nasłuchiwania do deviceready
document.addEventListener("deviceready",
onDeviceReady, false);
}
function onDeviceReady() {
// ustawienie na true
isPhoneGapReady = true;
// wykryucie dostępu do siecia
networkDetection();
}
function networkDetection() {
if (isPhoneGapReady) {
// tak długo jak typ połącznie nie jest none,
// urządzenie powinno mieć dostęp do Internetu
if (navigator.network.connection.type != Connection.NONE) {
isConnected = true;
}
}
}
// Ustawienie onload dla wywołania funkcji init
window.onload = init;
Kod ten umożliwia przyszłym funkcjom wykonanie sprawdzenia w celu upewnienia się ,że urządzenie jest podłączone do Internetu przed dokonaniem wywołania zewnętrznego. Kolejny przykład zaktualizuje funkcję networDetection dla ustawienie nowej zmiennej globalnej, wskazującą czy aplikacja jest podłączona do szybkiego połączenia:
// Globalna zmienna , która mówi czy PhoneGap jest gotowy
var isPhoneGapReady = false;
// Przechowanie bieżącego stanu sieci
var isConnected = false;
var isHighSpeed = false;
function init() {
// Dodanie zdarzenia nasłuchioania do deviceready
document.addEventListener("deviceready",
onDeviceReady, false);
}
function onDeviceReady() {
// ustawienie na true
isPhoneGapReady = true;
// wykrywanie dostępu do sieci
networkDetection();
}
function networkDetection() {
if (isPhoneGapReady) {
// tak długo jak typ połącznie nie jest none,
// urządzenie powinno mieć dostęp do Internetu
if (navigator.network.connection.type != Connection.NONE) {
isConnected = true;
}
// określenie czy to połączeni jest szybkie
switch (navigator.network.connection.type) {
case Connection.UNKNOWN:
case Connection.CELL_2G:
isHighSpeed = false;
break;
default:
isHighSpeed = true;
break;
}
}
}
// Ustawienie onload dla wywołania funckji init
window.onload = init;
Teraz , kiedy chcesz załadować zawartość z zewnętrznego serwera, przez określenie czy użytkownik ma połącznie z wolną prędkością, możesz służyć niższą zawartością pasma dla zapewnienia szybszego czasu ładowania .W poprzednim przykładzie, 2G lub nieznany typ połączenia określa niską prędkość. Przykład może być zmieniony aby rozpoznawał inny typ połączeń, takich jak 3G, WiFi itp. jako typy wolnego połączenia.

05.Wykrywanie zmiany statusu sieci
Problem : W 04, wykrywaliśmy że użytkownik miał dostęp do sieci kiedy aplikacja była ładowana pierwszy raz; jednak, w czasie od początkowego wykrycia, aplikacja nie ma pewności czy użytkownik nadal ma łączność przed dokonaniem pierwszego żądania z sieci
Rozwiązanie : Jeśli użytkownik podróżuje ze swoim urządzeniem, stan sieci może się zmieniać, stając się aktywnym lub nieaktywnym. Jeśli aplikacja jest czuła na obecność sieci, ważne jest aby śledzić te zmiany. Może musieć powiadomić użytkownika lub zaimplementować system synchronizacji dla zarządzania zapisem zmian jakich dokonał użytkownik dopóki sieć nie stanie się dostępna ponownie. PhoneGap API dostarcza różnych zdarzeń dla których aplikacja może nasłuchiwać przez standardowe zdarzenie nasłuchiwania DOM. Dwa z tych zdarzeń to online i offline, które są wyzwalane kiedy zmienia się stan sieci.
Opis : W poniższym przykładzie, funkcja onDeviceReady będzie zaktualizowana przez dodanie dwóch zdarzeń nasłuchiwania : online i offline. Kiedy zdarzenie się odpali, będzie wywołana funkcja która będzie zmieniać wcześniej utworzoną zmienną globalną is Connected. Będzie to wykonywane wewnątrz istniejącego pliku common.js:
// Globalna zmienna , która mówi czy PhoneGap jest gotowy
var isPhoneGapReady = false;
// Przechowanie bieżącego stanu sieci
var isConnected = false;
var isHighSpeed = false;
var internetInterval;
function init() {
// Dodane zdarzena nasłuchiwania dla deviceready
document.addEventListener("deviceready",
onDeviceReady, false);
}
function onDeviceReady() {
// ustawienie na true
isPhoneGapReady = true;
// wykrycie dostępu do sieci
networkDetection();
// dołączenie zdarzeń dla wykryania online i offline
document.addEventListener("online", onOnline, false);
document.addEventListener("offline", onOffline, false);
}
function networkDetection() {
if (isPhoneGapReady) {
// tak długo jak typ połącznie nie jest none,
// urządzenie powinno mieć dostęp do Internetu
if (navigator.network.connection.type != Connection.NONE) {
isConnected = true;
}
// określenie czy to połączenie jest szybkie czy nie
switch (navigator.network.connection.type) {
case Connection.UNKNOWN:
case Connection.CELL_2G:
isHighSpeed = false;
break;
default:
isHighSpeed = true;
break;
}
}
}
function onOnline() {
isConnected = true;
}
function onOffline() {
isConnected = false;
}
// Ustawienie onload dla wywołania funkcji init
window.onload = init;
Jak wspominaliśmy wcześniej, ten przykład nie działa na starszych wersjach BlackBerry ponieważ nie może wspierać niestandardowych zdarzeń. Jeśli chcesz aby obsługiwało te starsze wersje, poniższy przykład zawiera dodatkowy kod, który będzie ustawiał przedział dla sprawdzenia czy połączenie sieciowe zmienia się co 5 sekund. Możesz zmodyfikować liczbę milisekund w kodzie jeśli życzysz sobie zwiększyć lub zmniejszyć częstotliwość:
function onDeviceReady() {
window.clearInterval(intervalID);
// ustawienie na true
isPhoneGapReady = true;
// wykrycie dostępu do sieci
networkDetection();
// attach events for online and offline detection
document.addEventListener("online", onOnline, false);
document.addEventListener("offline", onOffline, false);
// set a timer to check the network status
internetInterval = window.setInterval(function() {
if (navigator.network.connection.type != Connection.NONE) {
onOnline();
} else {
onOffline();
}
}, 5000);
}
Tutaj, zamiast instrukcji if , która sprawdza połączenie sieciowe, wywołujemy poprzednio utworzone funckje onOnline i onOffline, zamiast zmiany zmiennej isConnected. Robiąc to , pozwalamy przyszłym funkcjom na dodawanie funkcjonalności bez zmiany kodu

06.Wykonywanie funkcji zwrotnej, kiedy urządzenie jest gotowe
Problem : Po załadowaniu strony, będziesz chciał wykonać jakiś kod JavaScript bezpośrednie, bez wywoływania go ręcznie za każdym razem w kodzie JavaScript
Rozwiązanie : Ponieważ HTML nie pozwala na wiele dynamicznych funkcji, wiele kodu musi być zduplikowane. Aby zminimalizować czas ładowania strony powinieneś załadować minimalną ilość treści za każdym razem, kiedy używasz ponownie takiego kodu. Plik JavaScript common.js musi być lekki ,a dodatkowe pliki JavScript powinny być tworzone dla nowej funkcjonalności. Jednak w chwili obecnej nie ma metody pozwalające na dodatkowe wywołania funkcji kiedy aplikacja określiła że urządzenie jest gotowe. Może aktualizować plik common.js automatyczną funkcją wywołania zwrotnego, która będzie się wykonywać kiedy kod wykryje typ urządzenia , połączenie sieciowe itp., kończąc pracę. Pozwoli ci to użyć tego samego procesu w wielu przyszłych przykładach.
Opis : Ponieważ aplikacja używa jQuery mobile, musisz przeorganizować istniejący kod aby poprawić ładowanie kodu. Kiedy nawigujesz między stronami używając jQuery mobile, wykonuje się żądanie przez AJAX i zdjęcie całej zawartości z pliku HTML (chyba ,że jest wewnątrz znacznika dv , który zawiera typ strony data-role). Oznacza to ,że poprzednie zdarzenie window.onload nie będzie dłużej wyzwalane. Zamiast tego, używane będzie nowe zdarzenie ,które jest dostarczane przez bibliotekę jQuery mobile. Pierwsza rzecz do odnotowania jest to ,że index.html ze Sztuczki 03 wymaga małego przeformowania :
< !DOCTYPE HTML >
< html >
< head >
< title >PhoneGap< /title >
< link rel="stylesheet"
href="css/jquery.mobile-1.0rc1.min.css" />
< script type="text/javascript" charset="utf-8"
src="scripts/phonegap-1.0.0.js">
< /head>
< body >
< div data-role="page" id="index-page" >
< h1 >Hello World!< /h1 >
< div data-role="footer" data-position="fixed" >
< div data-role="navbar" >
< ul >
< li>< a href="index.html"
class="ui-btn-active">Home< /a>< /li> < li >< a href="about.html" >About< /a> < /li >
< /ul >
< /div >
< /div >
< /div >
< script type="text/javascript" charset="utf-8"
src="scripts/jquery-1.6.4.min.js" >< /script >
< script type="text/javascript" charset="utf-8"
src="scripts/jquery.mobile-1.0rc1.min.js" >< /script >
< script type="text/javascript" charset="utf-8"
src="scripts/common.js" >< /script >
< /body >
< /html >
W tym kodzie zmieniono kilka rzeczy. Większość plików JavaScript przesunięta poza znacznik head. Zostawiliśmy główny plik PhponeGap tam ,aby upewnić się , że załaduje się całkowicie zanim zrobi to ,strona ponieważ wszystko umieszczone wewnątrz znacznika head musi w pełni zakończyć ładowanie przed dalszym ładowaniem. Został dodany nowy znacznik div z typem strony data-role. W końcu, poprzednie pliki JavaScript zostały przeniesione w dół a starsze zostały zmienione. Te również muszą być umieszczone na zewnątrz znacznika strony div, ponieważ nie muszą być ładowane ponownie jeśli użytkownik przejdzie z powrotem do strony głównej. Kolejność plików została zmieniona ponieważ , w kolejnym przykładzie, plik common.js będzie aktualizowane do użycia elementów jQuery i biblioteki mobilnej, która musi być załadowana najpierw. Wewnątrz kolejnego przykładu aktualizujemy plik common.js. Zawiera on cały kod z pierwszych kilku sztuczek, który wykonuje następujące działania : gotowość urządzenia, wykrywania urządzenia i wykrywanie sieci, jak również nowa funkcja wywołania zwrotnego. Kluczowym celem tego rozszerzonego kodu jest zezwolenie na uruchomienie własnego kodu związanego z nazwą określonej strony, kiedy strona jest ładowana
// Global zmienna , która mówi nam czy PhoneGap jest gotowe
var isPhoneGapReady = false;
// Domyślny typ telefonu to false
var isAndroid = false;
var isBlackberry = false;
var isIphone = false;
var isWindows = false;
// Przechowanie uuid urządzenia
var deviceUUID;
// Przechowanie bieżącego status sieci
var isConnected = false;
var isHighSpeed;
var internetInterval;
var currentUrl;
function init(url) {
if (typeof url != 'string') {
currentUrl = location.href;
} else {
currentUrl = url;
}
if (isPhoneGapReady) { onDeviceReady();
} else {
// Dodawanie zdarzenia nasłuchiwania dla deviceready
document.addEventListener("deviceready",
onDeviceReady, false);
}
}
function onDeviceReady() {
// ustawienie na true
isPhoneGapReady = true;
deviceUUID = device.uuid;
// wykrywanie platofrmy urządzenia
deviceDetection();
// wykrywanie dostępu do sieci
networkDetection();
// wykonanie zdarzeń przy uruchomieniu
executeEvents();
// wykonanie funkcji wywołania zwrotnego
executeCallback();
}
function executeEvents() {
if (isPhoneGapReady) {
// dołączenie wykrywania zdarzeń online i offline
document.addEventListener("online", onOnline, false);
document.addEventListener("offline", onOffline, false);
// ustawienie timera dla sprawdznia status sieci
internetInterval = window.setInterval(function() {
if (navigator.network.connection.type != Connection.NONE) {
onOnline();
} else {
onOffline();
}
}, 5000);
}
}
function executeCallback() {
if (isPhoneGapReady) {
// pobranie nazwy bieżącej strony html
var pages = currentUrl.split("/");
var currentPage = pages[pages.length - 1].
slice(0, pages[pages.length - 1].indexOf(".html"));
// Pierwsza litera z dużej litery i wykonanie funkcji
currentPage = currentPage.charAt(0).toUpperCase() +
currentPage.slice(1);
if (typeof window['on' + currentPage + 'Load'] ==
'function') {
window['on' + currentPage + 'Load']();
}
}
}
function deviceDetection() {
if (isPhoneGapReady) {
switch (device.platform) {
case "Android":
isAndroid = true;
break;
case "Blackberry":
isBlackberry = true;
break;
case "iPhone":
isIphone = true;
break;
case "WinCE":
isWindows = true;
break;
}
}
}
function networkDetection() {
if (isPhoneGapReady) {
// tak długoa jak typ połączenia to none,
// urządzenie powinno mieć dostęp do Internetu
if (navigator.network.connection.type != Connection.NONE) {
isConnected = true;
}
// określenie czy połączenie jest szybkie czy nie
switch (navigator.network.connection.type) {
case Connection.UNKNOWN:
case Connection.CELL_2G:
isHighSpeed = false;
break;
default:
isHighSpeed = true;
break;
}
}
}
function onOnline() {
isConnected = true;
}
function onOffline() {
isConnected = false;
}
// To jest wywoływane przez jQuery mobile keidy strona została załadowana
$(document).bind("pageload", function(event, data) {
init(data.url);
});
// Ustawienie onload dla wywołania funkcji init
window.onload = init;
Jest tu trochę wydarzeń. Zacznijmy od dołu, od dwóch zdarzeń, które wywołują funkcję init. Kod window.onload pozostaje jak by, i będzie wywoływany kiedy aplikacja jest ładowana pierwszy raz. Przez powiązanie zdarzenia pageload z dokumentem, zapewniamy ,że za każdym razem kiedy użytkownik kliknie nowy link, zdarzenie to będzie wyzwolone kiedy strona zostanie załadowana. Jest również przekazywany bieżący URL dla zaktualizowania funkcji init. Będzie to używane dla implementacji funkcji wywołania zwrotnego. Funkcja init będzie aktualizowana dla przyjęcia tego nowego parametru url. Jednak, ponieważ ten parametr nie jest przekazywany przez zdarzenie window.onload, kod sprawdza czy to jest łańcuch. Kiedy łańcuch nie zostanie wykryty, używane jest location.href i przechowywane w zmiennej globalnej currentUrl. Następnie , jeśli zmienna isPhoneGapReady jest już ustawiona i true, nie trzeba dodawać nasłuchującego i czekać, więc po prostu wywołujemy funkcję onDeviceReady. Funkcja onDeviceReadyt została nieco zmodernizowana a część jej zadań została przeniesiona do nowych funkcji dla późniejszego rozwinięcia, w tym nowo dodana funkcja executeCallback. Pobiera ona zmienną currentUrl i dzieli na część aby móc pobrać tylko nazwę pliku. Nazwa ta jest potem używana do sprawdzenia czy istnieje funckja onIndexLoad. Jeśli taka funkcja istnieje, jest wykonywana. Po dodaniu przyszłych stron, możesz również dodać nowe funkcje, które będą wykonywać się automatycznie po załadowaniu strony. Będą wykonywać dodatkowe przetwarzanie wymagane przez tą stronę. Na przykład, jeśli dodasz funkcję onAboutLoad, aplikacja wykona się kiedy about.html zakończy ładowanie.

07.Wykrywanie kiedy aplikacja została przesunięta do tyłu lub wysunięta na pierwszy plan
Problem : Twoja aplikacja musi wykonać określone działania kiedy została przeniesiona do tyłu (w tle) lub wysunięta na pierwszy plan
Rozwiązanie : PhoneGap API dostarcza dwóch zdarzeń : pause i resume. które zostają wyzwalane kiedy aplikacja zostaje przeniesiona do tła lub na pierwszy plan, odpowiednio. Przez dodanie nasłuchiwacza DOM dla tych zdarzeń, aplikacja może na nie odpowiednio odpowiadać, np. zatrzymać aktualizację z zewnętrznego źródła , zapisywanie postępu gry itp.
Opis : Istniej jedna końcowa aktualizacja która musi wystąpić w piku assets/www/scripts/common.js. Funkcja executeEvents wymaga aktualizacji dal nasłuchiwanie zdarzeń pause lub resume, które PhoneGap wykonuje za każdym razem kiedy aplikacja jest przenoszona w tył lub na pierwszy plan, odpowiednio:
function executeEvents() {
if (isPhoneGapReady) {
// dołączenie zdarzeń dla wykrywania online i offline
document.addEventListener("online", onOnline, false);
document.addEventListener("offline", onOffline, false);
// dołączenie zdarzeń dla wykrywania pause i resume
document.addEventListener("pause", onPause, false);
document.addEventListener("resume", onResume, false);
// ustawienie timera dla sprawdzenia status sieci
internetInterval = window.setInterval(function() {
if (navigator.network.connection.type != Connection.NONE) {
isOnline();
} else {
isOffline();
}
}, 5000);
}
Teraz możemy stworzyć funkcje onPause i onResume. Funkcja onPause jest dobrym miejsce dla zatrzymania przedziałów czasowych lub kontroli , że są na miejscu, jak również ustawia isPhoneGapReady na false
function onPause() {
isPhoneGapReady = false;
// wyzerowanie przedziału wyboru Internetu
window.clearInterval(internetInterval);
}
Funkcja onResume moe przywrócić nasłuchiwanie przerwane funkcją onPause:
function onResume() {
// nie uruchamiaj jeśli phonegap jest już gotowy
if (isPhoneGapReady == false) {
init(currentUrl);
}
}
Funkcja onResume wywołuje funkcję init, która będzie resetowała dowolne przedziały i przyglądała się, jak również wykona funkcję wywołania zwrotnego na stronie dla odświeżenia zawartości

08.Zastosowanie GPS i wyświetlenie pozycji na mapie
Problem : Chcesz uzyskać aktualne położenie GPS urządzenia i umieścić znacznik bieżącej pozycji na mapie
Rozwiązanie : Jedną z funkcjonalności urządzeń mobilnych jest uzyskiwanie położenia urządzeń poprzez GPS lub WiFi i umieszczenie bieżącej pozycji na mapie. Aby odczytać bieżące położenie GPS, PhoneGap dostarcza trzech przydatnych funkcji : getCurrentPosition, watchPosition i clearWatch. Druga funkcja dostarcza częstej aktualizacji położenia jeśli użytkownik się porusza. Bieżące położenie urządzenia jest zwracane poprzez obiekty JavaScript. Ta informacja zawiera znacznik czasowy kiedy uzyskano współrzędne i obiekt , który zawiera wszystkie istotne informacje o współrzędnych. Pozwala to użytkownikowi na pokazanie położenia na mapie (szerokość, długość itd.). PhoneGAP API nie dostarcza natywnego wsparcia dla map, więc najprostszym rozwiązaniem dla wsparcia jest integracja z Google Maps API poprzez JavaScript API. Choć będzie to trochę wolniejsze, gdyż wymaga przesyłania map za pomocą się, wymaga o wiele mniej pracy niż rozszerzanie aplikacje poprzez wtyczki dla różnych smartfonów
Opis : Aby zacząć, musimy stworzyć nowy plik HTML nazwany map.html wewnątrz katalogu assets/www. Ten plik będzie zawierał podstawowy HTML dla wyświetlenia menu jak również znaków zstępczych dla Google Maps API
< !DOCTYPE HTML >
< html >
< head >
< title>PhoneGap< /title >
< meta name="viewport" content="initial-scale=1.0,
user-scalable=no" />
< /head >
< body >
< div data-role="page" id="map-page" >
< div id="map_canvas"
style="width: 300px; height: 300px" >< /div>
< div data-role="footer" data-position="fixed" >
< div data-role="navbar" >
< ul >
< li>< a href="index.html">Home< /a>< /li>
< li>< a href="map.html"
class="ui-btn-active">Map< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/map.js" >< /script >
< /div >
< /bod >
< /html >
navbarzostał zaktualizowany aby zastąpił czasowy przykład About nowym linkiem Map, który jest ustawiony do aktywacji w tym pliku. Powinno to być zaktualizowane również w index.html . Blisko dołu tego pliku, nowy plik JavaScrpt , map.js , został dołączony. Ten plik powinien być stworzony wewnątrz katalogu assets/www/scripts i będzie zawierał jądro tej funkcjonalności
function onMapLoad() {
if (isConnected) {
// ładownie google api
var fileref=document.createElement('script');
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src",
"http://maps.googleapis.com/maps/api/js?sensor=true&callback=" +
"getGeolocation");
document.getElementsByTagName("head")[0].
appendChild(fileref);
} else {
alert("Musisz być połączony z Internetem");
}
}
function getGeolocation() {
// pobrnie współrzędnychgps użytkownik i wyświetlenie mapy
var options = {
maximumAge: 3000,
timeout: 5000,
enableHighAccuracy: true
};
navigator.geolocation.getCurrentPosition(loadMap,
geoError, options);
}
function loadMap(position) {
var latlng = new google.maps.LatLng(
position.coords.latitude, position.coords.longitude);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var mapObj = document.getElementById("map_canvas");
var map = new google.maps.Map(mapObj, myOptions);
var marker = new google.maps.Marker({
position: latlng,
map: map,
title:"You"
});
}
function geoError(error) {
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}
Całkiem sporo wydarzyło się w tym przykładzie. Kiedy strona została załadowana dzięki zaimplementowanej funkcji wywołania zwrotnego , onMapLoad jst wywoływana automatycznie kiedy strona jest załadowana. Ponieważ biblioteka jQuery mobile została użyta, plik JavaScript Google API musi zostać dołączony dynamicznie, w przeciwnym razie, nie załaduje się właściwie poprzez żądanie AJAX. Kiedy Google API zostało załadowane, wykonywana jest funkcja wywołania zwrotnego getGeolocation. Funkcja ta używa PhoneGap API dla uzyskania bieżącego położenia użytkownika. Funkcja nawigator.geolocation.getCurrentPosition akceptuje trzy parametry : powodzenie funkcji, która jest wywoływana kiedy uzyskane jest położenie, błąd funkcji dla wywołania jeśli geopołożenie nie może zostać uzyskane i końcową opcję JSON. Kiedy geopołożenie zostało uzyskane, kod wywołuje funckję loadMap, która akceptuje jeden parametr nazwany position. Parametr ten zawiera dugość i szerokość, jak również kilka innych właściwości, które są używane do centrowania mapy i centrowania znacznika. Reszta przykładu zawiera próbki kodu dostarczonego przez Google dla zademonstrowania ich API. Kiedy uruchomisz ten przykład, nowa mapa będzie załadowana do znacznika div map_canvas i będzie wyśrodkowana w bieżącym położenie. Również znacznik będzie wyśrodkowany identyfikujący gdzie jesteś

09.Użycie kompasu dla pomocy użytkownikowi w nawigacji
Problem : Chcesz wykryć kierunek jaki aktualnie wskazuje urządzenie
Rozwiązanie : iOS, Android i niektóre urządzenia Windows 8 wspierają kompas, który będzie wskazywał kierunek w zakresie od 0 do 360o/ PhoneGap dostarcza kilku funkcji , które działają całkiem podobnie do lokalizacji GPS, gdzie możesz uzyskać bieżący kierunek wskazywany przez urządzenie w stopniach. Możesz zobaczyć tą wartość, a aplikacja będzie otrzymywać regularne aktualizacje swojej pozycji. Przez użycie funkcji nawigator.compass.watchHeading lub nawigator.comapss.getCurrentHeading, będziesz odbierał zmienną magenticHeading, która zawiera wartości między 0 a 359.99 stopni.
Opis : Aby zademonstrować funkcje kompasu, wstawimy razem bardzo prostą stronę HTML, która zawiera dwa obrazki : kompas i jego igłę/ Aby zacząć, potrzebujesz nowej strony HTML. nazwijmy ją comapss.html. Będziesz chciał dodać nową pozycję menu do istniejących stron HTML aby dołączyć nową stronę
< !DOCTYPE HTM L>
< html >
< head >
< title >PhoneGap< /title >
< /head>
< body >
< div data-role="page" id="compass-page" >
< div style="background:
url(images/compass.png) no-repeat" >
< img id="needle" src="images/needle.png" / >
< /div >
< div data-role="footer" data-position="fixed" >
< iv data-role="navbar" >
< ul >
< li> < a href="index.html" >Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html"
class="ui-btn-active" >Compass< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/jQueryRotateCompressed.2.1.js" >< /script >
< script type="text/javascript" charset="utf-8"
src="scripts/compass.js" >< /script >
< /div >
< /body >
< /html >
Ten HTM jest całkiem prosty. Tworzymy element div, który zawiera kompas jako obraz tła i ładujemy obraz igły wewnątrz niego. Na dole dołączymy nowe pliki JavaScript. Pierwszym jest biblioteka , która będzie pomagać obracać obraz w kodzie Javascript. Drugi jest kolejnym plikiem który musi być stworzony , comapss.js
function onCompassLoad() {
var options = { frequency: 500 };
navigator.compass.watchHeading(rotateNeedle,
compassError, options);
}
function rotateNeedle(degree) {
$("#needle").rotate(degree);
}
function compassError(error) {
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}
Używając automatycznego wywołania zwrotnego, funkcji onCompassLoad , stworzyliśmy zegarek aktualizujący kompas co 500 milisekund poprzez funkcję nawigator.comapss.watchHeading. Za każdym razem kiedy aktualizacja jest odbierana, wywoływana jest funkcja rotateNeedle. Używając biblioteki jQuery , obracamy igłę pod kątem urządzenia. Wynik w stopniach jest liczbą między 0 a 359.99. Jeśli urządzenie obraca się wokół, igła również się przesuwa, wskazując bieżący kierunek

10.Użycie akcelerometru dla wykrywania ruchu
Problem : Chcesz wykryć ruch urządzenia jeśli się porusza
Rozwiązanie : Podobnie do kompasu, urządzenie z iOS, Android i BlackBerry 5.0 i wyżej mogą wykryć bieżącego przemieszczenie według osi x,y i z. Istnieją trzy funkcje, które działają w ten sam sposób jak kompas i położenie GPS, które pozwala ci odzyskać aktualne współrzędne x,y i z przez użycie funkcji accelerometer.getCurrentAcceleration. Funkcja accelerometer.watchAcceleration pozwala ci odbierać aktualizacje pozycji urządzenia, podczas gdy funckja accelerometer.clearWatch pozwala wyłączyć odbieranie aktualizacji
Opis : Dla zademonstrowania akcelerometru, użyjemy nowego znacznika HTML 5 canvas i utworzymy obraz kuli przesuwającej się wokół kiedy urządzenie się przemieszcza. Aby rozpocząć, musimy utworzyć nową stronę HTML wewnątrz katalogu assets/www : accelerometer.html:
< !DOCTYPE HTML >
< html >
< head >
< title >PhoneGap< /title >
< /head >
< body >
< div data-role="page" id="accelerometer-page" >
< div data-role="header" data-position="inline" >
< h1 >Bouncing Ball< /h1 >
< /div >
< canvas id="canvas" width="350" height="350"
style="border: 2px solid #000" >< /canvas>
< img id="ball" style="display: none" / >
< div data-role="footer" data-position="fixed" >
< div data-role="navbar" >
< ul >
< li>< a href="index.html">Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html">List< /a>< /li>
< li>< a href="accelerometer.html"
class="ui-btn-active">Accelerometer< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/accelerometer.js" >< /script >
< /div >
< /body >
< /html >
Ten kod wykonuje trzy ważne rzeczy. tworzy nowy znacznik canvs z ID canvas, tworzy znacznik img z ID ball, i zawiera nowy plik JavaScript accelerometer.js. Ten skrypt powinien być utworzony wewnątrz katalogu assets/www/scripts
var canvas;
var context;
var ball;
var prevX = 150;
var prevY = 150;
var offSet = 0.05;
var accelTimer;
function onAccelerometerLoad() {
canvas = document.getElementById('canvas');
context = canvas.getContext('2d');
ball = document.getElementById('ball');
ball.onload = function() {
// po załadowaniu kuli, sytart zegara
var options = { frequency: 100 };
accelTimer =
navigator.accelerometer.watchAcceleration(
moveBall, stopBall, options);
};
ball.src = "images/ball.png";
}
function moveBall(acceleration) {
var x = acceleration.x * 100;
var y = acceleration.y * 100;
var newX = x * offSet + (1 - offSet) * prevX;
var newY = y * offSet + (1 - offSet) * prevY;
prevX = newX;
prevY = newY;
// rysowanie kuli
drawImage(newX, newY);
}
function stopBall(error) {
// zerowanie zegara
navigator.accelerometer.clearWatch(accelTimer);
alert("Wykryto błąd akceleracji");
}
function drawImage(x, y) {
context.clearRect(0, 0, 350, 350);
context.drawImage(ball, 0, 0, 100, 81, x, y, 100, 81);
}
Java Script tworzy siedem zmiennych globalnych. Pierwsze trzy będą używane do wykonywania animacji, ponieważ zawierają referencje do płótna, kontekstu płótna i obrazu kuli. Kolejne cztery zmienne będą używane wewnątrz funkcji moveBall aby pomóc wyliczyć przesunięcie piłki. Ostatnia zmienna będzie zawierała odniesienie do zegara akcelerometru, który będzie zerowany jeśli zaistnieje błąd. Wewnątrz funkcji onAccelereometerLoad, referencje do canvas, context i ball są inicjalizowane. Źródłowy obraz kul jest również ustawiany; jest to po prostu obraz PNG z piłką tenisową 100 pikseli na 81 pikseli. Po pomyślnym załadowaniu obrazu kuli, funkcja navigator.accelerometer.watchAcceleration umieszcza zegar w akcelerometrze. Wynik tej funkcji jest przechowywany w zmiennej globalnej nazwanej acelTimer. Zmienna ta zawiera referencję do przedziału który jest tworzony przez PhoneGap. Może być użyta do wyzerowania przedziału przez funkcję clearWatch, jak robimy w funkcji stopBall. Może być konieczne, jeśli sobie zażyczysz , spauzowanie akcelerometru podczas działania aplikacji. Co 100 milisekund, funkcja moveBall będzie wywoływana. Funkcja ta odbiera jeden parametr : acceleration urządzenia. acceleration jest strukturą , która zawiera cztery zmienne : pozycje x,y i z urządzenia i znacznik czasowy kiedy zostały uzyskane. Funkcja moveBall będzie używała pozycji i y dla wyliczenia jaki ruch wystąpił od ostatniego pomiaru. Potem wykona kalkulację i wywoła funkcję drawImage, która będzie przesuwała kule po ekranie. Po pierwsze drawImage zeruje ekran płotna; potem rysuje obraz kuli na ekranie pry nowych współrzędnych x,y , które wyliczyła funkcja moveBall. Jeśli wystąpi błąd podczas detekcji, wywołana zostanie funkcja stopBall. Funkcja zeruje timer z funkcji nawigator.accelerometr.clearWatch. Pojawi się okno dialogowe z informacją o błędzie

11.Wyświetlanie danych w widoku tabelarycznym
Problem : Masz hierarchiczną listę elementów które chcesz wyświetlić w tabeli, kaskadowo, tak ,że kiedy użytkownik wybierze jedną z pozycji, tabela przejdzie do innej filtrowanej listy pozycji, aż użytkownik uzyska określony szczegółowy widok
Rozwiązanie: Użyjemy biblioteki jQuery mobile aby wyświetlić standardowo wyglądającą listę tabeli danych ,które użytkownik może przewijać w górę lub w dół przesuwając palcem. Kiedy wybierze pozycję na liście, biblioteka przefiltruje listę; kiedy kliknie drugą pozycję, wyświetli się strona ze szczegółami. Osiąga się przez podstawowy HTML i wywołania typu data-role nazwanego listview
Opis : Ten przykład nie zawiera żadnego działania PhoneGap; jednak ,jeśli budujesz aplikację mobilną z PhoneGap i masz dane, które chcesz wyświetlić hierarchicznie, będziesz z pewnością chciał wyświetlić ją używając standardowej tabeli, która pozwoli użytkownikom przewijać w górę i w dół palcem. Aby zacząć, tworzymy nowy plik list.html. Powinien zostać dodany link w istniejących stronach HTML. Poniższy HTML w pliku będzie implementował tą listę:
< !DOCTYPE HTML >
< html >
< head >
< title >PhoneGap< /title>
< /head >
< body >
< div data-role="page" id="list-page" >
< div data-role="header" data-position="inline" >
< h1>Types of animals< /h1>
< /div>
< ul data-role="listview" >
< li>Farm
< ul>
< li>< a href="#">Cows< /a>< /li>
< li>< a href="#">Chickens< /a>< /li>
< li>< a href="#">Pigs< /a>< /li>
< /ul>
< /li>
< li>Wild
< ul>
< li>< a href="#">Giraffes< /a>< /li>
< li>< a href="#">Lions< /a>< /li>
< li>< a href="#">Tigers< /a>< /li>
< /ul>
< /li>
< li>Pets
< ul>
< li> < a href="#">Cats< /a>< /li>
< li>< a href="#">Dogs< /a>< /li>
< li>< a href="#">Gerbals< /a>< /li>
< /ul>
< /li>
< /ul>
< div data-role="footer" data-position="fixed" >
< div data-role="navbar" >
< ul>
< li>< a href="index.html">Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html"
class="ui-btn-active">List< /a>< /li>
< /ul>
< /div>
< /div>
< /div>
< /body>
< /html>
Kluczowym czynnikiem , który implementuje listę jest data-role = "listview" a pierwszym znaczniku ul. Stamtąd jest tworzona lista nieuporządkowana. Na każdej liście wewnętrznej , zostanie dodany link do elementu , który powinien przenieść nas do strony ze szczegółami. data-rol="listview" zawiera wiele opcji dla dostosowania wyglądu.
12.Pobieranie kontaktów w książce adresowej
Problem : Chcesz pobrać i wyświetlić listę kontaktów, którą użytkownik ma zapisaną na urządzeniu
Rozwiązanie :
PhoneGap dostarcza funkcji nazwanej contacts.find, która akceptuje cztery parametry, w tym możliwość wyszukania określonego kontaktu. Przez użycie tej funkcji w połączeniu z biblioteką jQuery mobile, możesz wyświetlić listę kontaktów w widoku tabeli, a kiedy kontakt jest wybrany, wyświetlić pełną informację o kontakcie.
Opis : Musimy stworzyć kilka nowych plików. Aby zacząć, musimy stworzyć główną stronę listingu kontaktów. Wewnątrz katalogu assets/www, tworzymy nowy plik nazwany contacts.htm;. Ten plik przechowuje szkielet HTML, który będzie zapełniony przez JavaScript
< !DOCTYPE HTML >
< html >
< head >
< title >PhoneGap< /title >
< /head >
< body >
< div data-role="page" id="contacts-page" >
< div data-role="header" data-position="inline" >
< h1 >Contacts< /h1 >
< /div >
< ul id="contactList" data-role="listview" >
< /ul>
< div data-role="footer" data-position="fixed" >
< div data-role="navbar" >
< ul>
< li>< a href="index.html" >Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html">List< /a>< /li>
< li>< a href="contacts.html"
class="ui-btn-active">Contacts< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/contacts.js">< /script>
< /div>
< /body>
< /html>
Pewne kluczowe element zostały dodane w poprzednim HTML. Po pierwszenowe data-role="header". Będzie ono wyświetla basek nagłówkowy z tytułem Contacts. Potem pusty znacznik ul został doadny z poprzednio użytym atrybutem data-role="listview", który będzie wypełniany kontaktami. Pamiętaj aby wrócić do istniejących plików HTML i dodać link do nowej strony kontaktów! Kolejna strona HTML musi być stworzona, dla wyświetlenia pełnej informacji o kontakcie, który został kliknięty. Wewnątrz katalogu assets/www, stwórz nowy plik nazwany view.html
< !DOCTYPE HTML >
< html >
< head >
< title>PhoneGap< /title>
< /head >
< body >
< div data-role="page" id="contactview-page" >
< div data-role="header" data-position="inline" >
< h1 >View Contact< /h1 >
< /div >
< div id="contact" >
< /div >
< div data-role="footer" data-position="fixed" >
< div data-role="navbar" >
< ul>
< li>< a href="index.html">Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html">List< /a>< /li>
< li>< a href="contacts.html"
class="ui-btn-active">Contacts< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/contacts.js">< /script>v < /div >
< /body >
< /html >
Został dodany inny element nagłówka z tytułem View Contact, i pusty znacznik div został dodany z ID contact. Będzie on używany do wypełnieni informacjami o kontakcie wewnątrz strony. Teraz musimy stworzyć JavaScript. Zaczniemy od stworzenia nowego pliku contacts.js wewnątrz katalogu assets/www/scripts
function onContactsLoad() {
var fields = ["id", "displayName", "name"];
navigator.contacts.find(fields, showContacts);
}
function onViewLoad() {
//pobranie kontaktu przez displayName z URL
var fields = ["id", "displayName", "name",
"emails", "phoneNumbers"];
var options = new ContactFindOptions();
options.filter = getParameterByName("id");
navigator.contacts.find(fields, showContact,
onError, options);
}
function showContact(contacts) {
if (contacts.length > 0) {
var contact = contacts[0];
$("#contact").append("< h2>" +
contact.name.givenName + " " +
contact.name.familyName + "< /h2>");
if (contact.emails.length > 0) {
$("#contact").append("< h3>Emails< /h3>");
$("#contact").append("< ul>");
}
for (var i = 0; i < contact.emails.length; i++) {
$("#contact").append("< li>" +
contact.emails[i].value + "< /li>");
}
if (contact.emails.length > 0) {
$("#contact").append("< /ul>");
}
if (contact.phoneNumbers.length > 0) {
$("#contact").append("< h3>Phone Numbers< /h3>");
$("#contact").append("< ul>");
}
for (var i = 0; i < contact.phoneNumbers.length; i++) {
$("#contact").append("< li>" +
contact.phoneNumbers[i].value + "< /li>");
}
if (contact.phoneNumbers.length > 0) {
$("#contact").append("< /ul>");
}
} else {
alert("Unable to find contact");
}
}
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\\[").replace
(/[\]]/, "\\\]");
var regexS = "[\\?&]" + name + "=([^&#]*)";
var regex = new RegExp(regexS);
var results = regex.exec(currentUrl);
if(results == null)
return "";
else
return decodeURIComponent(results[1].replace
(/\+/g, " "));
}
function showContacts(contacts) {
var cSort = function(a, b) {
aName = a.name.givenName;
bName = b.name.givenName;
return aName < bName ? -1 : (aName == bName ? 0 : 1);
};
contacts = contacts.sort(cSort);
var dividers = "";
for (var i = 0; i < contacts.length; i++) {
var firstLetter = contacts[i].name.givenName.
charAt(0).toUpperCase();
// check if we need to add a divider
if (dividers.indexOf(firstLetter) < 0) {
dividers += firstLetter;
$("#contactList").append(
"< li data-role=\"list-divider\">" + firstLetter + "< /li>");
}
$("#contactList").append(
"< li>< a href=\"view.html?id=" + contacts[i].id +
"\">" + contacts[i].name.givenName + " " +
contacts[i].name.familyName + "< /a>< /li>");
}
$("#contactList").listview('refresh');
}
function onError(contactError) {
alert("Error = " + contactError.code);
return false;
}
Całkiem sporo dzieje się w pliku JavaScript. Pierwsze dwie funkcje, onContactsLoad i onViewLoad, wykonują wyszukiwanie kontaktów. Pierwsza funkcja pobiera wszystkie kontakty z książki adresowej. Druga funkcja filtruje kontakty poprzez id , który jest przekazywany przez URL dla pobrania pojedynczego kontaktu (np. wyświetlenie pełnej informacji o kontakcie wybranym z listy). Kolejna funkcja showContact, odbiera listę kontaktów z udanego wyszukiwania kontaktu z onViewLoad. Funkcja ta wyświetla potem podstawowe informacje o kontakcie. Jest więcej pól , które mogą być dodane, ale aktualnie wyświetlimy, nazwisko, adres email i numer telefonu kontaktu.. Funkcja getParameterByName jest po prostu pomocną funkcją która jest używana do pobierania id z kwerendy. Końcowa funkcja showContacts jest wywoływana , kiedy lista kontaktów została z powodzeniem pobrana przez pierwszą funkcję, onContactsLoad. showContacts pobiera listę kontaktów, iteruje przez każdy i dołącza nową pozycję listy do tablicy widoku stworzoną w pliku contacts.html. Jako miły dodtek, kontakty są sortowane alfabetycznie poprzez giveName

13.Tworzenie nowego kontaktu w książce adresowej
Problem : Chcesz pozwolić aplikacji na stworzenie i zapisanie nowego kontaktu lub edycję istniejącego w książce adresowej urządzenia
Rozwiązanie : PhoneGap dysponuje funkcją contacts.create która akceptuje strukturę z informacją o kontakcie. Tworzy obiekt newContact , który zawiera funkcję save dla dodania kontaktu do książki adresowej. Kiedy Contact.id już istnieje, informacja jest aktualizowana zamiast tworzenia nowego kontaktu. Przez stworzenie nowego formularza, który pozwoli nam wprowadzić informacje o kontakcie, kiedy użytkownik wysyła dane, będzie zapisywana w książce adresowej.
Opis : Pierwszą rzeczą jaką robimy jest tworzenie nowego formularza. Wewnątrz katalogu assets/www. tworzymy nowy plik form.htm. Zawiera podstawowy formularz używany do zbierania informacji o kontakcie
< !DOCTYPE HTML >
< html >
< head >
< title >PhoneGap< /title >
< /head >
< body >
< div data-role="page" id="form-page" >
< div data-role="header" data-position="inline" >
< a href="contacts.html" data-icon="delete" >
Cancel< /a>
< h1>Add Contact< /h1>
< a onClick="return saveContact()" href="#"
data-icon="check" data-theme="b">Save< /a>
< /div>
< form action="form.html" method="post" >
< input type="hidden" name="id" value="0" / >
< table >
< tr>
< td>Display Name< /td>
< td>< input type="text" name="displayName"
value="" />< /td>
< /tr >
< tr>
< td>First Name< /td>
< td>< input type="text" name="firstName"
value="" />< /td>
< /tr>
< tr>
< td>Last Name< /td>
< td>< input type="text" name="lastName"
value="" />< /td>
< /tr>
< tr>
< td>Email (Home)< /td>
< td>< input type="text" name="email_home"
value="" />< /td>
< /tr>
< tr>
< td>Email (Work)< /td>
< td>< input type="text" name="email_work"
value="" />< /td>
< /tr>
< tr>
< td>Email (Other)< /td>
< td>< input type="text" name="email_other"
value="" />< /td>
< /tr>
< tr>
< td>Phone (Home)
< input type="text" name="phone_home"
value="" />< /td>
< /tr>
< tr>
< td>Phone (Work)< /td>
< td>< input type="text" name="phone_work"
value="" />< /td>
< /tr>
< tr>
< td>Phone (Other)< /td>
< input type="text" name="phone_other"
value="" />< /td>
< /tr>
< /table>
< /form>
< div data-role="footer" data-position="fixed" >
< div data-role="navbar" >
< ul>
< li>< a href="index.html">Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html">List< /a>< /li>
< li>< a href="contacts.html"
class="ui-btn-active">Contacts< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/contacts.js">< /script>
< /div>
< /body>
< /html>
Przyciski Save ,Cancel i różne pola kontaktów zostały dodane do paska nagłówkowego ,które są pokazane na stronie podglądu są dodane do formularz. Dwie główne aktulizacje muszą być dokonane na stronach contacts.html i view.html. Pasek nagłówka musi być zaktualizowana przyciskami Add i Edit na odpowiednich stronach , które będą łączyć użytkownika z formularze. Poniżej mamy zaktualizowany nagłó1)ek dla pliku contacts.html
< !DOCTYPE HTML>
< html>
< head>
< title >PhoneGap< /title>
< /head>
< body>
< div data-role="page" id="contacts-page" >
< div data-role="header" data-position="inline" >
< h1>Contacts< /h1>
< a href="form.html" data-icon="save"
data-theme="b">Add< /a>
< /div>
...
A teraz plik view.html:
< !DOCTYPE HTML>
< html >
< head >
< title>PhoneGap< /title>
< /head >
< body >
< div data-role="page" id="contactview-page" >
< div data-role="header" data-position="inline" >
< h1>View Contact< /h1>
< a href="form.html" data-icon="save"
data-theme="b">Edit< /a>
< /div>
...
W końcu, plik contacts.js wymaga kilku zmian i wiele nowych dodatków do obsługi dodawania i edytowania kontaktu. Poniżej mamy plik conatcs.js, z kodem dla pobierania kontaktów
function onContactsLoad() {
var fields = ["id", "displayName", "name"];
navigator.contacts.find(fields, showContacts);
}
function onViewLoad() {
getContactById(getParameterByName("id"), showContact);
}
function onFormLoad() {
var id = getParameterByName("id");
// jeśli jest id, ładujemy kontakt
if (id.length > 0) {
getContactById(id, populateForm);
}
}
function getContactById(id, callback) {
// pobranie kontaktu przez displayName z URL
var fields = ["id", "displayName", "name",
"emails", "phoneNumbers"];
var options = new ContactFindOptions();
options.filter = id;
navigator.contacts.find(fields, callback,
onError, options);
}
function showContact(contacts) {
if (contacts.length > 0) {
var contact = contacts[0];
// aktualizacja linku dla dołączenia id
$("a[href='form.html']").attr("href", function(i, href) {
return href + "?id=" + contact.id; < br >});
$("#contact").append("< h2>" +
contact.name.givenName + " " +
contact.name.familyName + "< /h2>");
if (contact.emails.length > 0) {
$("#contact").append("< h3>Emails< /h3>");
$("#contact").append("< ul>");
}
for (var i = 0; i < contact.emails.length; i++) {
$("#contact").append("< li>" +
contact.emails[i].value + "< /li>");
}
if (contact.emails.length > 0) {
$("#contact").append("< /ul>");
}
if (contact.phoneNumbers.length > 0) {
$("#contact").append("< h3>Phone Numbers< /h3>");
$("#contact").append("< ul>");
}
for (var i = 0; i < contact.phoneNumbers.length; i++) {
$("#contact").append("< li>" +
contact.phoneNumbers[i].value + "< /li>");
}
if (contact.phoneNumbers.length > 0) {
$("#contact").append("< /ul>");
}
} else {
alert("Unable to find contact");
}
}
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\\[").replace
(/[\]]/, "\\\]");
var regexS = "[\\?&]" + name + "=([^&#]*)";
var regex = new RegExp(regexS);
var results = regex.exec(currentUrl);
if(results == null)
return "";
else
return decodeURIComponent(results[1].replace
(/\+/g, " "));
}
function showContacts(contacts) {
var cSort = function(a, b) {
var aName = a.name.givenName;
var bName = b.name.givenName;
return aName < bName ? -1 :
(aName == bName ? 0 : 1);
};
contacts = contacts.sort(cSort);
var dividers = "";
for (var i = 0; i < contacts.length; i++) {
var firstLetter = contacts[i].name.givenName.charAt(0).toUpperCase();
// sprawdzenie czy musimy dodać separator
if (dividers.indexOf(firstLetter) < 0) {
dividers += firstLetter;
$("#contactList").append("< li data-role=\"list-divider\">" + firstLetter
+ "< /li>");
}
$("#contactList").append("< li>< a href=\"view.html?id=" + contacts[i].id + " \">"
+ contacts[i].name.givenName + " " + contacts[i].name.familyName + "< /a>< /li>");
}
$("#contactList").listview('refresh');
}
function populateForm(contacts) {
if (contacts.length > 0) {
var contact = contacts[0];
var form = document.getElementsByTagName('form')[0].elements;
form.id.value = contact.id;
form.displayName.value = contact.displayName;
form.firstName.value = contact.name.givenName;
form.lastName.value = contact.name.familyName;
if (contact.emails.length > 0) {
form.email_home.value = contact.emails[0].value;
if (contact.emails.length > 1) {
form.email_work.value = contact.emails[1].value;
if (contact.emails.length > 2) {
form.email_other.value = contact.emails[2].value;
}
}
}
if (contact.phoneNumbers.length > 0) {
form.phone_home.value = contact.phoneNumbers[0].value;
if (contact.phoneNumbers.length > 1) {
form.phone_work.value = contact.phoneNumbers[1].value;
if (contact.phoneNumbers.length > 2) {
form.phone_other.value = contact.phoneNumbers[2].value;
}
}
}
}
}
function saveContact(contacts) {
var form = document.getElementsByTagName('form')[0].elements;
var contact;
if (form.id.value != 0 && typeof contacts == "undefined") {
getContactById(form.id.value, saveContact);
} else if (typeof contacts != "undefined") {
contact = contacts[0];
} else {
contact = navigator.contacts.create();
}
contact.displayName = form.displayName.value;
contact.nickname = form.displayName.value;
var name = new ContactName();
name.givenName = form.firstName.value;
name.familyName = form.lastName.value;
contact.name = name;
var emails = new Array();
if (form.email_home.value.length > 0) {
emails[emails.length] = new ContactField('home', form.email_home.value);
}
if (form.email_work.value.length > 0) {
emails[emails.length] = new ContactField('work', form.email_work.value);
}
if (form.email_other.value.length > 0) {
emails[emails.length] = new ContactField('other', form.email_other.value);
}
contact.emails = emails;
var phoneNumbers = new Array();
if (form.phone_home.value.length > 0) {
phoneNumbers[phoneNumbers.length] = new ContactField('home',
form.phone_home.value);
}
if (form.phone_work.value.length > 0) {
phoneNumbers[phoneNumbers.length] = new ContactField('work',
form.phone_work.value);
}
if (form.phone_other.value.length > 0) {
phoneNumbers[phoneNumbers.length] = new ContactField('other',
form.phone_other.value);
}
contact.phoneNumbers = phoneNumbers;
contact.save(onSuccess,onError);
}
function onSuccess(contact) {
alert("Save Success");
$.mobile.changePage("contacts.html");
}
function onError(contactError) {
alert("Error = " + contactError.code);
}
Istniejąca funkcja onViewLoad została zmieniona aby wywołać nową funkcję getContactById, ponieważ ta sama funkcjonalność jest używana wewnątrz nowej funkcji onFormLoad, która wypełnia pola edycyjne formularza z informacją o kontakcie kiedy użytkownik wybierze Edit. Kiedy kontakt został pomyślnie pobrany, funkcja showContact jest wywoływana dla strony podglądu. Funkcja ta została zmieniona aby dołączyć ID kontaktu do linku Edit URL aby kontakt mógł być pobrany na stronie formularza. Na końcu, cztery nowe funkcje zostały dodane dla wypełnienia i zapisania kontaktu. Po pierwsze funkcja populateFOrm jest wywoływana po kliknięciu przez użytkownika Edit a kontakt zostaje pobierany. Po prostu wydobywa dane z obiektu Contact i wypełnia formularz wartościami. Kiedy użytkownik naciśnie przycisk Save, funkcja saveContact jest wywoływana. Działa podobnie d owypełniania formularza ale w odwrotnej kolejności. Wartości są wyodrębniane z formularza i zapisywane w kontakcie. Kilka ważnych rzeczy wydarza się wewnątrz tej funkcji. Jeśli użytkownik edytuje użytkownika, kontakt musi być pobrany i zaktualizowany; w przeciwnym razie, nowy kontakt jest tworzony przez funkcję nawigator.contacts.create(). Nazwisko, email i numer telefonu są polami specjalnymi ponieważ są tworzone przez inne obiekty PhoneGap. Nazwa musi być zdefiniowana jako nowy obiekt ContactName a email i numer telefonu muszą być zdefiniowane jako nwoy ContactFileds wewnątrz tablicy, ponieważ może być dodanych wiele typów, Ostatnie dwie funkcje zajmują się zapisywaniem i błędami, które mogą pojawić się podczas zapisywania kontaktu. Po skutecznym zapisie użytkownik jest z powrotem przekierowywany do strony contact.html używając funkcji $.mobile.changePage.

14.Dostęp do aparatu i albumu fotograficznego
Problem : Chcesz pozwolić aplikacji na pobieranie zdjęć z aparatu lub wybrać jedno z istniejących zdjęć
Rozwiązanie : PhpneGap udostępnia funkcję nazwaną camera.getPicture, która pozwala na dostęp do domyślne aplikacji fotograficznej urządzenia, pozwalając użytkownikowi podglądać lub wybierać zdjęcia, lub pobierać nowe zdjęcie z aparatu
Opis : Aby rozpocząć, wymagany jest nowy plik HTML dla wyświetlenia wybranego zdjęcia z biblioteki lub nowego zdjęcia z aparatu. Tworzymy nowy plik photos.hyml wewnątrz katalogu assets/www. Upewnij się ,że dodałeś link do tego pliku w istniejących plikach
< !DOCTYPE HTML>
< html>
< head>
< title>PhoneGap< /title>
< /head>
< body>
< div data-role="page" id="contacts-page" >
< div data-role="header" data-position="inline" >
< h1>Photos< /h1>
< /div>
< img src="" id="photo" />
< div data-role="footer" data-position="fixed" >
< div data-role="navbar" >
< ul>
< li>< a href="index.html">Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html">List< /a>< /li>
< li>< a href="contacts.html">Contacts< /a>< /li>
< li>< a href="photos.html"
class="ui-btn-active">Photos< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/photos.js" >< /script>
< /div>
< /body>
< /html>
Po raz kolejny nie ma nic specjalnego w pliku HTML poza tym ,że dodajemy plik JavaScript , photos.js i pusty znacznik img z ID zdjęcią. Będzie on używany do późniejszego wyświetlenia zdjęcia. Teraz należy utworzyć plik photos.js wewnątrz folderu assets/www/scripts
var loaded = false;
function onPhotosLoad() {
// tylko ładowany elector aparatu przy pierwszym ładowaniu
if (!loaded) {
navigator.camera.getPicture(onPhotoLoadSuccess, onFail,
{
quality: 50,
encodingType: Camera.EncodingType.PNG,
destinationType: navigator.camera.DestinationType.FILE_URI
});
loaded = true;
}
}
function onPhotoLoadSuccess(photoUri) {
document.getElementById('photo').src = photoUri;
}
function onFail(message) {
alert('Failed because: ' + message);
}
Wewnątrz funckji wywołania zwrotnego onPhotosLoad, navigator.camera.getPicture jest użyte dla dostępu do aparatu.. Akceptuje trzy parametry : wywołanie zwrotne dla wywołania przy powodzeniu, przy niepowodzeniu i opcja formatu strukturalnego. W powyższym przykładzie, opcja destinationType jest definiowana jako navigator.camera.DestinationType.FILE_URI, która będzie zwracała zdjęcie jako ścieżkę do pliku. Ścieżka ta będzie potem używana wewnątrz onPhotoLoadSuccess do ustawienia źródła poprzednio utworzonego obrazu. Jeśli opcja destinationType jest pominiętra, typem domyślnym jest obraz zakodowany base64. Jeśli chcesz zezwolić użytkownikowo na dostęp do biblioteki zdjęć zamiast pobierania zdjęcia, powinieneś w powyższym przykładzie wyedytować określoną opcję sourceType :
navigator.camera.getPicture(onPhotoLoadSuccess, onFail,
{
quality: 50,
destinationType: navigator.camera.DestinationType.FILE_URI,
sourceType: Camera.PictureSourceType.PHOTOLIBRARY
});

15.Zapisywanie danych do zdalnego serwera
Problem : Chcesz uploadować plik z urządzenia lokalnego na serwer zewnętrzny
Rozwiązanie : Po wybraniu przez użytkownika lokalnej pozycji, do wykonania HTTP POST używana jest klasa FileTransfer, zawierają dane bajtowe do zewnętrznego serwera. Zewnętrzny serwer musi udostępnić usługę sieciową, która zaakceptuje i zapisze
Opis : Ten przykład będzie rozszerzał poprzedni trik i zapisywał zdjęcie które zostało pobrane lub wybrane. Aby zacząć , poprzednio stworzony plik photos.html musi być zaktualizowany tak ,aby zawierał przycisk zapisujący plik. Można to zrobić dodając w nagłówku:
< div data-role="header" data-position="inline" >
< h1>Photos< /h1>
< a onClick="return savePhoto()" href="#"
data-icon="check" data-theme="b">Save< /a>
< /div>
Kiedy użytkownik kliknie przycisk Save, nowa funkcja savePhoto zostanie wywołana, i użyje klasy FileTransfer do uploadu zdjęcia na zdalny serwer. Ta nowa funkcja , jak i dwie inne działa z poprawną lub błędna odpowiedzią serwera, powinny zostać dodane do istniejącego pliku photos.js
var loaded = false;
var currentPhoto = null;
function onPhotosLoad() {
// tylko ładuje selelktor aparatu przy pierwszym ładowaniu
if (!loaded) {
navigator.camera.getPicture(onPhotoLoadSuccess, onFail,
{
quality: 50,
encodingType: Camera.EncodingType.PNG,
destinationType:
navigator.camera.DestinationType.FILE_URI
});
loaded = true;
}
}
function onPhotoLoadSuccess(photoUri) {
// przechowanie bieżącego zdjęcia dla późniejszego zapisu
currentPhoto = photoUri;
document.getElementById('photo').src = photoUri;
}
function onFail(message) {
alert('Failed because: ' + message);
}
function savePhoto() {
if (currentPhoto == null) {
alert("Please select a photo first");
return;
}
var uploadOptions = new FileUploadOptions();
uploadOptions.fileKey = "file";
uploadOptions.fileName =
currentPhoto.substr(currentPhoto.lastIndexOf('/') + 1);
uploadOptions.mimeType="image/png";
var fileTransfer = new FileTransfer();
// Upewnij się że zaktualizowałeś URL poniżej swojej strony
fileTransfer.upload(currentPhoto,
"http://www.webistrate.com/phonegap/upload.php",
uploadSuccess, uploadFail, uploadOptions);
}
function uploadSuccess(result) {
alert("Successfully transferred " +
result.bytesSent + "bytes");
}
function uploadFail(error) {
alert("Error uploading file: " + error.code);
}
Ten przykład zawiera nową zmienną globalną , currentPhoto. Zmienna ta jest ustawiana po wybraniu lub pobraniu zdjęcia. Zmienna ta jest sprawdzana na górze funkcji savePhoto aby zapewnić ,że użytkownik wybrał zdjęcie przed uploadowaniem. Następnie, tworzonych jest kilka zmiennych. Pierwsza, FileUploadOptions, zawiera informację o zdjęciu. Druga, fileKey, zawiera nazwę zmiennej która jest używana przez skrypt serwera do zapisania zdjęcia. Końcowe dwie zmienne , fileName i mimeType, zawierają nazwę pliku i typ pliku, odpowiednio. W końcu, zmienna FileTransfer definiuje określone zdjęcie do uploadowania, URL do którego HTTP POST powinno być wykonane, funkcje wywołania zwrotnego sukcesu i niepowodzenia i poprzednio zdefiniowane opcje. Kiedy uploadowanie zakończy się powodzeniem, pojawi się komunikat z liczbą bajtów wysłanych na serwer

16.Przechwytywanie audio i wideo
Problem : Chcesz zapisywać audio lub wideo przez swoją aplikację
Rozwiązanie : PhoneGap API udostępnia dwie różne funkcje , jedna dla każdego typu mediów : capture.captureAudio i capture.captureVideo. Można użyć klasy FileTransfer do uploadowanai ich na zewnętrzny serwer
Opis : Poniższyprzykład pozwala użytkownikowi stworzyć i uploadować pliki audio i wiedo. Stworzymy nowy plik HTML o nazwie capture.html w katalogu assets/www. Upewnij się ,że link do niego dołączyłeś w istniejących plikach HTML
< !DOCTYPE HTML>
< html>
< head>
< title>PhoneGap< /title>
< /head>
< body>
< div data-role="page" id="contacts-page" >
< div data-role="header" data-position="inline" >
< h1>Capture< /h1>
< /div>
< input type="button" value="Capture Audio"
onclick="captureAudio()" / >
< input type="button" value="Capture Video"
onclick="captureVideo()" />
< div data-role="footer" data-position="fixed">
< div data-role="navbar">
< ul>
< li> < a href="index.html">Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html">List< /a>< /li>
< li>< a href="contacts.html">Contacts< /a>
< li>< a href="photos.html">Photos< /a>< /li>
< li>< a href="capture.html"
class="ui-btn-active">Capture
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/capture.js" >< /script>
< /div>
< /body>
< /html>
Przykład ten tworzy dwa przyciski : jeden, który pozwala użytkownikowi przechwycić audio i drugi do przechywtywania wideo. Dołączonu jest też nowy plik JavaScript, capture,js, wewnątrz katlaogu assets/www/scripts. Plik ten dostarcza dwóch głównych funkcji : inicjujących przechwyt audio i wideo. Ponieważ te funkcje działają w taki sam sposób, będzie potrzebna tylko jedna funkcja dla powodzenia i jedna dla niepowodzenia. Kiedy plik zostanie zapisany , zostanie wysłany do serwera zerwnętrznego za pomocą klasy FileTransfer, w podobny sposób jak w triku 15.
function captureAudio() {
navigator.device.capture.captureAudio(captureSuccess,
captureError);
}
function captureVideo() {
navigator.device.capture.captureVideo(captureSuccess,
captureError);
}
function captureSuccess(files) {
// więcej niż jedenplik może być zwrócony
// więc wykonujemy pętlę i uploadujemy wszystkie
for (var i = 0; i < files.length; i++) {
uploadMediaFile(files[i]);
}
}
function captureError(error) {
alert("Error during capture = " + error.code);
}
function uploadMediaFile(file) {
var uploadOptions = new FileUploadOptions();
uploadOptions.fileKey = "file";
uploadOptions.fileName = currentPhoto.substr(
file.lastIndexOf('/') + 1);
var fileTransfer = new FileTransfer();
fileTransfer.path = file.fullPath;
fileTransfer.name = file.name;
fileTransfer.upload(file,
"http://www.webistrate.com/phonegap/upload.php",
uploadSuccess, uploadFail, uploadOptions);
}
function uploadSuccess(result) {
alert("Trasfer poprawny " +
result.bytesSent + "bytes");
}
function uploadFail(error) {
alert("Bład dostarczenia plku: " + error.code);
}
Podobnie jak w ostatnim triku, kiedy plik multimedialny zostanie wysłany z powodzenie, wywoływana jest funkcja uploadSuccess aby ponformować użytkownika o zakończeniu uploadu. Wewnątrz funkcji captureSuccess, wykonywana jest pętla for na parametrze wejściowym files. Jest to ważne, ponieważ jedna opcja dostępna dla obu typu przechwytwyań pozwala użytkownikowi nagrywać więcej niż tylko jeden plik w danym czasie. Jest to wykonywane przez ustawienie opcji limitu jako trzeciego parametru dla funkcji navigator.device.capture.captureVideo i navigator.device.captureAudio

17.Powiadamianie o alertach i potwoerdzeniach przez wibracje
Problem : Chcesz dopasować stadnadardowy alert i okno dialogowe potwierdzenia lub powiadomienia użytkownika , tworząc urządzenie wibrującym
Rozwiązanie : Standardowe alerty i okna potwierdzenia działają dobrze i są nawet wyświetlane w stylu urządzenia; jednak, w swoich aplikacjach możesz chcieć dopasować przyciski jakie się pojawiają lub nawet uczynić urządzenie wibrującym. PhoneGap dostarcza trzech różnych funkcji : notification.alert, notification.confirm i notification.vibrate, które są używane do tego celu
Opis : Aby zademonstrować funkcje alert i confirm, przesłonimy domyślne funkcje JavaScript aby akceptowały niestandardowe parametry jakie wspiera PhoneGap. Pozwoli nam to utrzymać standardową składnię JavaScript . Aby zacząć, stworzymy nowy plik HTML, nazwany notify.html i zapiszemy go w katalogu assets/www. Upewnij się ,że dodałeś link do tego pliku w pozostałych plikach HTML
< !DOCTYPE HTML>
< html>
< head>
< title>PhoneGap< /title>
< /head>
< body>
< div data-role="page" id="contacts-page" >
< div data-role="header" data-position="inline" >
< h1>Notification Tests< /h1>
< /div>
< div data-role="footer" data-position="fixed">
< div data-role="navbar">
< ul>
< li>< a href="index.html">Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html">List< /a>< /li>
< li>< a href="contacts.html">Contacts< /a>< /li>
< li>< a href="photos.html">Photos< /a>< /li>
< li>< a href="notify.html"
class="ui-btn-active">Notify< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/notify.js">< /script>
< /div>
< /body>

Ten plik po prostu ładuje nowy plik JavaScript , notify.js, który powinie być stworzony wewnątrz katalogu assets/www/scripts
function onNotifyLoad() {
alert("test 1");
alert("test 2", handleClick);
alert("test 3", handleClick, "My title");
alert("test 4", handleClick, "My title", "All done");
confirm("test 1");
confirm("test 2", handleConfirmClick);
confirm("test 3", handleConfirmClick, "My title");
confirm("test 4", handleConfirmClick, "My title",
"Play Again,Quit");
navigator.notification.vibrate(500);
navigator.notification.beep(3);
}
function handleClick() {
}
// przycisk zawiera nazwę klikniętego przycisku
// Windows Phone 7 ignoruje nazwę przycisku, zawsze 'OK|Cancel'
function handleConfirmClick(button) {
if (button == 'Play Again' || button == 'OK') {
// odegraj ponownie
} else if (button == 'Quit' || button == 'Cancel') {
// wykonaj cichy kod
}
}
// przesłonięcie wbudowanej funkcji alert JavaScript
function alert(msg, callback, title, button) {
navigator.notification.alert(msg, callback,
title, button);
}
function confirm(msg, callback, title, buttons) {
navigator.notification.confirm(msg, callback,
title, buttons);
}
W funkcji wywołania zwrotnego onNotifyLoad, wiele alertów i potwierdzeń jest wykonywanych dla zademonstrowania jak można określić więcej szczegółów podczas wywołania zwrotnego. Obie funkcje wspierają metodę wywołania zwrotnego, która jest wykonywana kiedy użytkownik kliknie jeden z przycisków z okna dialogowego, które może wykonać dalsze przetwarzanie. Dla potwierdzenia funkcji wywołania zwrotnego tekst przycisku pokazuje się jako zmienna dla potwierdzenie który przycisk nacisnął użytkownik. Jeśli chcesz ustawić jako domyślną dowolną przekazywaną zmienną do funkcji alert lub confirm, możesz zmodyfikować je tak:
// przesłonięcie wbudowanej funkcji alert JavaScript
function alert(msg, callback, title, button) {
if (typeof callback == 'undefined')
callback = handleClick;
if (typeof title == 'undefined')
title = "my title";
if (typeof button == 'undefined')
button = "click me";
navigator.notification.alert(msg, callback,
title, button);
}
Jest to dobry sposób dla zdefiniowana standardowych alertów lub okien potwierdzenie dla wszystkich istniejących znaczników alertów i potwierdzeń, przy minimalnym wysiłku. Funkcje te powinny być potem przeniesione do common.js aby były dostępne z każdej strony .Mamy również dwie doadtkowe funkcje wywoływany z dołu funkcji onNotifyLoad : navigator.notification.vibrate(500) i navigator.notification.beep(3). Funklcja vibrate może uczyniś urządzenie wibrującym przez kilka milisekund zdefiniowanych jako pierwszy parametr. Funkcja beepc czyni możliwość odtwarzania dźwidku przez czas określony jako pierwszy parametr
18.Przechowywanie danych na urządzeniu
Problem : Chcesz aby aplikacja zapisywała pliki lokalnie na telefonie
Rozwiązanie : PhoneGap dostarcza klasy FileWriter, która pozwala na zpisywanie i zachowanie pliku na urządzeniu. Klasa DirectoryEntry dostarcza funkcji do załadowania pliku do zapisania
Opis : Stworzymy nowy plik HTML nazwany notes.html wewnątrz katalogu assets/www. Plik ten powinien wyglądać standardowo. Zawiera podstawowy HTML aby uzyskać układ i pasek nawigacyjny, jak również formularza zawierający obszar tekstowy pozwalający użytkownikowi na wprowadzanie notatek, które będą zapisywane lokalnie na urządzeniu przez naciśnięcie przycisku Save
< !DOCTYPE HTML>
< html>
< head>
< title>PhoneGap< /title>
< /head>
< body>
< div data-role="page" id="notes-page">
< div data-role="header" data-position="inline">
< a href="index.html" data-icon="delete">Cancel< /a>
< h1>Your Thoughts?< /h1>
< a onClick="return saveNotes()" href="#"
data-icon="check" data-theme="b">Save< /a>
< /div>
< form action="notes.html" method="post">
< textarea name="notes" rows="30" cols="10">< /textarea>
< /form>
< div data-role="footer" data-position="fixed">
< div data-role="navbar" >
< ul>
< li>< a href="index.html">Home< /a>< /li>
< li>< a href="map.html">Map< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html">List< /a>< /li>
< li>< a href="contacts.html">Contacts< /a> < /li>
< li>< a href="photos.html">Photos< /a>< /li>
< li>< a href="notify.html">Notify< /a>< /li>
< li>< a href="notes.html"
class="ui-btn-active">Notes< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/notes.js">< /script>
< /div>
< /body>
< /html>
Na dole mamy dołączony plik JavaScript nazwany notes.js. Tworzymy ten plik w katalogu assets/www/scripts
var fileWriter;
function onNotesLoad() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFSComplete, fail);
}
function onFSComplete(fileSystem) {
// Ładuje plik notes.txt , tworzy go jeśli nie istnieje
fileSystem.root.getFile("notes.txt", {create: true}, onFileEntryComplete, fail);
}
function onFileEntryComplete(fileEntry) {
// set up the fileWriter
fileEntry.createWriter(onFileWriterComplete, fail);
}
function onFileWriterComplete(fileWriter) {
// przechowuje fileWriter
// zmiennej globalnej więc mamy go
// kiedy użytkownik naciśnie save
fileWriter = fileWriter;
}
function saveNotes() {
// upewnij się ,że fileWriter jest ustawiony
if (fileWriter != null) {
// tworzenie funkcji zpaisu oncomplete
// która będzie przekierowywać użytkownika
fileWriter.onwrite = function(evt) {
alert("Saved successfully");
$.mobile.changePage("index.html");
};
var form = document.getElementsByTagName('form')[0].elements;
var notes = form.notes.value;
// zapisanie notatki
fileWriter.write(notes);
} else {
alert("There was an error trying to save the file");
}
return false;
}
function fail(error) {
alert(error.code);
}
Kiedy funkcja onNotes jest wykonywan przez wywołnie zwroten, tworzone jest asynchronicznę żądanie dla otwarcia stałego połączenia z systemem plików. Kiedy to działanie jest zakończone, funkcja onFSComplete jest wywoływana. Parametr fileSystem jest obiektem DirectoryEntry, która jest używana do otwarcia pliku nazwanego notes.txt w katalogu głównym. Jeśli plik nie jest już otwarty, zostanie utworzony. Po skutecznym załadowaniu pliku, wywoływana jest funkcja onFileENtryComplete. Funkcja ta odbiera parametr fileEntry , który jest obiektem FileEntry, Obiekt ten jest potem użyty di stworzenia obiektu klasy fileWrite. Obiekt jest przechowywany w zmiennej globalnej flieWrite tak więc funkcja saveNotes może zapisywać zawartość do niej . Kiedy akcja zapisu zostanie zakończona (po naciśnięciu przycisku Save), pojawi się komunikat, a użytkownik zostanie przekierowany do strony głównej. To działanie wystąpi wewnątrz anonimowej funkcji onwrite, która pojawia się wewnątrz funkcji saveNotes
19.Odczyt danych z urządzenia
Problem : Chcesz aby twoja aplikacja odczytywała istniejący plik i wyświetlała zawartość w formularzu dla dalszej edycji
Rozwiązanie : Używając obiektu FileEntry, pobieramy obiekt File , którym może być readAsDataURL lub readAsText, które zwracają dane jako kodowany base64 url lub jako tekst, odpowiednio
Opis : Dla odczytania pliku notes.txt, który stworzyliśmy powyżej i wypełnienia obszaru tekstowego jego zawartością, musimy dokonać kilku modyfikacji wewnątrz istniejącego pliku assets/www/scripts/notes.js:
var fileWriter;
function onNotesLoad() { window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onFSComplete, fail);
}
function onFSComplete(fileSystem) {
// Ładowanie pliku notes.txt , tworzymy go jeśli nie istnieje
fileSystem.root.getFile("notes.txt", {create: true}, onFileEntryComplete, fail);
}
function onFileEntryComplete(fileEntry) {
// odczyt pliku z wcześniej załadowaną zawartością
fileEntry.file(onFileReadComplete, fail);
// ustawienie fileWriter
fileEntry.createWriter(onFileWriterComplete, fail);
}
function onFileReadComplete(file) {
var reader = new FileReader();
reader.onloadend = function(evt) {
// załadowanie do formularza
var form = document.getElementsByTagName('form')[0].elements;
form.notes.value = evt.target.result;
};
reader.readAsText(file);
}
function onFileWriterComplete(fileWriter) {
// przechowanie fileWriter w
// zmiennej globalnej wię mamy ją
// kiedy użytkoniwj naciśnie save
fileWriter = fileWriter;
}
function saveNotes() {
// upewnij się ,że fileWriterjest ustawiony
if (fileWriter != null) {
// tworzymy funkcję zapisu oncomplete
// która będzie przekierowywać użytkownika
fileWriter.onwrite = function(evt) {
alert("Saved successfully");
$.mobile.changePage("index.html");
};
var form = document.getElementsByTagName('form')[0].elements;
var notes = form.notes.value;
// zapisanie notatki
fileWriter.write(notes);
} else {
alert("There was an error trying to save the file");
}
return false;
}
function fail(error) {
alert(error.code);
}
Ponieważ cała praca wykonana zostałą w poprzednim trki, tu mamy tylko dwa dodatki. Po pierwsze wewnątrz funkcji onFileEntryComplete, plik jest ładowany do obiektu File poprzez tą funkcję: fileENtry.file(onFileReadComplete, fail). Kiedy obiekt File jest załadowany, wywoływana jest funkcja obFileReadComplete. Funkjca onFileReadComplete tworzy nowy obiekt FileReader i odczytuje plik jako tekst. Anonimowa funkcja jest używana kiedy reader.onloadend zakończyła odczytywanie pliku. W tym miejscu, zawartość pliku jest ustawiona w polu formularza textarea nazwanego notes, pozwalając użytkownikowi na modyfikację istniejącej notatki
20.Rozszerzenie PhoneGap dodatkami
Problem : Chcesz dodać dodatkową funkcjonalność do swojej aplikacji dla określonego urządzenia, którego aktualnie biblioteka PhoneGap nie obsługuje
Rozwiązanie : Tworzymy wtyczkę, która jest dodawana do aplikacji i wywołujemy ją z JavaScript poprzez polecenie window.plugin
Opis : W tym przykładzie, rozszyrzymy bibliotekę PhoneGap przez stworzenie i użycie wtyczki Andorida z aplikacji. Celem tej wtyczki jest odczyt kanałów RSS i parsowanie XML do tablicy obiektów JSONObject, która będzie wyprowadzane w istniejącej aplikacji PhoneGap. Jak już wspominaliśmy, pracujemy w Windows w Eclipse, więc wtyczka będzie tylko dla Androida, ale implementacja wtyczki jest niezależna od platformy , ponieważ odbywa się przez JavaScript. Innymi słowy, jeśli będzie do pobrania wtyczka na iPhone′a, będzie implementowana w podobny sposób. Aby stworzyć wtyczkę, musimy stworzyć nowy Android Project. W Eclipse wybieramy File → New → Android Project. Nazwiemy ten projet XMLParser. Dla Build Target wybierz ostatnie Adnroid API. "Application name" będzie XMLParserPlugin. Stworzymy pakiet jako co.webistarte.phonegap.plugin.xmlparser. I w końcu odznaczamy Create Activity. Kiedy nowy projekt jest dodany, musimy również dodać bibliotekę PhoneGap do projektu. Podobnie jak podczas początkowej konfiguracji, może skopiować plik phonegap.jar do nowego katalogu libs i dodać go do Build Configuration. Teraz czas stworzyć jakiś kod Java (ponieważ teraz tworzymy natywne aplikacje Android). Klasą źródłową jest konieczna aby odpowiadać na wywołania z JavaScript. Dodamy do naszego projektu nową klasę XMLParserPlugin.java. Klasa ta będzie rozszerzała klasę Plugin, PhoneGap. Zawartość tej klasy:
package com.webistrate.phonegap.plugin.xmlparser;
import org.json.JSONArray;
import org.json.JSONException;
import android.util.Log;
import com.phonegap.api.Plugin;
import com.phonegap.api.PluginResult;
import com.phonegap.api.PluginResult.Status;
public class XmlParserPlugin extends Plugin { @Override
public PluginResult execute(String action,
JSONArray data, String callbackId) {
try {
String feedUrl = data.getString(0);
extractXMLContent(feedUrl, callbackId);
} catch (JSONException e) {
return new PluginResult(Status.ERROR,
"Error parsing URL");
}
PluginResult r = new PluginResult(
PluginResult.Status.NO_RESULT);
r.setKeepCallback(true);
return r;
}
public void extractXMLContent(String feedUrl,
String callbackId) {
AndroidSaxFeedParser parser = new
AndroidSaxFeedParser(feedUrl);
JSONArray messages = parser.parse();
if (messages.length() > 0) {
Log.d("parse",
"Sending ok result, with messages");
PluginResult r = new PluginResult(
Status.OK, messages);
r.setKeepCallback(true);
success(r, callbackId);
} else {
Log.e("parse",
"No results found, sending error message");
PluginResult r = new PluginResult(
Status.ERROR, "No results");
r.setKeepCallback(true);
error(r, callbackId);
}
}
}
Nie będziemy się sczegółowo zajmować Javą ,ponieważ skupimy się na tym co potrzebne do stworzenia wtyczki. Powyższy przykład zawiera kilka ważnych poleceń dostarczających dostępu do PhoneGap Plug-in API. Ponieważ klasa Plugin została rozszerzona, wykonywana funkcja musi być przesłonięta. Działa to jak funkcja docelowa kiedy wtyczka jest wywoływana przez JavaScript. Typ zwracany wywoływanej funkcji jest obiektem PluginResult. Ponieważ parsowanie XML będzie wykonywana asynchronicznie, nie można przekazać wstecz statusu powodzenia. Zamiast tego, extractXMLContent jest wywoływana, która po zakończeniu będzie zwracała sukces lub błąd komunikatu. Aby uniknąć blokowania wykonania getworzony jest nowy parser SAX przy użyciu feeedUrl, któr został w niej przekazany. Aby stworzyć parser SAX, wykorzystamy przykłada ze strony IBM.W oryginalnym przykładowym kodzie, zwracana jest klasa Message. Ponieważ Pluginresult może być tylko String, JSONArrat lub JSONObject, zaktualaizujemy kod dla zwrócenia obiektów JSONArray lub JSONObject. Pownie, zatuszujemy kod Javy aby skupić się na samej wtyczce. Kiedy parsowanie zostało zakończone, jeśli JSONArray nie zawiera elementów, status błędu zostanie wysłany ponownie do JavaScript; w przeciwnym razie, komunikat powodzenia wraz z komunikatem wynikowym . Na tym kończy się tworzenie wtyczki. Jeśli planujesz wydanie swojej wtyczki, musisz skompilować go pliku jar. Możez to być wykonane przez narzędzie jar. W przeciwnym razie możesz po prostu skopiować pakiet do istniejącego folderu src projektu PhoneGap. Jeśli wybierzesz wtyczkę jar, będziesz musiał dodać ją do folderu libs i zaktualizować Build Configuration dla dołączenia jej w ten sam sposób jak pierwszy raz dołączaliśmy plik phonegap.jar. Następnie wtyczka musi być dołączona wewnątrz pliku plugins.xml ulokowanego w katalofu res/xml. Poniższ linia powinna być dodana wewnątrz zamykającego znacznika plugins
< plugin name="XMLParserPlugin" value="com.webistrate.
phonegap.plugin.xmlparser.XmlParserPlugin" / >
Należy zaktualizować ścieżkę dostępu do pakietu wymaganego dla wtyczki. Następnie musimy stworzyć nowy plik JavaScript,. Jeśli planujesz oferowanie swojej wtyczki, ten plik JavaScript powinien być dołączany wraz z plikiem jar aby inni mogli jej używać. Wewnątrz folderu scripts, tworzymy nowy plik XMLParser.js
var XMLParser = function() {};
XMLParser.prototype.parse = function(successCallback,
failureCallback, feedUrl) {
return PhoneGap.exec(successCallback,
failureCallback, 'XMLParserPlugin', '',
[feedUrl]);
};
PhoneGap.addConstructor(function() {
PhoneGap.addPlugin("xmlParser", new XMLParser());
});
Ten kod JavaScript tworzy nową klasę XMLParser, która jest dodawana jako wtyczka przez polecenie PhoneGap.addPlugin. Nowa funkcja nzwana parse, mówi PhponeGap aby wykonała XMLParserPlugin poprzez wywołanie PhoneGap.exec. URL określony przez funkcję wywołującą dla kanału, feedUrl, jest przekazywany w niej jako parametr. Wtyczka jest teraz gotowa do działania. Dla zademostrowania pracy, stworzymy nowy plik plugin.html, wewnątrz katalogu assets/www
< !DOCTYPE HTML>
< html>
< head>
< title>PhoneGap< /title>
< /head>
< body>
< div data-role="page" id="plugin-page">
< div data-role="header" data-position="inline">
< h1>Webistrate Articles< /h1>
< /div>
< ul id="xmlList" data-role="listview">
< /ul>
< div data-role="footer" data-position="fixed">
< div data-role="navbar">
< ul>
< li>< a href="index.html">Home< /a>< /li>
< li>< a href="map.html">Map< /a>< /li>
< li>< a href="compass.html">Compass< /a>< /li>
< li>< a href="list.html">List< /a>< /li>
< li>< a href="contacts.html">Contacts< /a>< /li>
< li>< a href="photos.html">Photos< /a>< /li>
< li>< a href="notify.html">Notify< /a>< /li>
< li>< a href="notes.html">Notes< /a>< /li>
< li>< a href="plugin.html"
class="ui-btn-active">Plugin< /a>< /li>
< /ul>
< /div>
< /div>
< script type="text/javascript" charset="utf-8"
src="scripts/XMLParser.js">< /script>
< script type="text/javascript" charset="utf-8"
src="scripts/plugin.js">< /script>
< /div>
< /body>
< /html>
Ten HTML inicjalizuje pustą listview, która będzie wypełniana wynikami kanału RSS. Na dole pliku ,dołączony jest poprzednio utworzony plik XM:LParser.js, jak również nowy plik plugin.js. Końcowym krokiem jest stworzenie nowego pliku plugin.js wewnątrz katalogu assets/www/scripts.
function onPluginLoad() {
window.plugins.xmlParser.parse(parseSuccess,
parseFail, "http://feeds.feedburner.com/Webistrate");
}
function parseSuccess(result) {
for (var i = 0; i < result.length; i++) {
$("#xmlList").append("< li>< a href=\"" +
result[i].link + " \">" + result[i].title + "< /a>< /li>");
}
$("#xmlList").listview('refresh');
}
function parseFail(error) {
alert('fail = ' + error);
}
Nasza wtyczka jest wywoływana poprzez funkcję window.plugins.xmlParser.parse. Akceptuje trzy parametry : wywołanie zwrotne związane z powodzeniem, z niepowodzeniem i URL kanłu RSS do parsowania. Kiedy parsowanie zostanie ukończone, funkcja parseSuccess jest wywoływana z jego wynikiem. Funkcja ta po prostu przechodzi pętla po wynikach i dołącza nowy znacznik li zawierający tytuł artykułu z kanału RSS jak również link do niego.

iOS 7


iOS 7 pokazuje nowy, rewolucyjny design, pod maską funkcje takie jak Centrum Sterowania i wielozadaniowość opartą o karty i aktualizację aplikacji. Na konferencji Worldwide Developers Conference, prezes Apple , Tim Cook nazwał go najbardziej znaczącą zmianą swojego mobilnego systemu operacyjnego, od kiedy firma weszła w biznes smartfonowy w 2007 roku. Rzeczywiście, jest to dramatyczne , ponowne odkrycie mobilnego oprogramowania, które wychodzi poza zwykłe dodatki i rozszerzenia. Apple wyremontował bardzo wygląd systemu operacyjnego. Coś takiego jak iOS 7 będzie budzić pytania. Na szczęście, mamy odpowiedzi. Chociaż jest wiele do nauczenia o tym systemie, omówimy jego podstawy.
Jak jest największa zmiana w iOS 7?
Od czego zacząć? Cały wygląd systemu został przebudowany z płaskimi ikonami, mniejszym skeumorphizmem i cieńszym krojem pisma. Każdy kto używał iOS będzie prawdopodobnie "w domu": Apple nie zmienił zbytnio ekranu głównego, a podstawowe gesty i interakcje są zasadniczo takie same, z kilkoma wyjątkami
Jak stary design różni się od starego?
Jak czułeś się z zielonym filcem? Drewnianymi regałami? Skórzanymi poszyciami? Mamy nadzieję, że odpowiedź brzmi "nie super", ponieważ są już one w iOS 7. Rzeczywiście, zostały one zastąpione nowym projektem filtra, który jest w dużej mierze o prostych liniach i ikonach. Podczas gdy istnieją elementy przypominające projekt Microsoftu , Windows Phone. iOS 7 ma swój odrębny styl. Nie są to tylko subtelne udoskonalenia; przenikają one każdy kawałek interfejsu. System operacyjny postępuje z projektem zgodnie z twoją zawartości, barwiąc kontrolki i panele w oparciu o kolory zdjęć za nimi. Sir Jony Ive mówił o warstwie interfejsu , z panelami takimi jak Centrum Powiadomień i Centrum Sterowania wizualnie rezydującymi "na górze" aplikacji i ekranu głównego iOS.
Czy musimy się uczyć na nowo jak korzystać z iPhone′a?
Nie koniecznie, uruchomienie i korzystanie z aplikacji jest w dużej mierze takie samo , choć będzie kilka rzeczy nowych do nauczenia. Na przykład, możesz teraz przesuwać od dołu ekranu aby przywołać Centrum Sterowania (poręczny panel , dający dostęp do wielu najczęściej używanych funkcji systemowych). Jest jeszcze jeden nowy gest, przesuń od lewego brzegu, który oznacza "przejdź na wyższy poziom" kiedy jesteś w programie Mail
Które urządzenia Apple′a będą obsługiwały iOS 7?
Jeśli szukasz aktualizacji do iOS 7 , musisz mieć jedno z tych urządzeń L iPhone 4 lub nowszy, iPad 2 lub nowszy, iPad mini lub iPod piątej generacji. Specyficzne funkcje mają bardziej rygorystyczne wymagania sprzętowe :
• Rozszerzenia zdjęć panoramicznych są dostępne tylko na iPhone′ie 4S lub nowszym i iPodzie touch piątej generacji
• Nie możesz pstrykać kwadratowych zdjęć lub wideo używając iPada 2; pozostałe urządzenia mogą korzystać z tej funkcji
• Dla ładnych, nowych filtrów aparatu, musisz mieć iPhone 5 lub iPod piątej generacji. Wstawianie filtrów po fakcie, w aplikacji Zdjęcia jest opcją dla iPhone′a 4 lub nowszych, iPada trzeciej generacji lub nowszych, iPada mini i iPoda touch piątej generacji
• Dla AirDrop dla zdjęć lub innych plików twoich przyjaciół potrzebujesz iPhone′a 5 lub nowszego, czwartej generacji iPada lub nowszego, iPada mini lub iPoda touch piątej generacji. Potrzebujesz również konta iCloud
• Siri ograniczony jest do tych którzy korzystają z iPhone′a 4S lub nowszego, trzeciej generacji iPada lub nowszego, iPada mini i piątej generacji iPoda touch
Co to jest Centrum Sterowania
Jeśli kiedykolwiek narzekałeś podczas nawigowania trzy poziomy w głąb Ustawień aby wyłączyć Bluetooth, pokochasz Centrum Sterowania. Ten nowy panel, który możesz otworzyć w dowolnym miejscu w systemie iOS przez przeciągnięcie od dołu ekranu, uzyskasz łatwy dostęp do często używanych ustawień, w tym Wi-Fi i Airplay. Istnieją również kontrolki odtwarzania multimediów i ikony na dole, pozwalające ci uruchamiać często używane aplikacje i narzędzia : możesz włączyć lampę błyskową aparatu w iPhone′ie aby używać jej jako latarki, lub otworzyć aplikacje Zegar czy Aparat, ale nie należy go mylić z Centrum Powiadamiania
Centrum Powiadamiania
Zostało ono całkowicie zmienione. Kiedy przywołasz je przez przeciągnięcie z góry ekranu, Centrum Powiadamiania ma półprzezroczysty wygląd, tak samo jak reszta systemu operacyjnego i oferuje pewne różne informacje. Oprócz przechowywania powiadomień, jak miało to miejsce w poprzedniej wersji iOS, oferuje zakładkę gdzie możesz podglądać nieodebrane powiadomienia, jak również podgląd Dzisiaj. Ten ostatni działa trochę jak funkcja Google Now, dostarczając informacje o tym co masz zrobić dzisiaj, w tym aktualną prognozę pogody, terminy z kalendarza, notowania giełdowe.
Wielozadaniowość
Nadal możesz przełączać aplikacje przez podwójne kliknięcie przycisku Home, ale interfejs się zmienił : teraz przypomina stary interfejs dla przełączania stron w Safari na iOS 6 i wcześniej, gdzie widziałeś miniaturkę strony. Wiersz ikon aplikacji pojawia się poniżej, i możesz przełączyć z powrotem aby znaleźć aplikację jakiej szukasz. Wymuszenie zamykania programów jest trochę inne, ale zamiast dotknięcia i przytrzymania ikony, możesz pstryknąć miniaturę dla jej zwolnienia. Są też inne, bardziej znaczące różnice. W iOS 4 i późniejszych, tylko pewne zadania mogły być uruchomione w tle (aby zaoszczędzić baterię). W iOS 7, można uzyskać pełną wielozadaniowość. Tak więc każda aplikacja może działać w tle.
Żywotność baterii
Apple spędził wiele czasu upewniając się ,że żywotność baterii nie będzie cierpieć z powodu nowej wielozadaniowości. Próbował zebrać aktualizacje z różnych aplikacji i uruchamiać je wszystkie w tym samym czasie, pilnując efektywności energetycznej i bieżącej sytuacji sieciowej aby upewnić się ,że nie działa na zasilaniu bateryjnym
Aparat
Podobnie jak reszta iOS 7, Aparat otrzymał znaczące udoskonalenie. Oferuje on cztery różne tryby : aparat standardowy, kamera wideo, aparat zdjęć kwadratowych i panorama; możesz przełączać się między nimi. Jeśli uważasz ,że aparat kwadratowy to sposób Apple na tworzenie zdjęć do Instagram, gratulacje. Aplikacja również może obejmować różne żywe filtry zdjęć, które możesz stosować do swoich zdjęć.
Moments i Collections
Dla tych którzy mają tysiące zdjęć, Moments i Collections są najlepszym sposobem organizowania tych zdjęć. Zdjęcia na iOS mogą korzystać z metadanych, jak czas i miejsce stworzenia różnych "Momnetów" - wszystkie zdjęcia z czwartku, na przykład, czy zdjęcia z weekendowego wypadu z przyjaciółmi. Kolekcje są większymi grupami Momentów .
AirDrop AirDrop w iOS 7 pozwala ci wymieniać się plikami, podobnie jak zdjęciami, Passbook pozwala na kontaktowanie się dwóm użytkownikom iOS 7 poprzez Wi-Fi lub Bluetooth, bez konieczności ich fizycznego połączenia

Przewodnik po Google Android


Ruchy Google odnośnie telefonii komórkowej zaczęły się w 2005 roku, kiedy to gigant wyszukiwania sieciowego przejął małą firmę , Android Inc. Pojawiły się pogłoski ,że Google planuje rozwijać własnego konkurenta dla iPhone′a Apple. Jak się okazało, nie chodziło tylko o jeden telefon - a Google nie był jedyną firmą pracującą nad takim projektem W listopadzie 2007 roku, Open Handes Alliance, konsorcjum 47 firm produkujących sprzęt, oprogramowanie i telekomy, ujawniło android, markę nowej mobilnej platformy opartej na systemie operacyjnym open-source - Linux. Ponieważ Android jest open-source, platforma ma wiele zalet dla konsumentów i projektantów. Twórcy smartfonów i innych urządzeń przenośnych mają więcej swobody przy dopasowywaniu oprogramowania do swoich potrzeb, otwierając szeroki zakres opcji. Kilku producentów stworzyło własny interfejs użytkownika, uruchamiający się w systemie operacyjnym Android, zmieniając jego estetykę i funkcjonalności. Android pozwala również na tworzenie własnych widgetów. Dobrze znanym przykładem jest interfejs Sense HTC. Oprócz innych innowacji , posiada widżet Friends Stream, który agreguje i wyświetla aktywności z różnych sieci społecznościowych. Podobnie MotoBlur Motoroli, posiada widżet nazwany Happenings, który wyświetla aktywności sieci społecznościowej bezpośrednio na ekranie domowym Androida. Inną zaletą open-source jest to ,że Android nie jest związany z żadnego rodzaju jednym urządzeniem, czy to telefonem komórkowym, netbookiem czy tabletem. Sprzętowe iteracje dla telefonów z systemem Android, w międzycasie różniły się. Pierwsze modele , takie jak HTC G1, zostały prawie wszystkie wyposażone w czysto dotykowy ekran, wyposażone w słuchawki i doskonale prosty interfejs. Ekrany miały ograniczoną rozdzielczość i nie były szczególnie wrażliwe. Ale zainteresowanie Androidem rosło, powstawał coraz lepszy sprzęt i nowe projekty. Kolejnym znaczącym wydaniem, Motorola Droid, było z bardziej pojemnościowym ekranem dotykowym, modelem z wysuwaną klawiaturą QWERTY, szybszym procesorem i modułem GPS. W 2010 roku dużym hitem był HTC Desire, pierwsze główne urządzenie z Android , z jego cienkim designem i niewiarygodnie jasnym wyświetlaczem superAMOLED.
Wersje systemu Android
1.5 (Cupcake) :
-możliwość nagrywania i odtwarzania filmów w trybie aparatu
-przesyłanie filmów do serwisu YouTube i zdjęć do serwisu Picasa bezpośrednio z telefonu
-nowa klawiatura ekranowa z funkcją przewidywania wpisywanych słów
-obsługa profili Bluetooth A2DP i AVRCP
-możliwość automatycznego łączenia z zestawem słuchawkowym Bluetooth, gdy ten znajdzie się w zasięgu telefonu
-nowe widżety i foldery
-animowane przejścia między pulpitami
1.6 (Donut) :
-poprawione działanie Android Market
-wspólny interfejs aparatu, kamery i galerii filmów/zdjęć
-galeria umożliwia zaznaczenie kilku zdjęć do usunięcia
-aktualizacja funkcji Voice Search
-poprawiona funkcja wyszukiwania: dodano możliwość przeszukiwania zakładek, historii, kontaktów i sieci bezpośrednio z pulpitu telefonu
-poprawiono obsługę CDMA/EVDO, IEEE 802.1X, VPN i system rozpoznawania mowy
-obsługa rozdzielczości WVGA oraz QVGA
-poprawiono szybkość działania aparatu fotograficznego i funkcji wyszukiwania
-narzędzia Gesture framework i GestureBuilder
-darmowe oprogramowanie nawigacyjne Google
2.0/2.1 (Eclair):
-obsługa wielu kont email
-podpięcie wielu kont email do jednej aplikacji
-wyszukiwanie wiadomości SMS i MMS
-automatyczne usuwanie starych wiadomości (użytkownik określa, od którego momentu wiadomości będą kasowane)
-do aparatu dodano obsługę lampy błyskowej, cyfrowy zoom, możliwość zmiany balansu bieli i tryb makro
-obsługa multitouch w klawiaturze i poprawiony słownik
-wsparcie dla HTML5 w przeglądarce
-geolokalizacja
-obsługa Bluetooth 2.1
-poprawione sprzętowe wsparcie dla wyświetlanej grafiki
-interaktywne tapety wyświetlające animacje
-dodatkowe 2 pulpity
-nowa lista aplikacji z efektami 3D i czarnym tłem
-rozpoznawanie głosu dla wszystkich pól tekstowych
-widgety z pogodą i informacjami
-zmieniony interfejs galerii, uproszczona edycja zdjęć
2.2 (Froyo) :
-wsparcie dla Flash 10.1 Mobile
-poprawienie wydajności (nowy silnik V8 i JIT)
-lepsza współpraca z Bluetooth
-nowe biblioteki
-możliwość instalacji aplikacji na karcie pamięci
-płynniejszy podgląd kamer/aparatu
-aplikacje mogą same robić backup swoich danych
-tethering WiFi
-poprawienie interfejsu galerii
-lepsza kontrola zoomu w aparacie
2.3 (Gingerbread) :
-uproszczono i zmieniono interfejs
-zwiększono szybkość i energooszczędność
-poprawiono zaznaczanie tekstu i funkcję kopiuj/wklej
-zmiany wyglądu
-wprowadzono obsługę rozmów wideo przez przednią kamerkę
-poprawiono funkcję kontrolowania stanu baterii
-możliwość wykonywania połączeń SIP
-nowy menadżer pobierania plików w przeglądarce
-uaktualnione API
-wideorozmowy za pomocą Google Talk
-poprawiona wydajność sieci w Nexus S 4G
-wsparcie usługi Google Wallet dla Nexus S 4G
3.0 (Honeycomb) :
-optymalizacja dla tabletów i procesorów NVidia Tegra
-aplikacje Google zoptymalizowano pod duże rozdzielczości
-nowe widgety
-lepsze wykorzystanie większej rozdzielczości ekranu
-przyciski wstecz/home/menu znajdują się na ekranie
-przycisk "Apps" jest teraz w górnym rogu ekranu
-akceleracja grafiki 2D
-obsługa urządzeń podłączanych do gniazda USB
-udoskonalony mechanizm zarządzania widżetami
-poprawiony multitasking
-praca na 7″ urządzeniach
-wsparcie dla chipsetów Qualcomm
-ulepszone widżety
-aktualizacje oprogramowania tj. Movie Studio, Movies, czy Music
4.0 (Ice Cream Sandwich) :
-obsługa procesorów dwurdzeniowych i rozdzielczości 720p w telefonach
-optymalizacja dla procesorów TI OMAP
-interfejs Holo (z nową czcionką Roboto), możliwość zastąpienia przycisków obsługi gestami
-nowy menedżer zadań
-edytor zdjęć
-Google+ 2.0
-Google Music 2.0
-Android Beam
-Obsługa sprzętowej akceleracji interfejsu
-poprawa stabilności
-przyśpieszenie działania kamery
-płynniejsza animacja rotacji ekranu
(Zapowiadana) 5.0 (Jelly Bean) :
-optymalizacja z ekranami HD i Full HD
-optymalizacja wydajności w grach
-opcjonalny dual boot z Google Chrome OS
-asystent głosowy Google Assistant

Poznajemy Androida
Android może zrobić dla ciebie wiele, ale jak z każdym systemem operacyjnym trzeba wiedzieć od czego zacząć. I to nie tylko z powodu przyszłych funkcji . W porównaniu do interfejsu iPhone′a, Android daje ci wiele miejsca. Oto szybkie podsumowanie, z jakimś powinieeneś się zapoznać
Pulpit
Pierwsze co rzuca się w oczy w Androidzie, to to ,że jego pulpit różni się od tych z innych platform. Masz wiele swobody w kształtowaniu swojego własnego interfejsu, i nie jesteś ograniczony do czterech prostych wierszy dokładnie przylegających kwadratowych ikon. Zamiast tego, możesz ustawić pulpit tak, aby odzwierciedlał twoje zainteresowania, i możesz uczynić go bogatym i dynamicznym jak chcesz. Pulpit Androida jest złożony z wielu paneli ekranów domowych. W zależności od wersji Androida jakiego używa twoje urządzenie i czy był dostarczony z właściwą "skórką", możesz mieć od trzech do siedmiu paneli. Kiedy włączasz telefon po raz pierwszy, zobaczysz główny panel domowy. Zazwyczaj jest wyśrodkowany, więc możesz mieć dostęp do dodatkowych paneli po obu stronach głównego, przesuwając palcem po ekranie z lewo lub w prawo. Od Androida 2.1, możesz również zobaczyć miniatury ikon wszystkich paneli na dole ekranu; aby przejść bezpośrednio do panelu bez przesuwania, po prostu stuknąć na powiązanej ikonie. To co się dzieje na każdym z tych paneli zależy od ciebie. Możesz wypełnić przestrzeń dowolną kombinacją skrótów, widżetów i folderów. Jak można się spodziewać, skróty są małymi ikonami, które pozwalają ci ładować aplikacje lub inne funkcje do telefonu; pracują one tak jak te widziane w Windowsie .Możesz ustawić skrót do zrobienia czegoś z otwartego programu lub połączyć się z określoną stroną sieciową inicjując połączenie telefoniczne. Aby dodać skrót , po prostu naciśnij i przytrzymaj palcem na otwartej przestrzeni na ekranie domowym, i wybierz Skróty z menu pop-up. Stąd wybierz to co chciałbyś dodać na pulpit. Widżety są dynamicznymi programami, które działają bezpośrednio na ekranie domowym. Widżet może pokazać ,np. pogodę, lub pomóc odtworzyć muzykę z pamięci urządzenia lub z internetu. Nieograniczone opcje są dostępne z Marketu Androida. Aby dodać widżet, naciśnij i przytrzymaj na otwartej przestrzeni, jak powyżej, ale tym razem wybierz opcję Widżety z menu. Nawet jeśli nie ściągałeś niczego z Marketu, powinieneś mieć przydatne opcje wbudowane w urządzenie.
Organizacja ikon
Foldery są dobrym sposobem na utrzymanie zawartości zorganizowanej jednocześnie rozszerzając przestrzeń ekranu domowego. Foldery pozwalają ci pogrupować wiele skrótów w pojedynczym gnieździe. Kiedy stukniesz na folderze, pojawi się pole pokazujące wszystkie ikony skrótów wewnątrz tego folderu. Możesz wypełnić folder skrótem dotykowego połączenia do wszystkich ulubionych kontaktów . Foldery pomagają dodać wiele użytecznych rzeczy do ekranu domowego bez zjadania wiele miejsca. Aby dodać folder, naciśnij i przytrzymaj palcem na pustej przestrzeni. Wybierz Foldery, a potem Nowy Folder. Potem przeciągnij i upuść tyle skrótów do folderu ile sobie życzysz. Aby nadać własną nazwę, stuknij ponownie folder raz dla jego otwarcia, potem przesuń palec wzdłuż górnego paska dopóki nie pojawi się na ekranie okno dialogowe folderu Zmień nazwę .Aby przenieść skrót,widżet lub folder, po prostu dotknij i przytrzymaj palec na nim. Po paru sekundach , wydaje się podnosić z ekranu. Możesz potem przeciągnąć go gdziekolwiek, włączając w to inny panel. Przy jego przeciągania zobaczysz również symbol kosza .wyśrodkowany na dole ekranu; przeciągnij ikonę w dół do symbolu kosza aby usunąć do z ekranu.
Telefony z Androidem mają cztery standardowe klawisze: przycisk Powrotu, przycisk Menu, przycisk Home i przycisk wyszukiwania. Pomagają ci nawigować po telefonie dużo łatwiej, bez względu czy program czy proces uruchomiłeś. Naciśnięcie klawisza Wstecz przenosi Cię z powrotem o jeden krok do tego, co robiłeś przed rozpoczęciem bieżącego kroku. To działa w wielu różnych kontekstach: web nawigacji, e-mail nawigacji lub klawisza nawigacyjnego w programie uprzednio otwartego. Naciskając klawisz Menu, pojawi się lista opcji odnoszących się do obszaru telefonu jakiego aktualnie używasz. Gdy naciśniesz go na ekranie głównym, to pozwala na dostęp do ustawień telefonu i inne opcje dostosowywania Klawisz Home ma dwie funkcje. Jeśli naciśniesz go raz, to zabierze cię z powrotem do ekranu głównego. Jeśli naciśniesz i przytrzymasz go, pozwala na wielozadaniowość i przełącza się na inne programy ostatnio używanych. Naciśnięcie klawisza Szukaj tworzy różne wyniki w zależności od tego, gdzie jesteś w Androidzie w tym czasie. Z ekranu głównego, pojawia się okno szybkiego wyszukiwania, którego można użyć do wyszukiwarki internetowej jak i telefonu w tym samym czasie (Android zwróci najtrafniejsze wyniki podczas pisania) Z poziomu aplikacji, klawisz Szukaj zazwyczaj rozpoczyna wyszukiwanie specyficzne dla tej aplikacji, co pozwala wyszukiwać w e-mailu, na przykład
Uruchamianie aplikacji
Możesz zawsze znaleźć wszystkie aplikacje na ekranie uruchamiania aplikacji .Na telefonach z systemem Android 2.0.1 lub starszym, ekran uruchamiania aplikacji otwierał się przez dotknięcie szarej karty na środku dolnej części ekranu głównego. Począwszy od Android 2.1, nowe kwadratowe ikony wyparły szarą kartę. Ekran uruchamiania aplikacji ma nieco inny wygląd począwszy od 2.1. Na tym ekranie możesz dotknąć ikonę dowolnej aplikacji aby uruchomić program, lub nacisnąć i przytrzymać aby przeciągnąć bezpośrednio jako skrót na ekran główny.
Dopasowanie twojego Androida Jednym z największych atutów Androida jest jego elastyczność. Możesz zmienić prawie każdy aspekt interfejsu, od tapety pulpitu do migającej diody lampki kontrolnej. Oto jak nadać systemowi własny styl.
Wygląd i działanie.
Pierwszą rzeczą, jaką możesz spersonalizować jest tło tapety. To nie może być prostsze: wybierz klawisz Menu, a następnie wybierz Tapeta. Możesz wybrać zdjęcie spośród własnych zdjęć lub z kolekcji dostarczonych przez środowisko. Począwszy od systemu Android 2.1, można także wybrać jedną z kilku "tapet na żywo", które poruszają się, a nawet reagują na dotyk. Innym sposobem, aby ustawić swoją tapetę jest ustawienie bezpośrednio z galerii. Z wybranym obrazem, wystarczy dotknąć dowolnego miejsca na ekranie i wybrać Ustaw jako. Będziesz mieć opcję, aby ustawić obecny obraz jako tapetę. Aby rozszerzyć swoje możliwości. spróbuj uing app takich jak środowisk, do bezpłatnego pobrania z Androit Rynku. Ten program daje tysięcy wzorów tapet do wyboru i stosuje się bezpośrednio na pulpicie systemu Android. Jak widać, tapeta jest tylko początkiem : z Androidem możesz ustawić ekrany główne taj jak chcesz. Innymi elementami do zabawy są widżety. Są w najróżniejszych kształtach i rozmiarach, kilka jest wstępnie załadowany, i wiele innych są dostępne albo jako do samodzielnego pobierania lub jako część pełnoprawnych aplikacje w Android Market. Kiedy widzisz ,że aplikacja odnosi się do "widżetu 1x1 widget", oznacza to ,że element zajmie przestrzeń jednego skrót wielkości kwadratu na ekranie głównym, widżet 2x1 to dwa kwadraty wszerz i jeden w górę, i tak dalej. Podczas gdy niektóre zajmują całe wiersze, wiele przydatnych widżetów zajmować tylko jeden lub dwa kwadraty, przyczyniając się do oszczędzania miejsca na ekranie. Aby rozpocząć, sprawdź darmową aplikację Weather Channel, który obejmuje ładny widżet 1x1, który wykrywa lokalizację i zapoznaje cię na bieżąco z najnowszymi warunkami atmosferycznymi. Pamiętaj ,że kady ekran domowy może przechowywać dowolną kombinację widżetów, skrótów i folderów
Ustawienie własnych dźwięków
Nie korci cię aby ustawić w telefonie dzwonek jaki chcesz. Naciśnij klawisz Menu i wybierz Ustawienia. Stamtąd ,naciśnij Dźwięk i wyświetl. Wszystko teraz powinieneś mieć przed sobą, w tym opcję ustawień domyślnych, dźwięk powiadomienia i ogólny poziom głośności. Zauważyłeś ,że twoje własne MP3 nie pojawiły się na liście wyboru dzwonków. To dlatego ,że telefon jeszcze ich nie widzi w dźwiękach systemowych. Na szczęście nie jest to trudne do naprawienia: robisz nowy folder na karcie pamięci o nazwie "dzwonki" i kopiujesz do niego MP3, a one automatycznie pojawią się na liście wyboru. Chciałbyś ustawić własne pliki MP3 jako dźwięk powiadomienia lub alarm? Powtórz proces opisany powyżej ,nazwij odpowiednio foldery "powiadomienia" lub "alarmy". Jeśli chciałbyś używać tylko części utworu - pobierz aplikację RingDroid z Android Market, która pozwala na łatwą edycję MP3, i dzięki której może uzyskać dokładnie taką długość jaką sobie życzysz.
Zabawy światłem
Większość urządzeń z Androidem wyosażonych jest w diod LED. Domyślnie migają w różnych kolorach aby poinformować do utraconym połączeniu, nowym e-mailu lub nowej wiadomości tekstowej. Ale można zrobić znacznie więcej.Darmowa apliakcja Missed Call, poszerza funkcjonalność urządzeń z diodami LED, przez stworzenie migającego światła w różnych kolorach kiedy wystąpi określone wydarzenie. Możesz zaprogramować kolor pomarańczowy kiedy dzwonił szef lub różowy, kiedy dzwoniła twoja sympatia. Możesz również ustawić kolory LED powiadamiające o różnych pozycjach z kalendarza.
Android przy pracy
Personalizacja to nie jedyne co potrafi Android, może również ułatwić ci życie. Masz naprzykrzającą się rodzinę lub współpracowników .Przekieruj ich bezpośrednio do poczty głosowej a nigdy więcej nie będą przeszkadzać. Upewnij się ,że wprowadziłeś ich na listę kontaktów, otwórz ich profil i naciśnij klawisz Menu. Wybierz Opcje, wybierz pole wyboru Dla Wyślij rozmowę bezpośrednio do poczty głosowej. Możesz kontrolować bardzie obsługę połączeń i innych zadań przez zainstalowanie aplikacji FoxyRing. Ta aplikacja pozwala ustawić niestandardowy parametr oparty na lokalizacji. Możesz mieć wyciszony telefon, kiedy jesteś w kinie , lub ustawiony na wibrację ,kiedy jesteś w biurze. FoxyRing pozwala również ustawić "godziny spania" w których telefon nie będzie dzwonił wcale.
Styl nawigacji
W zależności od urządzenia, używanie klawiszy skrótów do nawigacji w systemie operacyjnym może zaoszczędzić ci czasu. Android ma wbudowany zbiór skrótów klawiszowych, ale możesz również tworzyć swoje własne. Na ekranie głównym naciśnij klawisz Menu i wybierz Ustawienia. Następnie wybierz Aplikacje a potem Szybkie Uruchamianie aby ustawić klawisze skrótu dla dowolnej aplikacji. Przy nawigacji internetowej nie musisz utknąć na domyślne przeglądarce Android. Wypróbuj Dolphin Browser z opcjami takim jak wielodotykowe powiększanie, sterowanie gestami czy bezproblemowe udostępnianie łącza do sieci społecznościowej. Co do nawigacji po plikach możesz wykorzystać menadżera plików, takiego jak Astro. Pozwala przeglądać katalogi w telefonie i na karcie pamięci i przenosić je do woli
Autouzupełnianie
Ostatnie ale nie mniej ważne, słowo o technologii autouzupełniania Androida. Można zrobić wiele więcej niż sugerują słowa jakie wpisujesz do pola Szukaj. Może pomóc przy wypełnianiu zwrotów i rzeczowników jakich używasz najczęściej kiedy wpisujesz tekst .Sekretem jest edycja niestandardowego słownika Androida. Naciśnij klawisz Menu z ekranu głównego i przejdź do Ustawienia, Język i klawiatura, potem wybierz Słownik użytkownika. Wypróbuj swoje imię, adres ulicy lub jakąkolwiek frazę często wpisywaną: od teraz te terminy będą pojawiać się na liście autouzupełniania po rozpoczęciu wpisywania
Email i kontakty
Android oferuje opcje zarówno dla kont Gmail jak i nie Gmail. Po pierwszym włączeniu urządzenia z Androidem, początkowy proces konfiguracji pomoże ci skonfigurować konto Gmail, które automatycznie będzie się pojawiać w zintegrowanej aplikacji Gmail, i zawsze zobaczysz maila jaki pojawi się natychmiast po jego nadejściu .W Android 2.0lub wyższym, możeszdodawać inne zsynchronizowane konta Gmail.. W aplikacji Gmail, naciśnij klawisz Menu, a następnie wybierz Konta. Dotknij przycisk Dodaj konto na dole, a następnie postępuj zgodnie z instrukcjami. Kiedy proces się zakończy, możesz przechodzić między swoimi kontami Gmail przez naciśnięcie klawisza Menu w aplikacji i wybierając Konta. Aby dostosować sposób w jaki Android powiadamia o przychodzących wiadomościach , wystarczy dotknąć klawisza Menu podczas przeglądania dowolnego konta w skrzynce odbiorczej i wybierz Ustawienia. Jeśli nie chcesz być powiadamiany o nowych wiadomościach w ogóle, odznacz pole Powiadamianie o email. Jeśli chcesz odbierać tylko powiadomienia wizualne - alert w panelu powiadamiania i migająca dioda LED - ustaw dzwonek na cicho i odznacz pole Wibracja .Możesz mieć indywidualne ustawienia dla każdego konta Gmail : po prostu powtórz kroki od jakiegokolwiek konta w skrzynce odbiorczej, a zmiany będą zastosowane wyłącznie dla tego adresu. Każda wiadomość jaką zobaczysz w Gmail pojawi się też w Androidzie. Towje wysłane, usunięte a nawet wiadomości spam są również synchronizowane domyślnie. Naciśnij klawisz Menu i wybierz opcję Wyświetl etykiety w Gmailu w celu dostępu do wszystkich innych folderów pocztowych. Poza Gmail, Android dostarcza ogólne j aplikacji e-mail, który może łączyć się z wieloma kontami POP, IMPA i Microsoft Exchange. Otwórz aplikację e-mail i postępuj zgodnie z instrukcjami dla dodania dowolnego konta jakie sobie życzysz. Masz opcję konfiguracji wielu kont wewnątrz w jednej skrzynce odbiorczej razem wziętych. Wewnątrz aplikacji, kliknij przycisk Menu i wybierz polecenie Konta . Zawiera ono listę wszystkich kont e-mail, aby zobaczyć wszystkie wiadomości ze wszystkich kont razem. Zawsze możesz dodać więcej kont z tego ekranu: naciśnij ponownie klawisz Menu aby znaleźć opcję Dodaj konto, Aplikacja email, w przeciwieństwie do Gmaila, nie obsługuje "push" ( z wyjątkiem "Hotmail"), więc wiadomości nie pojawiają się natychmiast; zamiast tego ,aplikacja sprawdza nowe wiadomości co kilka minut. Użytkownik może zdefiniować jak często sprawdzać każde konto w menu Ustawienia konta (naciśnij klawisz Menu podczas przeglądania konta). Jeśli nie używasz serwera Exchange do synchronizacji Androida z Outlookiem może być trudno. Narzędzie Google Outlook Sync jest dostępne tylko dla płatnych Google Apps, wypróbuj GOGO Contact Sync. Jest to darmowe narzędzie open-source do synchronizacji kontaktów Outlooka z kontaktami z Gmail. Tak długo jak korzystasz z konta Gmail możesz ustawiać je jako domyślne w telefonie, kontakty będą automatycznie synchronizowane z Gmail na telefonie. Lub wypróbuj HTC Sync. Zainstaluj narzędzie Calendar Sync dla synchronizacji kalendarza Outlooka z Gmail, stamtąd do urządzenia z Androidem
Ustawienie e-mail
1.Import kontaktów: Urządzenie z Androidem może dołączać kontakty z szerokiego zakresu źródeł. Przy pierwszym użyciu będzie importował twoje kontakty z Gmaila. Jeśli również chcesz dodawać kontakty z kart ySIM, otwórz aplikację Contacts, naciśnij klawisz Menu i wybierz Import / Export, potem Import from SIM card
2.Instalacja HTC Sync: HTC Sync pozwala ci synchronizować kontakty Outlooka i informacje kalendarza na twoim komputerze z twojego telefonu. Po zainstalowaniu ,wybierz Sync Manager, naciśnij Settingsm potem pracuj z menu po lewej stronie
3.Dostosowanie ustawienia synchronizacji : Jedno ustawienie w szczególności jest bardzo ważne. Dyktuje ono co HTC Sync będzie robił w trudnej sytuacji kiedy informacje przechowywane na obu urządzeniach zostały zaktualizowane od ostatniej synchronizacji. Ostrożnie wybieraj właściwe ustawienia aby upewnić się ,że informacje najbardziej aktualne pozostają do następnej synchronizacji
4.Wykonanie synchronizacji: Mając sprawdzone ,że wszystkie ustawienia są właściwe, kliknij Synchronize now. Ten proces może potrwać trochę aby zakończyć się w pierwszym przebiegu, ponieważHTC Sync potrzebuje kopii wszystkich danych z PC do telefonu; kolejna synchronizacja będzie szybsza, z oprogramowaniem patrzącym tylko na zmiany dokonane od ostatniej synchronizacji
5.Dodawanie e-maila: Masz już skonfigurowane urządzenie dla dostarczenia emaila z konta Gmail (które jest wymagane dla urządzeń z Androidem) .Ale można również skopiować z innych adresów emial POP i IMAP. Aby dodać nowe konto e-mail, otwórz apliakcję Email i kliknij Menu, Dodaj Konto. Wpisz adres email i hasło, potem podaj Androidowi typ konta
6.Wpisz szczegóły :Dodaj wymagane informacje, kiedy jesteś o to proszony. Musisz znać informacje o serwerach POP3 i SMTP dla tego konta e-mail, które są dostępne u twojego dostawcy ISP. Przed przejściem do każdego nowego ekranu ustaweiń, Android będzie weryfikował informacje jakie mu podałeś i będzie ostrzegał o błędach.
7.Wybieranie opcji: Ustawiasz częstotliwość z jaką usługa email powinna sprawdzać nowe wiadomości i inne podręczne powiadomienia. Nadajesz również nazwę kontu. Będzie to to co pojawi się na mailu wychodzącym
8.Skrzynki odbiorcze : Jeśli ustawisz więcej niż jedno konto e-mail, możesz wybrać podgląd maila z każdego oddzielnie lub w pojedynczej skrzynce odbiorczej. Naciśnij ikonę Email, potem wybierz albo połączoną skrzynkę odbiorczą albo wybierz skrzynkę jaką chcesz przeglądać.
9.Ustawienia konta : Otwórz dowolne konto, naciśnij przycisk menu i wybierz Ustawienia Konta. TU możesz zmodyfikować częstotliwość pobierania, ilość nowych wiadomości .Domyślne konto będzie używane kiedy tworzysz email.
Praca z Google Voice
Smartfony Android mają wbudowaną tekstową i głosową pocztę, ale jest jeszcze jedna opcja: bezpłatna usługa Google Voice. Zapewnia usługę SMS i wiadomości głosowe. Po skonfigurowaniu konta Google Voice, otwórz aplikację Google Voice. Prawdopodobnie jest preinstalowana w telefonie lub tablecie (jeśli nie możesz jej znaleźć, sprawdź w Android Market). Postępuj zgodnie z instrukcjami, aby połączyć się z kontem i będziesz gotowy w kilka sekund .Bez zbytniego zagłębiania jak to działa, rzućmy okiem na to jak można zoptymalizować jej funkcje dla twojego urządzenia z Androidem .W aplikacji Google Voice możesz odczytywać i odsłuchiwać wiadomości głosowe jakie przyszły na twój numer w Google Voice , i wysyłać i odbierać wiadomości tekstowe. Pamiętaj ,że wszystkie wiadomości pokazywane jako przychodzące , nie przychodzą na twój główny numer telefonu. Pierwotnie Google Voice mógł tylko sprawdzać nowe wiadomości w przedziałach 5 lub więcej minut. Teraz można to zmienić przez synchronizację skrzynki odbiorczej. Otwórz ustawienia Google Voice na urządzeniu, dotknij Odśwież i powiadomienia. Wybierz Synchronizacja skrzynki odbiorczej aby uruchomić szybsze odbieranie powiadomień Będzie to automatycznie wyłączona opcja dla tekstu przychodzącego, więc nie będziesz odbierał dwukrotnie tej samej wiadomości .Alternatywnie możesz chcieć przesłać wiadomości przez Gmail. Zaloguj siędo Google Voice z komputera. Wybierz Poczta głosowa | SMS. Pod Voicemail Notification zaznacz opcje e-mail aby powiadomienia poczty głosowej i SMS przechodziły przez konto Gmail. Odtąd, za każdym razem kiedy odbierzesz pocztę głosową lub wiadomość tekstową przez Google Voice, otrzymasz powiadomienie e-mail na Gmail, które natychmiast pojawi się na urządzeniu z Androidem. Możesz nawet odpowiedzieć na wiadomość tekstową przez odpowiedzenie emailem. Google będzie automatycznie przekierowywał odpowiedź na numer nadawcy jako SMS. Jeśli pójdziesz tą drogą, możesz zechcieć wyłączyć powiadomienia w aplikacji Google Voice, jeśli są zbędne. Aby to zrobić, ponownie kliknij klawisz Menu w aplikacji Google Voice i wybierz Ustawienia, potem dotknij Odśwież i powiadomienia zmodyfikuj opcje jak ci będzie pasować
Zarządzanie plikami i dokumentami
Twoje urządzenie nie musi być tylko drogą zabawka. Za pomocą szerokiego wyboru profesjonalnych aplikacji w Android Market , twój Android może wziąć się do pracy profesjonalnej. Poniżej mamy omówienie niektórych z najlepszych aplikacji do przeglądania, tworzenia, edycji dokumentów biznesowych w drodze.
Zarządzanie plikami
Masz kilka sposób dla przenoszenia plików w telefonie z Androidem. Najłatwiejszą metodą jest połączenie telefonu z komputerem kablem USB i zamontowanie go jako napędu : naciśnij obszar powiadomienia Android, wybierz Połączenie USB i naciśnij Montuj. Możesz potem klikać zawartość kardy SD, badać i tworzyć foldery, przeciągać pliki lub kopiować pozycje między urządzeniem a dyskiem twardym PC. Jest to najprostszy sposób. Oczywiście, jeśli masz komputer przenośny, prawdopodobnie nie będziesz musiał przenosić plików na telefon na pierwszym miejscu .Będziemy zatem potrzebowali niezawodnego narzędzia pomocnego przy odkrywaniu plików i folderów na telefonie kiedy nie ma komputera w zasięgu wzroku. Jednym z ulubionych jest ASTRO File Manager. Narzędzie to daje widok w stylu Windows dla folderów, plików i dokumentów. Czy to dokument procesora tekstu, zdjęcie czy plik muzyczny, masz szybki podgląd zawartości pliku lub kliknij pozycję aby ją otworzyć. Android poprosi cię abyś wybrał jaką aplikację otworzyć; masz również opcję ustawienia swojego wyboru jako opcji domyślnej dla przyszłych wystąpień. Na pasku menu ASTRO są opcje do przesuwania, kopiowania, zmiany nazwy lub usuwania plików. Kliknij opcję Multi i możesz zaznaczyć wiele plików lub folderów do pracy jednocześnie. Dodatkowo pracując z plikami i folderami, ASTRO File Manager może zrobić kopię zapasową zainstalowanych aplikacji i zakładek przeglądarki i zamknięcie niechcianych procesów, które w przeciwnym razie wyczerpać baterie. ThinkFree Mobile Office działa podobnie ,a za 10 dolarów możesz zaktualizować go do pełnego pakietu aplikacji dla różnego rodzaju aplikacji biznesowych. Wersja premium zawiera wszystkie funkcje ThinkFree Writw; ThinkFree Calc i ThinkFree Show, które obsługują tekst, arkusz kalkulacyjny i prezentację, odpowiednio i mogą wyświetlać pliki Microsoft Office w ich oryginalnym formatowaniu ThinkFree również łączy się z GooglsDocs dla pobrania i podglądu plików zapisanych w chmurze. Chociaż zaawansowane funkcje edycyjne generalnie mają tylko aplikacje płatne, poręcznym narzędziem jest GDocs , pozwalający przeglądać, edytować a nawet tworzyć podstawowe dokumenty w Androidzie .Zamiast wykonywać całą brudną robotę na urządzeniu, łączysz się z Google Docs, przechowującym twoje dokumenty w chmurze Google. Sam GDocs tworzy tylko pliki tekstowe, i uruchamia przeglądarkę dla podglądu arkusza kalkulacyjnego i prezentacji w Google Docs. Jeśli masz do wykonania dużo pracy na urządzeniu, dobrym wybore jest DataVixDocuments ToGo
Krok po kroku :zarządzanie plikami
1.Instalacja menadżera plików. Android nie jest wyposażony w rodzaj menadżera plików do jakiego jesteś przyzwyczajony na komputerze, dzięki czemu można przegapić możliwość przeglądania dokumentów, poruszania się lub usuwania multimediów przechowywanych na karcie pamięci lub organizowania załączników email. Na szczęście istnieje wiele zewnętrznych aplikacji menadżerów plików jakie możesz dodać. Na przykład OI File Manager (darmowy z Android Market)
2.Przeglądanie pamięci. Po zainstalowaniu i uruchomieniu, aplikacja może przeglądać zawartość używanej karty multimedialnej. Jeśli widzisz ikonę Home na górze listy folderów i ikonę Kardt SD poniżej, aktualnie patrzysz na pamięć urządzenia. Naciśnij ikonę Karty SD aby przejrzeć zawartość, a ikonę Home aby wrócić do wewnętrznej pamięci telefonu
3.Tworzenie folderu. OI File Manager również pozwala ci stworzyć nowe foldery (lub zmienić nazwę istniejących), potem przenieść pliki do nich. Aby stworzyć nowy folder na karcie pamięci, naciśnij ikonę Karty SD, naciśnij przycisk Menu i wybierz Nowy Folder. Podaj jego nazwę
4.Organizacja plików. Aby skopiować, przenieść , zmienić nazwę lub usunąć plik, musisz tylko znaleźć go, a potem przytrzymać palec na nim. Zobaczysz różne opcje w zależności od typu pliku. Wybierz Wyślij aby przenieść plik do innego urządzenia używając Bluetooth lub emaila.
5.Zmiana nazwy plików. Urządzenia przenośne mają tendencję do generowania plików z bezsensownymi nazwami, tak jak zdjęcia , które aparat oznacza kolejnymi liczbami .Jedną z korzyści aplikacji menadżera plików jest to ,że możesz łatwo zmienić nazwę pliku, który jest dla ciebie ważny. Musisz jednak uważać aby nie edytować rozszerzenia pliku (trzy litery po kropce), albo plik stanie się nie do przeczytania, dopóki nie przywrócisz poprzedniego rozszerzenia. Przytrzymaj palec na pliku i wybierz Zmień nazwę, a pojawi się proste pole w którym możesz wpisać nową nazwę
Odtwarzanie muzyki
Android jest dobrą platformą dla komunikacji mobilnej, ale oferuje również bogactwo doświadczeń multimedialnych .Urządzenie z Androidem posiada funkcje, które pozwalają zarządzać i odtwarzać muzykę cyfrową na różne sposoby. Podobnie jak iPhone, Android ma swój własny, wbudowany odtwarzacz z interfejsem dotykowym, łatwy w uzyciu. Ponieważ Android jest platformą otwartą, możesz znaleźć aplikacje zewnętrzne do odtwarzania multimediów.

Ładowanie utworów
Niektórzy sprzedawcy dostarczają aplikacji desktopowym dla użytkowników PC ,pozwalające na zarządzanie multimediami na urządzeniach z Androidem. Programy te są użyteczne, ale nie szczególnie dla kopiowania muzyki i innych plików z komputera na telefon. Wszystko co trzeba zrobić to połączyć urządzenie z PC przez port USB i dotknąć obszaru powiadomienia na górze ekranu urządzenia. Dotknij połączenia USB w obszarze powiadomienia, potem naciśnij Montuj aby pamięć telefonu lub tabletu pojawiła się jako pamięć urządzenia na pulpicie. Działa to tak samo w Windows, Macu czy Linuksie. Kiedy komputer zamontował pamięć urządzenia Android, możesz przeglądać pliki i foldery na urządzeniu. Po portu zlokalizuj pliki muzyczne DRM na dysku twardym komputera i przeciągnij je do folderu Muzyka w Androidzie.
Windows Media Player
Większość urzadzeń z Androidem nie posiada swojego własnego narzędzia synchronizacji. Ale jeśli chcesz przeprowadzić automatyczną synchronizację w Windows, masz już aplikację desktopową do tej pracy: Windows Media Player. Aby zsynchronizować ścieżki muzyczne (jak również zdjęcia i video) z Media Playerem, wykonaj te same powyższe kroki. Podepnij telefon z Androidem lub tablet do portu USB, kliknij połączenie USB w obszarze powiadamiania Androida, i naciśnij Montuj aby PC rozpoznał go jako urządzenie. Potem uruchom Windows Media Player i poczekaj aż telefon pojawi się jako litera napędu w lewym panelu Biblioteki Media Playera. Aby ustawić synchronizację, kliknij zakładkę Synchronizacja,w prawym górnym rogu Windows Media Playera a potem kliknij małe (i nie oznaczoną) opcję menu rozwijanego pod nim. Kliknij Ustaw synchronizację a potem albo nazwę urządzenia lub pozostaw go jako literę napędu, jak wolisz. Kiedy klikniesz Zakończ, będziesz miał skonfigurowane związki, więc twój telefon będzie aktualizował się z folderu Muzyka PC ilekroć podłączysz go przez USB.
Sklep Amazon
Oprócz transferowania muzyki z komputera do telefonu, możesz również kupować piosenki i albumy, ze sklepu muzycznego online Amazona i pobierać je bezpośrednio na telefon lub tablet, bez korzystania z komputera lub połączenia USB. Kliknij ikonę Amazon MP3 aby wejść do sklepu, gdzie zostaniesz powitany przez 100 albumów, zobaczysz najlepsze 100 ścieżek .Aby usłyszeć 30 sekundową próbkę piosenki, kliknij jej tytuł. Kiedy znajdziesz piosenkę lub album, kliknij przycisk ceny; pojawi się słowo 'Buy'. Kliknij go ponownie, a zobaczysz ekran logowania Amazon. Wprowadź swój e-mail rejestracyjny i hasło aby kontynuować. Kiedy zakończysz proces zakupu, piosenka (lub piosenki) będą pobierane. Po pobraniu , muzyka z Amazon, znajdzie się w folderze oznaczonym 'amazonmp3' na karcie pamięci urządzenia. Aby zabezpieczyć się przed utratą danych, możesz podłączyć urządzenie do komputera i przeciągnąć te dane na dysk twardy komputera.
Aplikacja muzyczna
Kiedy naciśniesz ikonę niebieskiego mikrofonu w aplikacji Muzyka Google, znajdziesz bardzo prosty ekran główny, podzielony na cztery opcje, które pozwalają ci wyszukiwać muzykę poprzez artystów, albumy, tytuły piosenek lub listy odtwarzania. Naciśnięcie , którejkolwiek z nich powoduje ,że zobaczysz alfabetyczną listę , którą możesz przewijać i wybierać muzykę jaką chcesz usłyszeć. Z okna głównego dostępne są również dwie opcje menu, które mogą być dostępne przez naciśnięcie przycisku Menu na telefonie. Pierwsza ,Party Shuffle, będzie tworzyć losową listę odtwarzania ze wszystkiego w bibliotece muzycznej. Druga, Wyszukaj. Pozawala ci śledzić dowolny album lub ścieżkę przez nazwę. Aby stworzyć listę odtwarzania na telefonie, naciśnij i przytrzymaj tytuł piosenki dopóki nie pojawi się menu kontekstowe, wtedy naciśnij Dodaj do playlisty. Wybierz istniejącą listę odtwarzania lub naciśnij Nowy dla stworzenia nazwy nowej listy odtwarzania. Możesz potem wrócić do listy piosenek aby wybrać więcej ścieżek dla dodania do playlisty
Pobieranie i zarządzanie obrazami
Kto potrzebuje aparatu, kiedy smarfon jest pod ręką? System operacyjny Android zawiera funkcjonalność zarówno aparatu jaki i PC.
Aparat Androida
Większość urządzeń z Androidem ma dedykowany przycisk uruchamiający wbudowany aparat. Alternatywnie, możesz otworzyć go przez ikonę aplikacji Aparat. Kiedy otworzysz aparat Androida, zobaczysz wizjer plus kilka przycisków ekranowych. Jeśli obrócisz urządzenia poziomo, najwyższy przycisk będzie ikoną dla otwarcia galerii przechowywanych zdjęć. Kolejny przycisk to przełącznik, który przełącza między trybem zdjęć i video. W końcu, okrągły przycisk na dole jest wyzwalaczem- przyciskiem który naciskasz kiedy robisz zdjęcie lub rozpoczynasz nagrywanie video. W trybie zdjęć, możesz kliknąć gdziekolwiek na obrazie w wizjerze aby powiększyć lub zmniejszyć. Pojedyncze kliknięcie pozwala na kontrole powiększania, dzięki czemu można powiększać w małych krokach. Podwójne kliknięcie pozwala szybko powiększać / pomniejszać. Możesz dotrzeć do zaawansowanych opcji, naciskając klawisz Menu i wybierając opcje, lub przez dotknięcie obszaru daleko po lewej stronie ekranu. Wysuwane menu zaprezentuje ci opcje rozmiarów zdjęcia, jakości zdjęć i informacji o przechowywaniu lokalizacji obrazu. Począwszy od Androida 2.0, panel ustawień obejmuje inne zaawansowane opcje aparatu: wbudowaną obsługę lampy błyskowej, konfigurowalny tryb sceny (tryb działania, prawa trybu itd.), z balansem, efektem kolorów i trybem makro ostrości. Telefony z Androidem 2.0 lub wyższym, mają również zintegrowany zoom cyfrowy .
Przeglądanie i udostępnianie
Możesz użyć aplikacji Aparatu dla dostępu do obrazów przechowywanych w telefonie: naciśnij małą miniaturkę obrazu na górze ekranu (miniaturka zawsze wyświetla ostatnio zrobioną fotkę). Kiedy ładujesz obrazy w ten sposób, najpierw zobaczysz ostatnio wyświetlany pełnoekranowy rozmiar. Naciskając palcem na obrazie możesz powiększać lub pomniejszać; przesuwając palcem z lewej na prawą stronę możesz sekwencyjnie przeglądać przechowane obrazy. Przyciski po prawej stronie ekranu dostarczają szybkiego sposobu na usunięcie obrazu; udostępnienia go przez Bluetooth, email, wiadomości tekstowe, Picasa lub jakąś aplikację sieci społecznościowej zainstalowanej na telefonie; ustawienie obrazu jako tapety systemu głównego lub jakąś ikonę dla listy kontaktów. Po naciśnięciu klawisza Menu, zyskasz opcje obracania lub obcinania obrazu jak również przeglądanie szczegółowych informacji o pliku. Inną możliwością jest przeglądanie obrazów bezpośrednio z aplikacji Galeria, . Po załadowaniu Galerii, będziesz mógł przeglądać zdjęcia i video w folderach zorganizowanych zgodnie z tym jak i kiedy je otrzymałeś. Kiedy otworzysz folder, możesz klikną na obrazku aby zobaczyć go w rozmiarze pełnoekranowym. Aplikacja Galeria pozwala ci również odtwarzać pokaz slajdów .We wnętrzu folderu, kliknij klawisz Menu i wybierz Rozpocznij pokaz slajdów .Aby dopasować pokaz slajdów, kliknij klawisz Menu i wybierz Ustawienia. Znajdziesz tam opcje jak długo każdy obraz pozostanie na ekranie, jaki rodzaj przejścia pojawi się między obrazami, i oczywiście w jakim porządku obrazy będą się pojawiać. Menu Ustawienia również zawiera opcje dla modyfikowania rozmiaru i porządku wyświetlania miniaturek w aplikacji Galeria
Edycja obrazów
Nie ma domyślnej aplikacji Google dla edycji w Androidzie, ale w Android market znajdziesz wiele opcji dla manipulowania zdjęciami .Wśród nich znajduje się Photoshop Express. Jak można oczekiwać, jest ona daleka od pełnej wersji komputerowej Photoshopa, ale można na niej wykonywać podstawowe działania, takich jak przycinanie i korekcja kolorów. Inną użyteczną opcją jest PicSay Photo Editor. Ta darmowa aplikacja obejmuje narzędzia dla korekcji kolorów i dodawania efektów wizualnych, graficznych i podpowiedzi.
Inne sposoby uzyskiwania obrazów
Poza stosowaniem zdjęć, które możesz wykonać sam, możesz pobrać obrazy z internetu lub przetransferować je do telefonu lub tabletu z komputera. Obraz w urządzeniu bez względu dokładnie na miejsce jego przechowywania, zawsze będzie pokazany w aplikacji Galeria .Aby pobrać obraz z sieci, po prostu naciśnij i przytrzymaj palec na nim w przeglądarce urządzenia. Menu będzie pojawiać się z opcją zapisu obrazu. Aby przetransferować obraz z komputera, możesz po prostu przeciągnąć i upuścić go z PC podczas gdy telefon jest podłączony do portu USB. Podłącz kabel, potem dotknij obszar powiadamiania na górze ekranu urządzenia. Naciśnij połączenie USB w obszarze, potem naciśnij Montuj aby udostępnić pamięć telefonu lub tabletu , i aby pojawiła się jako pamięć urządzenia na pulpicie (Windows, Mac OS X , Linux) Zdjęcie jakie masz w swoim urządzeniu mogą być przeniesione do komputera w ten sam sposób.
Poprawianie zdjęć
Aparaty wbudowane do telefonów mobilnych to trochę więcej niż chwyt, z parą megapiskeli i bez fanaberii. Obrazom przechwyconym brakuje jakości tych, z nawet podstawowych aparatów. Na szczęście, wszystko się zmieniło i dzisiejsze urządzenia Androida zwiększyły funkcje do 5 megapikseli - plus aparaty z dodatkowymi funkcjami takimi jak miganie Flash i stabilizacja obrazu. Faktycznie , standard wbudowanych aparatów jest teraz tak dobry ,że chyba nie ma konieczności trzymania aparatów cyfrowych w domu. Przyzwoite rezultaty jednak nadal zależą od znajomości kilku sztuczek. Przyjrzymy się jak uniknąć - i tworzyć - rozmycie, jak kompensować różne warunki atmosferyczne używając lampy błyskowej oraz regulacji ISO, i jak oznaczyć i organizować zdjęcia na PC aby upewnić się ,że wyszły doskonałe zdjęcia.
1.Lampa błyskowa. Najpierw, zdecyduj czy lub nie musisz użyć lampy błyskowej. Nawet w jasny dzień, może być skuteczne w kompensowaniu ostrych cieni i niedoświetleń . Lampa błyskowa oświetla szczegóły, tylko gdy jesteś w zasięgu kilku metrów.
2.Modyfikowanie ustawień ISO. Kiedy pracujesz w nocy, zwiększenie ustawień ISO może być bardziej efektywne niż użycie lampy błyskowej. Nie podkręcaj ISO zbytnio, ponieważ możesz skończyć z cyfrowym hałasem na zdjęciu. Możesz modyfikować ISO w ustawieniach głównych aparatu. Kiedy jesteś gotowy wykonać zdjęcie, włącz stablilizator jeśli urządzenie ma tą funkcję
3. Dzięki autofokusowi, twoje zdjęcia nie powinny być rozmyte chyba ,że coś poszło źle. Drgania aparatu są najczęściej podejrzane, szczególnie ,że smartfony nie są fizycznie zaprojektowane do robienia dobrych zdjęć w ten sam sposób jak aparaty dedykowane. Trzymaj urządzenie obiema rękami a łokcie spuszczone po bokach ciała. Kiedy naciśniesz spust migawki, nie wykonuj żadnego ruchu , dopóki obraz nie zostanie wykonany. Jeśli robisz zdjęcie przy dużym świetle spróbuj zwiększyć szybkość migawki, jeśli jest opcja do tego, lub zwiększa ustawienia ISO (jak powyżej), co wymusi na aparacie automatyczne zwiększenie szybkości migawki aby zapobiec nadmiernej ekspozycji .Wybranie trybu Sport ma podobny efekt. Szybsza migawka oznacza mniej czasu dla wystąpienia drgań.
4.Rozmycie może czasami być wykorzystywane na korzyć, przeciągając ostrość w miękkie tło. Kiedy jest tworzony przez głębię ostrości (gdzie obiekty w pewnej odległości są zogniskowane) jest to zwane 'bokeh'. Jest to trudne do osiągnięcia z aparatem w smartfonie, ale innym sposobem jest śledzenie poruszającego się obiektu. Spróbuj skupić się na przyjacielu jak idziecie razem, utrzymując się w tej samej pozycji w kadrze , jak poruszasz się kiedy robisz zdjęcie, tło będzie złagodzone przez rozmycie w ruchu , podczas gdy twój przyjaciel jest w kadrze. Ten efekt działa najlepiej z wolniejszą migawką (więcej czasu na tworzenie rozmycia), więc unikaj trybu Sport , używając niskiego ISO i wyłącz lampę błyskową
5.Użycie timera. Samowyzwalacz jest użyteczną funkcją dla wykonywania zdjęć aparatem, kiedy sam chcesz być w kadrze. Jeśli twój aparat nie ma wyzwalacza, możesz wykorzystać aplikacje zewnętrzne z Android Market .
6.Dodawanie efektów. W Aparat, Ustawienia, Efekt, znajdziesz kilka filtrów jakie możesz zastosować, np. sepia. To może być zabawne i pomocne dla maskowania wszelkich braków w jakości obrazka. Aby być bardziej twórczym, skuteczną sztuczką jest robienie zdjęć z niezwykłej perspektywy.
7.Z bliska. Jedną z ostatnich i istotnych rad podczas fotografowania z mała, niską rozdzielczością aparatu, który nie ma zoomu optycznego : zawsze podejmuj wysiłek aby zbliżyć się do fotografowanego obiektu. To procentuje
Organizacja obrazków
1.Podgląd znaczników. 'Metadata' jest informacją przechowywaną razem z obrazkiem, taka jak użyty aparat, użyta ekspozycja, i co najważniejsze, znaczniki (słowa kluczowe) z nim powiązane. Aplikacje ,takie jak Astro może oznaczać wybrane pozycje . Jeśli masz kartę mickroSD, możesz podłączyć ją bezpośrednio do PC.
2.Dodawanie znaczników. Oznacz folder zdjęć, potem kliknij dowolne zdjęcie i naciśnij pole Znaczniki w stopce okna Windows Explorer. Wpisz opisowy termin; możesz wpisać wiele tagów oddzielonych średnikami. Aby później znaleźć te lub podobne zdjęcia, kliknij pole wyszukiwania Explorera i wpisz 'tag : x' zastępując 'x' jednym ze słów kluczowych wpisanych jako tagi.
3.Układanie wedle tagów. Alternatywnie , otwórz bibliotekę zdjęć i wybierz Znacznik z menu Ułóż według. Pojawi się lista dostępnych znaczników i miniaturek powiązanych z obrazkami .Wybierz znaczniki jaki chcesz. Aby zobaczyć informację o pliku, dołącz liczbę zdjęć z tym znacznikiem, kliknij prawym klawiszem na pustym polu wewnątrz folderu i wybioerz Widok, Szczegóły z menu kontekstowego
4.Udostępnianie zdjęć w Galerii Zdjęć. Wypróbuj narzędzie Windows Live Photo Gallery. Pozwala ono na konwersję zdjęć, podejmowanie szybkich poprawek, dodawania tagów I udostępniania na stronach Flickr, YouTube czy Facebook. Jeśli masz konto, będziesz mógł przesłać zdjęcia bezpośrednio z systemu Android do przechowywania i udostępniania online. Musisz podać identyfikator Windows Live ID, lub zarejestrować się, jeśli tego nie zrobiłeś. Aplikacja przeszukuje dysk twardy i wyświetla wszystkie znalezione obrazki. Kliknij zdjęcie aby zobaczyćswoje tagi. Aby dodać tag, edytuj informację. Kliknij pod opisowym znacznikiem, wpisz słowo i naciśnij Enter. Możesz kliknąć "Znaczniki ludzi" , aplikacja znajdzie dowolne twarze i pozwoli ci podać dla każdego nazwę.
5.Dodawanie ocen i podpisów. Możesz również nadać dowolnemu zdjęci opis i ocenę w gwiazdkach. Ponownie, kliknij zdjęcie i zmodyfikuj metadane wyświetlane po prawej stronie. Aby wyszukać zbiór otagowanych obrazków, wpisz słowo kluczowe w polu wyszukiwania; dla wyszukiwania wielu znaczników oddzielając każde słowo kluczowe od kolejnego ,slashem (/)
6.Poprawianie zdjęć. Windows Live Essentials Photo Gallery pozwala ci tworzyć podstawową edycję. Wybierz obrazek i kliknij Napraw na górze okna. Opcje pojawią się po prawej stronie, pozwalają one modyfikować kolor obrazka i ekspozycję, przycięcie itp.
Tworzenie, udostępnianie i odtwarzanie video
Czy masz ambitny film, czy po prostu chcesz uchwycić kilka cennych chwil , urządzenie Android może pomóc uchwycić mnóstwo materiału i dzielić się nimi ze światem. A , za pomocą , kilku aplikacji możesz przenosić i odtwarzać filmy bezpośrednio na telefonie
Światło, kamera….telefon?
Android zawiera zaawansowane funkcje przechwytywania, które są ograniczone jedynie przez moc wbudowanej kamery. Jednak jakość musi być więcej niż wystarczającą, aby była wiarygodna , gdy kamera jest poza zasięgiem. Aby rozpocząć przechwytywanie w Android, uruchom aplikację Aparat i przełącz się na tryb Video . Zauważ, że w przeciwieństwie do fotografowania, ważne jest, aby trzymać telefon w pozycji poziomej , ponieważ nie ma czegoś takiego jak tryb portretowy video. Domyślne ustawienia aparatu powinny generalnie dawać użyteczna wyniki, automatyczne ustawienia ogniska i ekspozycji podczas kompensacji różnych warunków oświetlenia. Możesz dostroić przechwytywanie video przez naciśnięci przycisku Menu na telefonie i wybierz Ustawienia. Tu znajdziesz opcje dla modyfikowania jakości , maksymalnego czasu trwania, z balansem i efektem kolorów. Większość czasu będziesz tworzył wysoką jakość, które mogą szybko zająć sporo miejsca na karcie SD. Jednakże, jeśli planujesz podzielić się swoimi video za pomocą MMS′a, większy sens ma robienie ich w niskiej rozdzielczości ,aby być pewnym ,że będą wystarczająco małe , aby je wysłać. Można ustawić czas trwania na 30 sekund (co jest dobre dla MMS), 10 minute (maksymalna długość dla YouTube), lub 30 mint (co jest naprawdę długo). Auto -balans jest włączony domyślnie i zazwyczaj dostarcza realistycznych odcienie. Ale jeśli planujesz wykonać kilka klipów w jednym położeniu, lepiej jest wybrać balans bieli ręcznie bez względu na dostępne światło. Aparat Android daje ci opcje dla żarowego (tradycyjnego) lub fluoroscencyjnego oświetlenia, dziennego i pochmurnego dnia. Jeśli chcesz uzyskać obraz fantazyjne możesz dodać efekty kolorów, zastosować sepię, efekt negatywu. Ale powiedzieliśmy że jeśli chcesz być kreatywny ze swoim video, ma sens wysłanie go do programu edycyjnego na komputerze, gdzie można nad nim popracować. Kiedy jesteś zadowolony ze swoich ustawień, naciśnij przycisk nagrywania. Po zakończeniu naciśnij ten sam przycisk aby zapisać nagranie na karcie pamięci.
Pokazywanie
Aby udostępnić video z telefonu, po prostu umieść je w Galerii. DO Galerii możesz dostać się albo z menu aplikacji albo kliknięcie ikony Galeria w prawym górnym rogu apliakcji Aparatu. Kliknij i przytrzymaj video dopóki nie pojawi się menu kontekstowe, wybierz Udostępnianie aby pokazać listę aplikacji, które możesz wysłać do przyjaciół. Powinieneś zobaczyć opcje takie jak Gmail, Messaging (dla MMS), Twidroid (dla Twitter) i YouTube. Pamiętaj ,że pewne metody udostępniania video mają ograniczenia. Jak wspomnieliśmy powyżej, jeśli chcesz udostępnić video przyjaciołom przez MMS, najlepiej robić je w niskiej rozdzielczości i nie dłuższe niż 30 sekund. Video dla YouTube może być wyższej jakości ,ale nie mogą być dłuższe niż 10 minut .Dla natychmiastowego udostępnienia, możesz również rozpocząć nagrywanie z poziomu aplikacji Messaging. Aby to ,zrobić, wybierz odbiorcę, naciśnij klawisz Menu na telefonie i wybierz Dołącz. Następnie wybierz Przechwytywanie video. Domyślnie Messaging będzie ustawiał jakość nagrywania na Niską i da ci 30 sekundowe odliczanie aby pomóc ograniczyć klip do właściwej długości. Jeśli nie jesteś zadowolony, możesz nacisnąć przycisk Powtórz i spróbować ponownie. Jeśli jesteś zadowolony, naciśnij OK. Messaging skonwertuje video do formatu MMS. W końcu, naciśnij Wyślij.
Zabezpieczenie urządzenia z Androidem
Czy zapłaciłeś małą fortunę za najnowszego Androida, czy też dostałeś go "za darmo" w umowie, dobrze jest założyć ,że dane w telefonie są równie cenne jak sprzęt. Jeśli telefon lub tablet został zgubiony lub skradziony, będziesz zadowolony ,że podjąłeś środki ostrożności aby ochronić wszystkie materiały.
Zablokuj przed wzrokiem ciekawskich
W przeciwieństwie do BlackBerry i innych mobilnych urządzeń, które używają kodów alfanumerycznych dla ochrony danych przed intruzami, Android wprowadza nowy system nazywany wzorcem zablokowania. Zamiast wpisywanie kodu z klawiatury, przesuwasz palcem po ekranie, we wcześniej określonym wzorcu, łącząc po drodze szereg punktów. Jeśli wzorzec jaki wprowadziłeś pasuje do wzorca poprzednio zapisanego w pamięci urządzenia, system operacyjny zostanie odblokowany. Jeśli nie, próbuj ponownie. Podobnie jako hasło, bezpieczeństwo wzorca zabezpieczeń bezpośredniego powiązanego z liczbą punktów danych w nim zawartych. Podobnie jak 6 cyfrowy kod jest bezpieczniejszy niż cyfrowy, tak wzorzec łączący sześć punktów będzie trudniejszy do złamania niż ten z czterema punktami (cztery to minimalna liczba dla wzorca odblokowania). Aby ustawić wzorzec, otwórz menu Ustawienia i naciśnij Położenie i zabezpieczenie. Jeśli nie miałeś ustawionego wzorca odblokowania wcześniej, zobaczysz Ustaw wzorzec odblokowania wyświetlony pod Wzorzec odblokowania ekranu. Jeśli masz już ustawiony wzorzec odblokowania, wtedy zobaczysz Zmień wzorzec odblokowania. W tym przypadku, naciśnij tą opcję aby uzyska Rysuj wzorzec odblokowania ekranu (Jeśli już masz wprowadzony wzorzec, musisz potwierdzić go przed stworzeniem nowego). Aby zacząć rysować wzorzec, dotknij palcem dowolny punkt na ekranie, potem przechodź przez kolejne punkty, bez odrywania palca od powierzchni, łącząc je w swój wybrany wzorzec - pionowy, poziomy, przekątny. Pamiętaj ,że bardziej złożone wzorce będą dużo bezpieczniejsze niż proste, więc im więcej kropek połączysz, tym lepiej.
Znajdź swój telefon
Czy wsunąłeś go między poduszki na kanapie, zostawiłeś na stole w restauracji, lub skradziono go z samochodu, zaginiony telefon może być trudny do odzyskania. Na szczęście, wbudowana funkcja GPS w Android , może sprawić ,że łatwo znaleźć urządzenie, które zniknęło, tak długo jak korzystasz z odpowiedniego oprogramowania





Statystyka generowana przez Reggi-Stat - www.reggi.pl