wtorek, 22 marca 2016

Złap zająca

Świąteczna wersja gry polegająca za dotknięciu zająca. Nasz zając będzie zmieniać swoje  położenie co pół sekundy. Jeśli zostanie dotknięty nasz telefon zawibruje i  gracz zdobywa punkt. Naciśnięcie przycisku Reset - resetuje dotychczasowy wynik.


Na naszym ekranie wykorzystamy polecenia:
- obszar po którym będzie poruszał się zając - Canvas
- pole w którym pojawi się wynik z ilością dotknięć zająca - Label
- postać zajączka - ImageSprite
- przycisk resetujący wynik - Button
- licznik czasu, którym posłużymy się by zając pojawiał się w różnych miejscach na ekranie  - Clock
- komponent wywołujący wibrację telefonu - Sound



Aby móc rozmieścić przyciski jeden pod drugim wykorzystamy Layout / VerticalArrangement
  • zmieniamy Width na Fill parent
  • zmieniamy Height na Fill parent

Wstawiamy pole w którym pojawi się informacja o ilości zdobytych punktów


  • po lewej stronie z Palette wybierz Label przeciągnij go na obszar Viewer
  • po prawej stronie ekranu w Components zmień nazwę na Licznik
  • po prawej stronie ekranu w Properties dokonaj zmian:
      • kolor i kształt przycisku
      • Text - wpisz Wynik


Dodajemy przycisk umożliwiający nam zresetowanie wyniku
  • po lewej stronie z Palette wybierz Button i przeciągnij go na obszar Viewer
  • po prawej stronie ekranu w Components zmień nazwę na Reset
  • po prawej stronie ekranu w Properties dokonaj zmian:
    • kolor i kształt przycisku
    • Text - wpisz np. Wynik


Dodajemy przestrzeń w której nasz królik będzie się poruszał - Canvas
  • po lewej stronie z Drawing and Animation wybierz Canvas i przeciągnij na obszar Viewer nad poprzednie komponenty
  • po prawej stronie w Components zmień nazwę na Pole
  • po prawej stronie zmień Height oraz Width na Fill parent..
  • można zmienić tło z wiosennym motywem :)


Umieszczamy komponent umożliwiający wibrację telefonu
  • po lewej stronie z Media wybierz Sound i przeciągnij na obszar Viewer - zobaczysz go pod ekranem 
  • po prawej stronie zmień MinimumInterval (ms) na 500




Dodajemy komponent zegara, który wykorzystamy jako licznik czasu uruchamiany w regularnych odstępach
  • po lewej stronie z Sensors wybierz Clock i przeciągnij na obszar Viewer - zobaczysz go pod ekranem 
  • po prawej stronie zmień TimeInterval (ms) na 500


Dodajemy naszego duszka - królika
  • po lewej stronie z Drawing and Animation wybierz ImageSprite i przeciągnij na obszar Canvas/Pole nad poprzednie komponenty
  • zmień w Picture na odpowiedni rysunek
  • pamiętaj by wstawiona postać był niewielkich rozmiarów 


Przechodzimy  do trybu Blocks

Musimy opracować dwie procedury:


  1. Procedura - dzięki niej królik będzie się przenosił w losowo wybrane miejsca na ekranie Procedure
  2. Procedura - umożliwi nam zliczanie zdobytych punktów Procedure1


Procedure - jedno polecenie ustawia współrzędną X, drugie współrzędną Y. Pozycja królika będzie ustawiana jako iloczyn różnicy rozmiaru kanwy i wielkości królika oraz losowego ułamka z zakresu 0 - 1.

  • wybierz Built-in/Procedures. Oszukaj to procedure do
  • kliknij na ImageSprite1 i wybierz set Imagesprite1.X to - wstaw do poprzedniego elementu 
  • wybierz Built-in/Math. Odszukaj 3 elementy: mnożenieodejmowanie  oraz random fraction (umożliwia losowanie)





Uzupełnij klocki wg przykładu poniżej.






Tworzenie zmiennej globalnej o nazwie Wynik - umożliwi nam przechowywanie liczby dotknięć królika. Wartość początkowa to 0.

  • wybierz Built-in/Variables, odszukaj initialize global .... to 
  • wybierz Built-in/Math. Odszukaj puste pole, wpisz 0 i dołącz do poprzedniego klocka





    Procedure1 - będzie nas informować o liczbie dotknięć królika.  
    • wybierz Built-in/Procedures. Oszukaj to procedure2 do
    • kliknij na Screen1/Licznik, wybierz set Licznik to
    • kliknij Built-in/Text i odszukaj element join - dołącz do  niego puste pole do którego wpisz słowo Wynik 
    • wybierz Built-in/Variables, odszukaj get - zatwierdź global wynik


    Dodajemy licznik czasu - który spowoduje, że zając będzie pojawiał się na ekranie w równych odstępach czasowych.




    • kliknij na Screen1/Clock1, wybierz when Clock1.Timer
    • wybierz Built-in/Procedures. Oszukaj call procedure i dołącz do poprzedniego elementu


    • Umożliwiamy zliczanie pkt za dotknięcie zająca.

















      Ostatni element - umożliwienie zresetowanie dotychczasowego wyniku.








      wtorek, 23 lutego 2016

      Kieszonkowy tłumacz

      Naszym celem jest zaprojektowanie programu, który umożliwi nam przetłumaczenie  z języka polskiego na angielski i odwrotnie. Dodatkowo do przetłumaczonego tekstu zostanie  dołączony komunikat głosowy.




      Na naszym ekranie powinny być umieszczone 4 rodzaje elementów:

      - pole w które wpisujemy słowa w języku polskim lub angielskim - TextBox

      - 2 przyciski, którymi wskazujemy w jakim języku ma być tłumaczenie - Button

      - pole w którym pojawi się przetłumaczony tekst - Label

      narzędzie umożliwiające tłumaczenie - TextToSpeech

      - narzędzie umożliwiające komunikaty głosowe - Yandex Translate









    • po lewej stronie z Palette wybierz TaxtBox i przeciągnij go na obszar Viewer
    • po prawej stronie ekranu w Properties dokonaj zmian:

        • kolor i kształt przycisku
        • Hint - umieść napis Wpisz tekst
        • Width - ustaw na Fill parent...
        • Text - okno pozostaw puste
        • TextAlignment  - ustaw center 



      Aby móc rozmieścić dwa przyciski obok siebie wykorzystamy Layout / HorizontalArrangement



      • odszukujemy po lewej stronie, przeciągamy na Viewer 
      • w Properties zmieniamy Width na Fill parent




      Dodajemy dwa przyciski 


      • po lewej stronie z Palette wybierz Button i przeciągnij go na obszar Viewer
      • po prawej stronie ekranu w Components zmień nazwę na tlumacz_na_angielski
      • po prawej stronie ekranu w Properties dokonaj zmian:
        • kolor i kształt przycisku
        • zmieniamy Width na Fill parent (zmieniamy po dodaniu drugiego przycisku)
        • Text - wpisz np. na angielski





      Tą samą procedurę powtarzamy dla drugiego przycisku. Zmieniamy nazwę na tłumaczenie na język polski.




      Wstawiamy pole w którym pojawi się tłumaczony tekst.


      • po lewej stronie z Palette wybierz Label przeciągnij go na obszar Viewer pod oba przyciski 
      • po prawej stronie ekranu w Components zmień nazwę na Tlumaczenie
      • po prawej stronie ekranu w Properties dokonaj zmian:
        • kolor i kształt przycisku
        • Text - wykasuj tekst, który tam jest (w efekcie na ekranie pozostanie pionowy znak)














      • po lewej stronie z Media wybierz TextToSpeech przeciągnij go na obszar Viewer. Narzędzie zobaczysz pod ekranem




        • po lewej stronie z Media wybierz YandexTranslate przeciągnij go na obszar Viewer.  Narzędzie zobaczysz pod ekranem
        • tak samo dołącz kolejny YandexTranslate






        Uporządkujemy wygląd naszego ekranu


        • kliknij po prawej stronie ekranu w Screen1
          • zmień AlignHorizontal na Center 
          • w Backgroundlmage wstaw plik graficzny jako tło 






        Przechodzimy  do trybu Blocks


        • po lewej stronie wybierz  Blocks / Screen1 / tlumacz na angielski. W oknie pojawią się proponowane klocki, wybierz when tlumacz na angielski Click do i przeciągnij na pole robocze






        • wybierz  Screen1 / TextToSpeech. Odszukaj set TextToSpeech. Language to i umieść go wewnątrz poprzedniego elementu
        • wybierz Built-in/Text. Odszukaj puste pole tekstowe. Wpisz do niego en i potwierdź enterem. Dołącz do poprzedniego elementu




        • wybierz  Screen1 / YandexTranslate1. Odszukaj call YandexTranslate.requestTranslation i umieść go pod poprzednim elementem
        • wybierz Built-in/Text. Odszukaj puste pole tekstowe. Wpisz do niego pl-en i potwierdź enterem. Dołącz do poprzedniego elementu
        • wybierz  Screen1/ TextBox1. Odszukaj TextBox1.Text i dołącz do ostatniego elementu



        • wybierz  Screen1 / YandexTranslate1.  Odszukaj when YandexTranslate1.GotTranslation do i umieść go na Viewer




        • wybierz  Screen1/ tlumaczenie. Odszukaj set tlumaczenie.Text i dołącz do ostatniego elementu
        • powyżej zobaczysz translation, kliknij na niego prawym przyciskiem myszy i wybierz get.translation. Dołącz do poprzedniego polecenia



        • wybierz  Screen1 / TextToSpeech1. Odszukaj call TextToSpeech1. Speak message i umieść go pod poprzednim elementem
        • wybierz  Screen1/ tlumaczenie. Odszukaj tlumaczenie.Text i dołącz do poprzedniego elementu






        • wybierz  Screen1/ TextBox1. Odszukaj set TextBox1.Text to i dołącz do ostatniego polecenia
        • wybierz Built-in/Text. Odszukaj puste pole tekstowe. Dołącz do poprzedniego elementu


        Wykonaj to samo działanie dla tłumaczenia na język polski wg poniższego przykładu .




        Sprawdź działanie programu :)


        środa, 10 lutego 2016

        Przywitanie głosowe - ćwiczenia uczniów

         Praca Marty i Arka

        W okienku widoczny jest tekst informujący, by nic nie wpisywać. Gdy coś wpiszemy i potwierdzimy przyciskiem dostaniemy stosowny komunikat :)



        Praca Olka i Piotra

        W okienku jest prośba o wpisanie imienia i naciśnięcie zdjęcia lwa, wówczas usłyszymy ryk lwa oraz kilka miłych słów :)



        środa, 3 lutego 2016

        Przywitanie głosowe

        Zaprojektujemy program, który zapyta się nas jak mamy na imię. Po uzyskaniu naszej odpowiedzi przywita się z nami komunikatem głosowym.

        • utwórz nowy projekt, wpisz nazwę projektu np. przywitanie
        • uruchom program i pozostań w Designer
        • na początku musimy zaprojektować wygląd naszego programu


        Na naszym ekranie powinny być umieszczone 3 elementy:

        - pole w które wpisujemy swoje imię - TextBox

        - przycisk, którym potwierdzamy wpisanie imienia - Button

        - pole w którym pojawi się komunikat do nas skierowany - Label

        • po lewej stronie z Palette wybierz Button i przeciągnij go na obszar Viewer

        • po prawej stronie ekranu w Components zmień nazwę na przycisk_imie
        • po prawej stronie ekranu w Properties dokonaj zmian:
          • kolor i kształt przycisku
          • Text - wpisz np. Kliknij mnie

        • po lewej stronie z Palette wybierz TextBox przeciągnij go na obszar Viewer nad przycisk Kliknij mnie
        • po prawej stronie ekranu w Components zmień nazwę na okno_imie
        • po prawej stronie ekranu w Properties dokonaj zmian:
          • kolor i kształt przycisku
          • Text - wpisz np. Podaj swoje imię?

        • po lewej stronie z Palette wybierz Label przeciągnij go na obszar Viewer pod przycisk Kliknij mnie
        • po prawej stronie ekranu w Components zmień nazwę na Twoje_imie
        • po prawej stronie ekranu w Properties dokonaj zmian:
          • kolor i kształt przycisku
          • Text - wykasuj tekst, który tam jest (w efekcie na ekranie pozostanie mały znak)


        Uporządkujemy wygląd naszego ekranu


        • kliknij po prawej stronie ekranu w Screen1

          • zmień AlignHorizontal na Center 
          • w Backgroundlmage wstaw plik graficzny jako tło 


         Przechodzimy  do trybu Blocks


        • po lewej stronie wybierz  Blocks / Screen1 / przycisk_imie. W oknie pojawią się proponowane klocki, wybierz when przycisk_imie Click do i przeciągnij na pole robocze


        • wybierz  Screen1 / Twoje_imie. Odszukaj setTwoje_imie.Text to i umieść go wewnątrz poprzedniego elementu
        • wybierz Built-in/Text. Odszukaj join dołącz do niego 2 puste pola tekstowe Wpisz do nich przywitanie, pamiętaj o spacjach na końcu 
        • wybierz Screen1 /okno_imie. Odszukaj okno_imie.Text i dołącz do join jak w przykładzie





        • wybierz  Screen1 / okno_imie . Odszukaj set okno_imie.Text to i umieść go wg przykładu
        • wybierz Built-in/Text. Odszukaj puste pole i dołącz do poprzedniego elementu



        SPRAWDŹ DZIAŁANIE SKRYPTU

        Dołączymy przywitanie głosowe



        • wróć do Designer 
        • po lewej stronie z Media wybierz TextToSpeech i przeciągnij go na obszar Viewer. Pojawi się jako nowy element pod obszarem Screen1.



        • przejdź do Block
        • wybierz  Screen1 / TextToSprech . Odszukaj set TextToSprech to i umieść pośrodku skryptu
        • dołącz pola odpowiedzialne za tekst (możesz zduplikować elementy z poprzedniego polecenia)




        Sprawdź ponownie działanie skryptu.