Medienproduktion Sommersemester 2010 - fue-wiki.tubit.tu...

MedienproduktionSommersemester 2010

Dipl.-Inform. Alexander Schulze Prof. Dr. Ing. Klaus Rebensburg

Ablauf Heute

• Prüfungstermin 02.09.2010, 10 Uhr in 03.06.H01

• Zwischenpräsentationen

• Fortsetzung Programmierung mit Flash

• Fortsetzung Nutzung von Sound mit AS3Mikrofon nutzen

• Überblick über weitere Features

• Text

• URLLoader und Loader

• Bitmaps verwenden

• Filter

• Pixel Bender

Zwischenpräsentationen

Flash - Fortsetzung - Programmierung mit

ActionScript 3

ActionScriptSound (Fortsetzung)

Grundlagen Mikrofon nutzen

• neuere Flash-Versionen: Speex-Codec

• Sound-Aufnahme nur bei Aktivität: zum einsparen von Ressourcen (CPU-Last, Bandbreite)

• nach einer Zeit unter einem bestimmten Level wird „stumm geschaltet“ und Event ausgelöst

• „Stummschaltung“ kann deaktiviert werden

medienproduktion/interactive-media/flash/actionscript/sound/grundlagen

Mikrofon-Aktivität: Stummschaltung


0

100

silenceLevelactivityLevel activityLevel

activityLevel < silenceLevelfür mehr ms als silenceTimeout

Mikrofon wird stummgeschaltet

ActivityEvent.ACTIVITY

Microphone-Klasse

• import flash.media.Microphone;

• activityLevel-Eigenschaft⇒Lautstärke des erfassten Sounds (0-100)

• silenceLevel-Eigenschaft⇒ Schwellwert Stummschaltung (0,-100, default 10)

• silenceTimeout-Eigenschaft⇒ Zeit in ms, ab der „stumm geschaltet wird“

(default 2000)


Microphone-Klasse: Methoden

• Methoden

• setSilenceLevel(level, timeout)

• Stummschaltung konfigurieren

• setLoopBack( true|false )

• aufgenommenes Audio direkt Wiedergeben?

• setUseEchoSuppression( true|false)

• Echounterdrückung (de-)aktivieren


ActionScriptText

Grundlagen Text nutzen

• TextField-Klasse

• zur Anzeige und zur Eingabe von Text

• Basis verschiedener Flash-„Komponenten“ (TextArea, TextInput,...)

• Formatierung über CSS oder Klasse TextFormat

• Flash Text-Engine-Klassen

• fortgeschrittene lowlevel Funktionen für Textdarstellung

• Klassen: TextBlock, TextElement, FonDescription, ElementFormat,...

• auch nicht lateinische Zeichner über Unicode

• andere Textrichtungen möglich (Arabisch, Chinesisch,..)

• Kerning, Tracking, BaselineShift,...

• u.v.m.

medienproduktion/interactive-media/flash/actionscript/text/grundlagen

Textelemente erzeugen

• in ActionScript

• z.B.:var text:TextField = new TextField();text.text = "Hallo Welt!";addChild(text);

• in Flash-IDE


Text in der Flash-IDE

• drei Optionen

• Dynamischer Text

• zur Laufzeit änderbar (mit AS)

• kein Editieren durch Benutzer

• Statischer Text

• für statische, „unveränderliche“ Beschriftungen

• für optimal kleinen BytecodeText bleibt Text, eingebettete Schriften möglich, nur genutzte Zeichen möglich

• Eingabetext

• zur Laufzeit durch Benutzer editierbar

• ideal für Formulare o.Ä.


Code-Beispiel: Textformatierung AS


ActionScriptLoader & URLLoader

Loader

• URLLoader-Klasse

• um externe Daten als Text oder binär zu laden

• für Textdateien, XML, u.v.m.

• Events informieren über Ladestatus

• Loader-Klasse

• um SWF oder Bilddateien zu laden und anzuzeigen(GIF, JPEG, PNG, SWF)

• Loader ist ein Anzeigeobjekt ⇒ kann direkt zur Anzeigeliste zugefügt werden

⇒ addChild( loader );

• über LoaderInfo-Events können Beginn, Fortschritt und Ende des Ladevorgangs verfolgt werden

medienproduktion/interactive-media/flash/actionscript/loader/grundlagen

ActionScriptBitmaps verwenden

Grundlagen Bitmaps nutzen

• Unterstützung für BMP, GIF, JPG, PNG und TIFF

• direkte Unterstützung für Transparenz in GIF / PNG

• unabhängig davon: BitMap-Klasse bietet 8-Bit Alphakanal

• wesentliche Klassen: BitMap und BitMapData

• BitMap-Klasse: Anzeige-Objekt, kann DisplayList zugefügt werden

• BitMapData-Klasse enthält Pixeldaten

medienproduktion/interactive-media/flash/actionscript/bitmaps/grundlagen

Bitmap erstellen & anzeigen: Code-Snippet


Code:

Ergebnis:

FüllfarbeTransparenz?Pixelauflösung

Laden externer Bilder

• Loader()-Klasse realisiert in Flash einladen externer Daten

• Schritte (pseudo-Code)

• Loader-Objekt erzeugen

• URLRequest-Objekt für Bilddatei erzeugen (Pfad | URL)

• Loader.load( URLRequest(„dateiname“)

• addChild( Loader )


Laden externer Bilder


ActionScriptFilter

Filter

• Transformations-Funktionen ähnlich den Filtern in Photoshop

• Original-Pixel ⇒ Filterfunktion ⇒ geänderte Pixel

• Anwendung auf Bitmaps und Vektoren möglich

medienproduktion/interactive-media/flash/actionscript/filter/grundlagen

Quelle: http://www.republicofcode.com/tutorials/flash/as3filters/

http://www.republicofcode.com/tutorials/flash/as3filters/

http://www.republicofcode.com/tutorials/flash/as3filters/

Filter nutzen

• Schritte

• ein oder mehrere Filter-Objekte erzeugen

• FilterArry der filters-Eigenschaft des Anzeige-Objekts zuweisen

• Filter-Objekt erzeugen


Filter: Code-Beispiel


ÜbungFilter - „interactive blur“

Übung - Ziele und Arbeitsschritte

• Ziele

• Filter am Beispiel anwenden lernen

• Text: zunehmende Unschärfe bei Rollover, Schärfe bei Rollout

• Arbeitsschritte

• Flash-Datei mit Textfeld anlegen

• mit Dokument-Klasse verknüpfen

• Weichzeichner-Filter anlegen

• Events / Event-Handler für Textfeld ( MOUSE_OVER, MOUSE_OUT )

• in Event-Handler Event-Typ merken

• Timer-Event schärft/zeichnet weich abhängig von Event-Typ

medienproduktion/interactive-media/flash/actionscript/filter/übung01

Übung: Code-Auszug


los geht‘s....Filter - „interactive blur“

ActionScriptPixel-Bender-Shader

Grundlagen Pixel-Bender

• Plugin-Architektur zur Erstellung / Nutzung von Filtern

• Software-übergreifend: Photoshop, After Effects und Flash

• Hardware-Beschleunigung über MultiCore und GPU-Support

• hardware-unabhängige Kernel-Sprache für Bildmanipulationen

• XML-basierte Graph-Sprache zur Kombination von Operationen zu komplexen Filtern

medienproduktion/interactive-media/flash/actionscript/pixel-bender/grundlagen

Pixel-Bender-Filter entwickeln

• Pixel-Bender Toolkit erlaubt außerhalb Flash Entwicklung von Pixel-Bender Filtern

• Pixel Bender Utility kompiliert in Bytecode (PBJ)

• Flash-Player kann PBJ ausführen (an V.10)

• Pixel Bender Exchange zum Austausch von Pixel Bender Filternhttp://www.adobe.com/cfusion/exchange/index.cfm?event=productHome&exc=26

•


http://www.adobe.com/cfusion/exchange/index.cfm?event=productHome&exc=26

http://www.adobe.com/cfusion/exchange/index.cfm?event=productHome&exc=26

Pixel-Bender Beispiele


Quelle: alle Beispiele aus Adobe Pixel bender Exchange

that‘s it...danke und schöne fleißige Semesterferien

Medienproduktion Sommersemester 2010 - fue-wiki.tubit.tu...

Documents

Transcript of Medienproduktion Sommersemester 2010 - fue-wiki.tubit.tu...