Bluetooth + Android: Pierwsza aplikacja APP Inventor - cz. II

Autor: Dondu

W pierwszej część tego artykułu określiliśmy założenia aplikacji i zaprojektowaliśmy komponenty niezbędne do zrealizowania.

W niniejszym artykule wykonamy program aplikacji i uruchomimy częściową jej wersję w celu przetestowania poprawności dodania komponentu listy urządzeń Bluetooth.

Poznasz więc krok po kroku, jak działają wybrane bloki programu oraz jak je łączyć, by osiągnąć zadaną funkcjonalność. Dowiesz się także jak przetestować aplikację za pomocą komputera wyposażonego w Bluetooth.

W artykule znajdziesz także gotową do pobrania aplikację.

No to do dzieła ... :-)


Programujemy, czy puzzlujemy - jak to nazwać? :-)

Jaka by nie była forma programu (w tym wypadku gotowe bloki), to jednak będziemy pisać program :-)

Aby rozpocząć przygotowanie programu, przechodzimy do edytora bloków klikając w prawym górnym rogu przycisk Blocks. Po otwarciu ekranu programowania, po lewej stronie zobaczymy dodane przez nas komponenty, a w głównej części pustą przestrzeń do umieszczania bloków programu:

W lewym dolnym roku jest też licznik błędów i ostrzeżeń (zaznaczony strzałką), których nie należy lekceważyć!


Lista dostępnych w pobliżu urządzeń Bluetooth

Zaczniemy od przygotowania programu listy urządzeń Bluetooth będących w zasięgu smartfona. W tym celu klikamy nasz komponent ListPicker1 co skutkuje otwarciem się okienka z blokami do wyboru, z którego wybieramy bloki when ListPicker1.BeforePicking i przeciągamy do okienka. Podobnie robimy z blokiem  set.ListPicker1.Elements.to:

Następnie za pomocą myszki łączymy oba bloki następująco:

Utworzyliśmy blok programu, który będzie podstawą do przygotowania list dostępnych urządzeń Bluetooth. Do pełni szczęścia brakuje mu jeszcze danych z modułu Bluetooth, czyli zestawienia urządzeń, które mógłby wyświetlić na liście ListPicker1.

Należy więc do ListPicker1 dołożyć element komponentu Bluetooth, który dostarczy tych danych do wyświetlenia. Komponentem tym jest BluetoothClient1.AddressesAndNames, który dokładamy na końcu naszego bloku:

Mamy więc fragment programu, który wypełni listę dostępnych urządzeń Bluetooth i w przypadku kliknięcia przycisku listy (czyli przycisku Lista dostępnych urządzeń Bluetooth) wyświetli nam tę listę.


Sprawdzamy działanie aplikacji na smartfonie

Przede wszystkim włączamy w smartfonie Bluetooth ponieważ pisana przez nas aplikacja nie posiada funkcjonalności sprawdzenia, czy moduł jest włączony i ewentualnego jego włączenia.

Teraz należy przesłać aplikację z komputera na smartfon, a mamy w tym względzie dwie możliwości (dostępne w menu Connect):

1. poprzez aplikację AI Companion,
2. poprzez kabel USB.

USB to szybki i zalecany sposób przesyłania aplikacji na smartfon.

Wykorzystanie aplikacji AI Companion jest nieco wolniejsze, ale zaprezentuję jak to zrobić, gdyż nie każdy może mieć kabel USB "pod ręką". Aby więc tą metodą uruchomić aplikację na smartfonie, powinieneś mieć zainstalowaną na nim aplikację MIT AI2 Companion, którą aktualnie (2014r.) można pobrać tutaj: MIT AI2 Companion

W tym przypadku istotne jest, by był włączony moduł WiFi smartfona i miał on dostęp do Internetu.

Na smartfonie uruchamiamy zainstalowaną wcześniej aplikację MIT AI2 Companion, a która rozpocznie się od ekranu:

Są dwie możliwości wykorzystania tej aplikacji:

• podanie kodu, który za chwilę wygeneruje nam AI Inventor, 
• lub skanowanie kodu QR. 

Ja wybrałem tę drugą opcję, bo jest szybsza. Klikamy więc przycisk scan QR code, w rezultacie czego włączy się aparat fotograficzny potrzebny do skanowania kodu QR.

Gdy mamy już na smartfonie otwartą aplikację  MIT AI2 Companion, w App Inventorze klikamy menu Connect i wybieramy AI Companion:

Pojawi się nam okienko z kodem QR:

który skanujemy smartfonem, który już oczekuje z włączonym aparatem fotograficznym:

Skanowanie kodu QR
Przykład na LG-E610

Po poprawnym zeskanowaniu kodu QR, smartfon pobiera aplikację (za pomocą WiFi) i uruchamia ją:

klikamy więc listę dostępnych urządzeń Bluetooth i nasza aplikacja ją pokazuje:

Pierwszy sukces mamy więc za sobą - zrealizowaliśmy punkt nr 1 z założeń dot. programu.

Teraz należy wybrać urządzenie stąd musimy zaprogramować ...


Reagowanie na wybór urządzenia z listy dostępnych

Potrzebne nam będą:

• blok, który poda nam dane wybranego z listy (klikniętego przez użytkownika aplikacji) urządzenia Bluetooth,
• blok, połączy się z wybranym urządzeniem znając jego dane.

Ponieważ nasze dane o urządzeniach Bluetooth w poprzednim bloku (pokazanym wyżej) przypisaliśmy do elementów ListPicker1 (ListPicker1.Elements), to znaczy, że po kliknięciu listy komponent ListPicker1 będzie znał dane urządzenia, które wybrał użytkownik aplikacji.

W związku z tym szukamy bloku ListPicker1, który zawiera dane wybrane z listy (selection) i znajdujemy:

Mamy więc już dane urządzenia Bluetooth wybranego z listy, teraz potrzebujemy blok Bluetooth, który połączy nas z wybranym urządzeniem na podstawie danych adresowych, które już mamy i temu nowemu blokowi podamy.

W komponentach naszego klient Bluetooth, czyli BluetoothClient1 znajdujemy:

Oba wyżej omówione bloki łączymy w następujący sposób:

Tak utworzony blok, połączy nasz smartfon z wybranym z listy urządzeniem. Dodatkowo ponieważ blok BluetoothClient1.Connect ma z lewej strony haczyk oznacza to, że zwraca informację, czy połączenie udało się nawiązać (true) czy też nie (false).

Warto by było tę informację wykorzystać, dodamy więc blok warunkowy dostępny w na liście bloków Control:

Łączymy go z blokiem Bluetooth następująco:

Ostatnim blokiem jaki musimy dodać jest blok reagujący na wybranie urządzenia z listy urządzeń. Ponieważ nasza lista urządzeń nazwana jest ListPicker1, tam więc szukamy i znajdujemy blok
ListPicker1.AfterPicking:

i łączymy go z wcześniejszymi następująco:

Tak stworzony blok po wybraniu urządzenia z listy wykona próbę połączenia z nim, i poinformuje warunek IF o rezultacie (True gdy połączenie zostanie poprawnie nawiązane, False w przeciwnym wypadku).


Włączenie ukrytych komponentów

Jeżeli rezultat nawiązania połączenia jest pozytywny, należy włączyć widoczność pozostałych ukrytych dotychczas komponentów, czyli Label1, TextBox1 oraz Button1.

Mamy już miejsce w warunku (then), gdzie możemy wstawić dodatkowe bloki, które wykonają się tylko wtedy, gdy połączenie zostało prawidłowo nawiązane. Musimy więc znaleźć bloki odpowiedzialne za widoczność poszczególnych komponentów. Na przykładzie komponentu Label1, znajdujemy set.Label1.Visible.to:

Do niego potrzebować będziemy wartość TRUE, którą znajdziemy w komponentach Logic:

i łączymy je następująco z pozostałą częścią tego fragmentu programu:

W przypadku pozostałych w/w komponentów  (TexBox1 oraz Button1) robimy to samo i w rezultacie otrzymujemy w pełni funkcjonalny blok:

Czyli nasz blok po wybraniu urządzenia z listy urządzeń Bluetooth, spróbuje nawiązać z nim połączenie i jeśli mu się to uda włączy widoczność pozostałych komponentów.


Sprawdzamy jak działa aplikacja, według opisu we wcześniejszej części niniejszego artykułu. Po uruchomieniu otrzymujemy jak poprzednio ekran:

Po kliknięciu przycisku wybory urządzenia:

i wybraniu właściwego (w moim przypadku HC-05) nastąpiło poprawne połączenie czego rezultatem było schowanie listy i pokazanie wszystkich ukrytych komponentów:

Czyli pięknie działa :-)


Reakcja na wysłanie wpisanego tekstu

Został nam do utworzenia blok wysyłania tekstu, który wpiszemy w polu TextBox1. Nie będę się już rozpisywał dokładnie, gdzie szukać poszczególne bloki, tylko pokażę gotowy blok, a Ty sam (w ramach treningu) znajdziesz odpowiednie bloki, bo już wiesz jak należy ich szukać :-)

Cały blok wyglądać powinien następująco:

Wyjątek zrobię jedynie dla bloku listy make a list ponieważ nie znajdziesz go w takiej formie na liście bloków Lists. Jest to bowiem wersja inline bloku make a list:

Aby go zmienić na wersję inline przeciągnij go do okna programu, kliknij na nim prawy klawisz myszki i wybierz Inline Inputs:

Następnie wstaw do niego dwa pola numeryczne z komponentów Math i wstaw w nie liczby 13 oraz 10, które odpowiadają znakom powrotu karetki (CR - ang. carriage return) i przejścia do nowej (LF - line feed ) - znaki CRLF. W ten sposób każdy wysłany tekst w terminalu będzie w osobnej linii.

Wróćmy do bloku wysyłającego dane, by wyjaśnić zasadę jego działania:

Gdy kliknięty zostanie przycisk Button1 nastąpi wysłanie poprzez Bluetooth zawartości pola TextBox1, a w drugiej kolejności wysłanie bajtów końca linii (CRLF).

Pełna część blokowa naszej aplikacji wygląda więc następująco:

Do pobrania

Do pobrania:

• plik projektu aplikacji MIT App Inventor 2 Beta: Test_Bluetooth_SPP.aia (kopia)
• aplikacja wykonana w MIT App Inventor 2 Beta: Test_Bluetooth_SPP.apk (kopia)

Możesz go przesłać pli Test_Bluetooth_SPP.apk na swój telefon w dowolny sposób (USB, Email, Bluetooth) i zainstalować. Po jej zainstalowaniu pojawi się ona ze standardową ikoną:

Testowanie

Aby za pomocą komputera przetestować naszą aplikację, należy mieć zainstalowany port COM w urządzeniach Bluetooth. By to osiągnąć należy (przykład dla Windows XP) w Panelu sterowania wybrać Urządzenia Bluetooth:

i w zakładce Porty COM sprawdzić, czy masz zainstalowany port:

Jeżeli port nie jest zainstalowany, należy kliknąć przycisk Dodaj... w wyniku czego ukaże się okienko:

Po kliknięciu przycisku OK nastąpi proces dodawania portu COM, co objawiać się będzie kolejnymi komunikatami:

czego rezultatem będzie zainstalowanie portu COM:

Teraz pozostaje już nam tylko włączyć dowolny terminal (ja preferuję Realterm) i w zakładce Display zaznaczyć opcję Ansi (by nie pokazywane były znaki specjalne CR i LF opisane wyżej):

oraz w zakładce Port i wybrać właściwy COM (w moim przypadku był to port COM21) i dowolne parametry transmisji danych:

Następnie przechodzimy do naszej aplikacji i łączymy się z komputerem wybierając go z listy - u mnie jest to BUBA :-)

Od tego momentu smartfon powinien być poprawnie połączony z komputerem za pomocą portu COM, możemy więc przystąpić do wysyłania danych testowych - ja wysłałem kilkukrotnie ciąg cyfr 1234567890:

czego efekt możesz zaobserwować w terminalu:

a poziom zadowolenia mocno wzrasta ;-)


Podsumowanie

Jak widzisz programowanie w App Inventorze za pomocą bloków jest banalnie proste. Początkowo pewną trudność może przynieść znalezienie potrzebnego nam bloku, jednakże po pewnym czasie będziesz gdy "złapiesz klucz" według jakiego podzielone są bloki nie będzie to stanowiło dla Ciebie żadnego problemu :-)

Możliwości Inventora są oczywiście znacznie większe niż pokazany powyżej przykład, więc zachecam do jego wykorzystania, a przykłady oraz Help znajdziesz na oficjalnej stronie: ai2.appinventor.mit.edu

W kolejnym artykule połączymy się z mikrokontrolerem za pomocą modułu HC-05 i pobawimy się diodą LED za pomocą kolejnej własnej aplikacji :-)