Archiwum kategorii 'AS3'

09/07/2008Sierotki, czyli problem wiszących spójników we Flashu

Wiszący spójnik, zawieszka, sierota – nazwa błędu składu tekstu polegającego na pozostawieniu na końcu wersu osamotnionego jednoliterowego słowa (najczęściej spójnika lub przyimka, np. “a”, “i”, “o”, “u”, “w”, “z”). Reguła zabraniająca wiszących spójników dotyczy zarówno tekstów ciągłych, jak i pojedynczych napisów wielowierszowych (np. tytuły, podpisy). Zgodnie z Polską Normą pozostawianie wiszących spójników jest dopuszczalne tylko przy bardzo wąskim łamie (np. gazetowym). [..] (Wikipedia).

Problem sierotek przewija się przy pracy nad stronami internetowymi od bardzo dawna. Jest wiele rozwiązań tego problemu w php (skrypty, pluginy WordPress, itp.), natomiast nie spotkałem się jeszcze z rozwiązaniem dla ActionScript (3.0). Okazało się ono stosunkowo proste, jednak nie możliwe do zastosowania we wszystkich przypadkach. Podobnie jak w html, wstawiamy pomiędzy spójniki a następujące po nich wyrazy, znaki twardej spacji ( ) w miejsce spacji miękkich. Pole tekstowe musimy wypełniać jako pole html (htmlText), gdyż inaczej ciąg   nie zostanie potraktowany jako twarda spacja. Wystarczy do tego proste wyrażenie regularne w AS3:

poletekstowe.htmlText = str.replace(/\s+([aiouwzAIOUWZ])\s+/g, ” $1 ”);

Wszystko działa znakomicie w przypadku korzystania z fontów systemowych (use device fonts). Niestety Flash nie embeduje znaku twardej spacji w przypadku pól z antyaliasem. Być może dało by się ten problem jakoś rozwiązać, np. łamiąc automatycznie w odpowiednich miejscach wiersze znakiem końca linii, jednak uniemożliwiło by to justowanie tekstu. Tak więc jeżeli przewidujemy w naszej flashowej aplikacji problem wiszących spójników, od razu nastawiajmy się na korzystanie z fontów systemowych.

Aby uniknąć konieczności zapamiętywania czy też szukania powyższego wyrażenia regularnego, napisałem prostą klasę w AS3. Klasa przenosi do nowej linii litery a, i, o, u, w, z. Oto przykład uzycia.

import com.woszkowski.tools.StringTool;
poletekstowe.htmlText = StringTool.suppressSingleLetters(str);

Pliki do pobrania:
StringTool - klasa do usuwania wiszących spójników oraz przykład uzycia

Linki:
skaldy.com - pomoc w rozwiązaniu problemu
sierotki wordpress plugin - plugin do wordpressa autorstwa Artura Kępy

Kategorie: AS3, www i Flash. Komentarze: 0 

23/03/2008Flash Biuletyn II

Kolejna porcja wiadomości i ciekawostek ze świata Flasha. :)

Stereoskopia
Okulary do oglądania anaglifów A konkretnie anaglify, czyli wyświetlanie specjalnie przygotowanych obrazów i oglądanie ich za pomocą okularów, dających wrażenie przestrzeni trójwymiarowej. Efekt ten możemy bardzo łatwo uzyskać za pomocą Papervision3D lub innego engine’u 3D. Renderujemy obraz z dwóch przesuniętych względem siebie w poziomie kamer, kopiujemy kanał czerwony jednej z nich, kanały zielony i niebieski drugiej i powstałe obrazy nakładamy na siebie. Istnieją trzy rodzaje okularów: czerwono-niebieskie, czerwono-cyjankowe i czerwono-zielone. Nie wiem jeszcze które nadają się najlepiej do oglądania tworzonych w ten sposób obrazów, ale już zostały zamówione, więc wkrótce własne przykłady i wyniki eksperymentów. :)

Tymczasem przykłady innych:
http://mrdoob.com/#/56/
http://mrdoob.com/#/57/
http://lab.benstucki.net/archives/AnaglyphTest/anaglyphtest.swf

YouTube Flash API / filmy w wysokiej jakości
YouTube stworzył API dla Flasha oraz Javascriptu , pozwalające na zamieszczanie na swoich stronach filmów bez standardowego playera. Nawigację możemy teraz tworzyć we własnym zakresie. Najważniejsze, że “chromeless player” pobierany jest spod adresu gdata.youtube.com, gdzie znajduje się plik crossdomain.xml, zawierający upragniony wiersz <allow-access-from domain=”*”/>. :) Oto przykład, że to wszystko na prawdę działa:
http://woszkowski.com/ytapi/

Inną nowością od YouTube są filmy w lepszej jakości. W ustawieniach konta pod pozycją Jakość odtwarzania filmów wideo (http://pl.youtube.com/video_quality_settings) możemy włączyć opcję “Mam szybkie połączenie. Zawsze odtwarzaj film wideo z wyższą jakością, jeżeli jest dostępna.“. Od tego momentu filmy będą odtwarzane z większym biterate’em oraz z większą częstotliwością próbkowania dźwięku. Jednak nadal będzie to kodowanie Flash Video. YouTube oferuje również nieoficjalnie filmy w standardzie H.264. Do ich oglądanie potrzebujemy Flash Playera w wersji 9.0.115. Aby oglądać filmy w tym standardzie, wystarczy na końcu adresu dodać “&fmt=18″. Oto przykłady tego samego filmu w różnych jakościach:
Jakość standardowa: http://www.youtube.com/watch?v=RZYIfUdIyfs (pod warunkiem, że w ustawieniach YT nie ustawiliśmy domyślnie wysokiej jakości)
Jakość wysoka: http://www.youtube.com/watch?v=RZYIfUdIyfs&fmt=6
Kodek H.264: http://www.youtube.com/watch?v=RZYIfUdIyfs&fmt=18

Yahoo Maps Flash API
Tym razem komponent dla Flex Buildera. Yahoo wypuściło komponent oraz API do swoich map. Umożliwia on bardzo łatwe kontrolowanie mapy z poziomu AS3. Warto zwrócić uwagę na to, że Yahoo Maps są już bardzo dokładne dla naszego regionu i nic nie stoi na przeszkodzie, żeby częściej z nich korzystać.

Umap
We wcześniejszym biuletynie opisywałem komponent G Map, umożliwiający obsługę Google Maps z poziomu Flasha. Tym razem AFC zaprezentowało komponent UMap, umożliwiający kontrolę z opziomy AS3 map OpenStreetMap oraz Microsoft Virtual Earth. O ile OpenStreetMap jest bardzo niedokładny na obszarze Polski, to Microsoft Virtual Earth charakteryzuje się taką dokładnością , że komponent UMap staje się godny polecenia. :)

AIR 1.0 i Flex Builder 3
AIR Adobe wypuściło oficjalne wersje Adobe Integrated Runtime oraz Flex Buildera 3. Jeżeli chodzi o AIR, to mimo, że słyszymy o nim już od dłuższego czasu, jest to dopiero pierwsza oficjalna wersja. Flex również jest dosyć młodym narzędziem, jednak w tym przypadku doczekaliśmy się już wersji nr 3. Zmiany w porównaniu z dwójką nie są duże.


Kategorie: AIR, AS3, Google, Papervision3d i Flash. 1 komentarz

04/03/2008Progress Bar

Pracownicy naukowi z  Carnegie Mellon University, New York University oraz AT&T Labs-Research przeprowadzili eksperyment, mający na celu zbadanie wpływu nieliniowego zachowania paska postępu na ludzkie odczucie jego długości trwania. W tym celu wyodrębnili 8 algorytmów postępu i pokazywali po dwa (jeden po drugim) grupie badanych osób. Za każdym razem badający miał ocenić, który pasek postępu pokonywał dystans od 0 do 100% szybciej, czy też może oba czasy były równe. Oczywiście w rzeczywistości oba czasy były identyczne i trwały 5,5 sekundy. Okazało się, że badający ocenili jako krócej trwające paski postępu, zwalniające na początku i przyspieszające na końcu.

Zdecydowanymi liderami okazały się algorytmy:
- Power: f(x) = (x+(1-x)*0.03)^2
- Fast power: f(x) = (x+(1-x)/2)^8

Tak więc aby jak najbardziej zniwelować negatywne odczucia użytkownika wywołane oczekiwaniem na załadowanie gry, strony, prezentacji, zainstalowanie oprogramowania, etc., powinniśmy stosować tego typu nieliniowe algorytmy postępu.

Wizualizacja wszystkich algorytmów jednocześnie.

Kod źródlowy: src-single.zip [355kB]
Źródło: Rethinking the Progress Bar

Kategorie: AS3 i Flash. Komentarzy: 6 

05/02/2008Flash Biuletyn I

Jestem dość pilnym subskrybentem wielu kanałów RSS. Wśród nich górują kanały Adobe. Ilość i jakość przekazywanych tam informacji jest tak duża, że nie sposób podzielić się nimi ze wszystkimi zainteresowanymi. I nie mówię tutaj tylko o kolegach “po fachu”. Czasami warto pokazać ludziom od kreacji coś, co będzie inspiracją do przyszłych spotkań koncepcyjnych. Czasami warto pokazać ludziom od handlu coś, co będą mogli zaproponować klientom. Czasami natomiast warto po prostu pokazać znajomym coś, co im się spodoba. Dlatego zamierzam tutaj co jakiś czas opisywać co ciekawsze “wydarzenia” ze świata flasha i jemu bliskich z nadzieją, że dotrę do szerszego grona odbiorców. :)

Tak więc zacznijmy od tego, co wartego uwagi wydarzyło się na przełomie grudnia 2007 i stycznia 2008 roku.

WOW - engine 3D podstawowych zasad fizyki

WOWKilka miesięcy temu światło dzienne ujrzał Box2dFlash - engine dla AS3, umożliwiający symulację podstawowych zasad fizyki (grawitacja + oddziaływanie między przedmiotami). Tym razem przyszła pora na przestrzeń 3D - engine WOW. Duże wrażenie robią przykłady użycia: kule zamknięte w obracającym się sześcianie, spadające na ziemię obrazki czy też obrazek oblewające kule niczym kawałek płótna. Osobiście jestem ciekaw, czy biblioteka jest bardziej zjadliwa, niż Box2dFlash. :)

Video w rozdzielczości HD w najnowszej wersji Flash Playera (9.0.115)

Żeby zdać sobie sprawę o czym piszę, proponuję od razu na samym początku zobaczyć ten przykład (klikając dwa razy w film przechodzimy do trybu fullscreen). Oczywiście trzeba mieć zainstalowanego Adobe Flash Playera w wersji 9.0.115. Niezłe, prawda? W dodatku całkiem płynnie chodzi. Zastanawiacie się jaki ogromny bitrate musi mieć to video? Otóż jest to video w rozdzielczości 1280×720, formacie mp4 500kbps… czyli nieco więcej niż mają filmiki z YouTube!!! Fakt, można się przyczepić, że w momentach gdy sporo się na ekranie dzieje widać ślady sporej kompresji, jednak i tak całościowy efekt jest zdumiewający.

Google maps prostsze niż kiedykolwiek - komponent dla Flash

G MapDzięki komponentowi G Map, stworzonemu przez firmę Advanced Flash Components, możemy w banalny sposób korzystać z funkcjonalności Google maps, przede wszystkim na stronach opartych w 100% na technologii flash. G Map umożliwia stawianie markerów, rysowanie linii i kształtów oraz nakładanie warstw, czyli dodawanie własnej funkcjonalności na mapę. Flash developerów ucieszy na pewno fakt, że wstawienie komponentu i dodanie np. własnego punktu na mapie to zaledwie kilka linijek kodu. :)

Statystyki penetracji wersji Flash Playera z grudnia 2007

Adobe Flash Player w wersji 9.0.0 lub nowszej jest zainstalowany na ponad 94,3% komputerów w Europie. W Stanach Zjednoczonych ten odsetek jest jeszcze większy i wynosi 96,8%. Co to oznacza? Że praktycznie całkowicie możemy przerzucić się na AS3. :)

Prognozy liczby urządzeń wspierających Flash Lite na rok 2008

Rynek urządzeń mobilnych rozwija się w ekspresowym tempie. Liczba rodzajów telefonów i urządzeń jest wręcz astronomiczna. Dlatego tworzenie aplikacji i gier na te urządzenia jest wyjątkowo uciążliwe. Nadzieją jest na pewno Flash Lite. Rozpowszechnienie tego rozwiązania było by zbawieniem dla developerów, gdyż aplikacje i gry napisane pod Flash Lite działają na każdym urządzeniu, które tą technologię wspiera, podobnie jak to jest ze stronami flash działającymi na różnych przeglądarkach oraz systemach operacyjnych. Prognozy na ten rok są optymistyczne. W Europie środkowej w 2008 roku będzie niemal 25 mln. urządzeń wspierających Flash Lite, z czego ponad 6 mln. w Polsce. Pewną barierą może być to, że dużo z nich nie ma Flash Lite‘a zainstalowanego fabrycznie jednak mam nadzieję, że będzie to bariera to przeskoczenia a w roku 2009 problem ten zupełnie zniknie. :)

Wrapper, czyli napisz stronę w HTML i wyświetl ją we Flashu

WrapperCiekawe rozwiązanie, które ma na pewno sporą przyszłość, choć wg mnie w trochę innej postaci. Na razie głównym celem Wrappera jest zachowanie identycznego wyglądu strony htm niezależnie od przeglądarki. Dodatkowo flash udostępnia nam kilka dodatkowych opcji, jak gradienty oraz filtry. Polega to na tym, że stronę piszemy w html (proponuję zobaczyć źródło tej strony), następnie za pomocą javascript, całość podmieniana jest jednym wielkim flashem a treść przekazywana do niego. Nie spodziewał bym się jednak przełomu w dziedzinie webmasterki. :) Osobiście chciałbym zobaczyć Wrappera, jako komponent lub bibliotekę, umożliwiającą ładny rendering kodu html we wnętrzu strony flash.

Na koniec w zasadzie ciekawostka, gdyż wymaga dość skomplikowanej zabawki… :)

Idealna technologia do przeprowadzania relacji sportowych

360 videoPrzepis jest następujący:
- kręcimy film za pomocą dość specyficznej kamery, która mam nadzieję od razu zespala obraz z wielu obiektywów w jedną panoramę,
- nakładamy całość na sferę,
- wrzucamy do Papervision3D,
- oprogramowujemy ruch myszki,
- sami decydujemy w którą stronę się patrzymy!
Ciekawe kiedy obejrzę w tej technologii np. relację z Tour de France. :)

*Mała adnotacja. Autorem zdjęć oraz producentem tego sprzętu jest firma Immersive Media.

Kategorie: AS3, Mobile, Google, Papervision3d i Flash. Komentarzy: 3 

23/12/2007Wesołych Świąt!

Jak co roku, krótko i zwięźle, życzę wszystkim z okazji Świąt oraz Nowego Roku, spełnienia wszystkich marzeń. :)

Tradycyjnie przygotowałem z tej okazji kartkę:

Święta 2007

Kartki świąteczne są dla mnie poligonem doświadczalnym. Pewnie dlatego rzadko kiedy trafiają w gust odbiorców. :P Tym razem pod nóż poszła nowa wersja biblioteki Papervision3D oraz biblioteka Box2DFlash. Papervision3D 2.0 oferuje cieniowane materiały. W bombce użyłem cieniowania Phonga. Box2DFlash służy do symulacji grawitacji oraz oddziaływania między sobą przedmiotów. Dzięki niej bombka się buja. Efekt jest całkiem fajny, wymaga jednak chyba dość dobrego procesora. :D

Zapraszam również do obejrzenia kartki - gry, którą oprogramowałem dla Netizens, czyli firmy w której pracuję. Tutaj również wykorzystałem Box2DFlash.

Netizens - Gwiazdka 2007

Dla przypomnienia kartki z poprzednich lat.

Rok 2006 - kartka również w 3D, jednak engine dość prymitywny, w całości albo w części mojego autorstwa (nie pamiętam).

Święta 2006

Rok 2005 - posadź swoją choinkę i zostaw na niej życzenia… dla kogoś szczególnego, dla siebie lub dla ogółu. :)

Święta 2005

Kategorie: AS3, Papervision3d i Flash. 1 komentarz