Креирајте изворне веб апликације на Андроид -у помоћу Апацхе Цордове

У комбинацији са оквиром корисничког интерфејса, попут јКуери Мобиле или Дојо Мобиле, ово омогућава апликацију у изворном облику, али развијену у ХТМЛ -у, ЦСС -у и Јавасцрипт -у. То имплицира да ако имамо веб апликацију можемо је претворити у изворну апликацију за Андроид, јер ће Апацхе Цордова функционисати као уграђени веб сервер на нашем мобилном уређају.
Овај Апи даје нам могућност изградње мобилних апликација које ће се покретати локално на мобилном уређају и засниват ће се на веб дизајну и развоју, па с Апацхе Цордовом можемо приступити путем Јавасцрипта функцијама мобилног уређаја, попут камере, података, везе вифи или мреже, тастатура или звук, геолокација, сопствена уграђена база података и све друге доступне функције.

За овај водич ћемо користити Нетбеанс 8.0.2 то долази са Апацхе цордова инсталиран, али видећемо и како га инсталирати од нуле да бисмо га могли користити са било којим другим уређивачем, укључујући и један једноставан Нотепад ++ или Плава риба.
Неопходно је имати Андроид сдк, Менаџер Андроид уређаја И Јава јре инсталиран, такође указујући извршне датотеке на системске променљиве.
За почетак морамо инсталирати ноде.јс, то је оквир који вам омогућава да креирате сервер који користи јавасцрипт као језик клијента и Цордова је инсталирана помоћу менаџера пакета под именом НПМ који је део Ноде.јс.
Инсталација ће се прво извршити на Линук -у, приступићемо терминалу у роот режиму и преузети датотеку ноде.јс са следећом командом:

вгет хттп://нодејс.орг/дист/в0.10.34/ноде-в0.10.34-линук-к86.тар.гз

Распакирајте и копирајте у други директориј

судо тар -Ц / уср / лоцал --стрип-цомпонентс 1 -кзф ноде-в0.10.34-линук-к86.тар.гз

Инсталирамо одговарајуће пакете

 лс -л / уср / лоцал / бин / ноде лс -л / уср / лоцал / бин / нпм 

Затим прелазимо на инсталатер Апацхе Цордова

судо нпм инсталл -г цордова

Да бисмо се уверили да је исправно инсталиран, можемо писати у терминал цордова -в и вратиће инсталирану верзију Апацхе Цордове.
Након инсталације можемо креирати апликације с Цордовом, за креирање апликације идемо у директориј пројекта који имамо, а затим с терминала уписујемо предложене наредбе:
Структура команде ће бити:

цордова креира компоненту директоријума пројекта.пакет.класу

па ће на пример наша апликација бити:

цордова цреате мисапп цом.туториалес.мисапп МиАпп01

Ово ће створити структуру пројекта и преузети све потребне и ажуриране пакете које ћемо користити у нашој апликацији.

Цордова емулира андроид

Можемо видети како је директоријум креиран мисапп, унутар структуре апликације и тамо можемо пронаћи следећи садржај.
У фасцикли платформе Садржи потребне датотеке како би Цордова могла да комуницира са различитим уређајима, овде ћемо додати платформе за које желимо да тестирамо нашу апликацију.
Пример са терминала извршићемо следећу команду за коришћење Андроид платформе

Цордова платформа додати андроид

Резултат ће бити:

 # / пројецтс / мисапп / ввв $ цордова платформа додати андроид Креирање андроид пројекта… Креирање Цордова пројекта за Андроид платформу: Путања: платформе / андроид Пакет: цом.туториалес.мисапп Назив: МиАпп01 Андроид циљ: андроид-19 Копирање датотека шаблона… Пројекат успешно креиран. 

Ово ће конфигурисати важећи емулатор за Андрод верзија 19 Шта је он АПИ верзија 19 или такође Андроид 4.4 (КИТКАТ), што значи да можемо опонашати било који уређај који ради на овој или старијој верзији. Неке подржане платформе су Амазон Фире ОС, Андроид, БлацкБерри, Фирефок ОС, иОС, Виндовс Пхоне, У овом водичу ћемо се фокусирати на Андроид.
У адресару ввв Тамо ће се развијати сама апликација, ту ће бити хостовани ХТМЛ, ЦСС, слике и Јавасцрипт датотеке, као и сви потребни ресурси за нашу апликацију, запамтите да је то веб страница која ће се изворно покретати унутар сервера, а такође уграђени веб прегледач који ће радити као изворна апликација на Андроиду.
Када креирамо наш пројекат у директоријуму ввв, биће створена генеричка структура пројекта дефинисано кодом неопходним за покретање једноставне апликације типа "Здраво Свете„Дакле, имамо пример или шаблон извршне апликације да тестирамо да ли ради пре програмирања, међутим, да бисмо је покренули, морамо прво додати платформу или платформе, на пример ако желимо да је тестирамо на Андроид и иОС уређајима користите следећу команду:
За Андроид

цордова буилд Андроид

За иос

цордова буилд иОС

Кад год извршимо наредбу унутар директорија апликација, знат ће да је то апликација за компајлирање. Једном преведено у директоријум платформе / платформе / андроид / ант-буилд / генерисаће датотеке за нас.

ЦордоваАпп-дебуг.апк

Што ће бити инсталацијска и извршна апк датотека на било којем Андроид уређају. Да бисте га покренули, директоријум апликација мора имати дозволе за потпуни приступ. Сада ћемо га први пут извршити са емулатором за шта пишемо у терминалу.

Цордова емулира андроид

Можемо видети генерички уређај који приказује апликацију, кликнемо на њега и видимо подразумевану апликацију Апацхе.
Сада можемо започети креирање наше апликације уређивањем датотеке индек.хтмл која се налази у директорију ввв. Код је једноставан, мета открива тип уређаја, оквири за приказ прилагођавају садржај резолуцији и величини екрана уређаја.
Остатак кода је ХТМЛ5, датотека цордоба.јс ће имати конфигурацију сервера, а датотека индек.јс ће бити место на коме ћемо програмирати наше скрипте како би апликацији дали интерактивност.

 Миапп01
Повезивање са уређајем
Уређај је спреман
Хајде да направимо неке промене са ХТМЛ5 и ЦСС3 за тестирање, а тестираћемо и други уређај. Направимо образац са два поља унутар слоја апликацијеИме:
Е-маил:
Тражимо фасциклу цсс унутар датотеке индек.цсс и додаћемо следећи код за обликовање дугмета .бтн {бацкгроунд: # 3498дб; бацкгроунд-имаге: -вебкит-линеар-градиент (врх, # 3498дб, # 2980б9); бацкгроунд-имаге: -моз-линеар-градиент (топ, # 3498дб, # 2980б9); бацкгроунд-имаге: -мс-линеар-градиент (топ, # 3498дб, # 2980б9); бацкгроунд-имаге: -о-линеар-градиент (топ, # 3498дб, # 2980б9); бацкгроунд-имаге: линеар-градиент (до дна, # 3498дб, # 2980б9); -вебкит-бордер-радиус: 28; -моз-бордер-радиус: 28; бордер-радиус: 28пк; породица фонтова: Ариал; боја: #фффффф; фонт-сизе: 20пк; паддинг: 10пк 20пк 10пк 20пк; декорација текста: нема; } .бтн: ховер {бацкгроунд: # 3цб0фд; бацкгроунд-имаге: -вебкит-линеар-градиент (врх, # 3цб0фд, # 3498дб); бацкгроунд-имаге: -моз-линеар-градиент (топ, # 3цб0фд, # 3498дб); бацкгроунд-имаге: -мс-линеар-градиент (врх, # 3цб0фд, # 3498дб); бацкгроунд-имаге: -о-линеар-градиент (врх, # 3цб0фд, # 3498дб); бацкгроунд-имаге: линеар-градиент (до дна, # 3цб0фд, # 3498дб); декорација текста: нема; } 

Када извршите измене, чувамо датотеке и поново их покрећемо помоћу наредбе цордова емулате андроид, претходно смо конфигурисали други уређај у Управитељу Андроид уређаја.

ЕНЛАРГЕ

Коначно, наше промене раде, у другом водичу ћемо видети како да направимо различите апликације са већом сложеношћу.
До сада видимо како да креирате апликацију помоћу ХТМЛ5, ЦСС3 и Јавасцрипт или Јкуери мобиле за различите мобилне уређаје, без обзира да ли се ради о мобилном телефону или телевизору који подржава Андроид. Веома важан аспект који треба имати на уму је да се о целом дизајну треба размишљати као о прилагодљивом или осетљивом.Да ли вам се допао и помогао овај водич?Можете наградити аутора притиском на ово дугме да бисте му дали позитиван поен